css cleanup, added downloads page

go.mod

@@ -1,4 +1,4 @@
-module git.matterlinux.xyz/Matterlinux/website
+module git.matterlinux.xyz/Matter/website
 
 go 1.21.4
 

lib/util.go

@@ -34,6 +34,7 @@ func ParseMarkdown(md string) string {
   ext |= blackfriday.BackslashLineBreak
   ext |= blackfriday.Strikethrough
   ext |= blackfriday.Tables
+  ext |= blackfriday.NoEmptyLineBeforeBlock
 
   return string(blackfriday.Run([]byte(md), blackfriday.WithExtensions(ext)))
 }

main.go

@@ -21,8 +21,8 @@
 package main
 
 import (
-	"git.matterlinux.xyz/Matterlinux/website/lib"
+	"git.matterlinux.xyz/Matter/website/lib"
-	"git.matterlinux.xyz/Matterlinux/website/routes"
+	"git.matterlinux.xyz/Matter/website/routes"
 	"github.com/gofiber/fiber/v2"
 	"github.com/gofiber/fiber/v2/log"
 	"github.com/gofiber/template/html/v2"
@@ -38,6 +38,7 @@ func main(){
   app.Static("/assets", "./content/assets")
 
   app.Get("/", routes.IndexRoute)
+  app.Get("/download", routes.DownloadRoute)
 
   app.Get("/news", routes.NewsRoute)
   app.Get("/news/:id", routes.PostRoute)

public/download.css

@@ -0,0 +1,37 @@
+.list {
+  display: flex;
+  flex-direction: column;
+  margin: 15px 0 15px 0;
+  gap: 10px;
+}
+
+.entry {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  background: var(--dark-second);
+  border: solid 1px var(--bright-main);
+  padding: 10px;
+}
+
+.downloads {
+  display: flex;
+  flex-direction: row;
+  gap: 5px;
+}
+
+.entry h1 {
+  color: var(--bright-main);
+  font-size: 20px;
+}
+
+.entry a, .entry p {
+  color: var(--bright-main);
+  font-size: 20px;
+  text-decoration: none;
+}
+
+.entry a:hover {
+  color: var(--bright-second);
+}

public/error.css

@@ -0,0 +1,14 @@
+.error {
+  text-align: center;
+}
+
+.error h1{
+  font-size: 30px;
+  color: white;
+  margin: 50px 50px 10px 50px;
+}
+
+.error a{
+  font-size: 25px;
+  color: var(--bright-second);
+}

public/global.css

@@ -0,0 +1,70 @@
+@import url("/font.css");
+
+:root {
+  --dark-main: black;
+  --dark-second: #090909;
+  --dark-third: #181818;
+  --bright-main: white;
+  --bright-second: #DFDFDF;
+  --bright-third: #777777;
+}
+
+::selection {
+  background: rgba(150, 150, 150, 0.4);
+}
+
+*{
+  padding: 0;
+  font-family: Ubuntu;
+  margin: 0;
+}
+
+body{
+  background: var(--dark-main);
+  padding-bottom: 80px;
+}
+
+.bar {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  background: var(--dark-second);
+  padding: 20px;
+  border-bottom: solid 1px var(--bright-main);
+}
+
+.logo {
+  font-family: JetBrainsItalic;
+  font-size: 25px;
+  color: white;
+}
+
+.links {
+  display: block;
+  text-align: right;
+}
+
+.links a{
+  margin-left: 7px;
+  color: var(--bright-main);
+  font-family: Ubuntu;
+  font-size: 20px;
+  text-decoration: none;
+}
+
+.links a:hover {
+  color: var(--bright-second);
+}
+
+main {
+  padding: 10px 20% 0% 20%;
+  color: var(--bright-second);
+}
+
+@media only screen and (max-width: 1200px) {
+  main {
+    padding: 10px 10% 0% 10%;
+    color: var(--bright-second);
+  }
+}

public/md.css

@@ -3,13 +3,13 @@
 .md h3{
   font-family: JetBrainsMono;
   color: var(--bright-main);
-  margin: 30px 0px 0px 0px;
   font-weight: 900;
 }
 
 .md h1::before, 
 .md h2::before,
 .md h3::before{
+  font-weight: 100;
   color: var(--bright-third);
 }
 
@@ -27,14 +27,17 @@
 
 .md h1 {
   font-size: 30px;
+  margin-top: 50px;
 }
 
 .md h2 {
   font-size: 25px;
+  margin-top: 40px;
 }
 
 .md h3 {
   font-size: 20px;
+  margin-top: 30px;
 }
 
 .md p {
@@ -42,6 +45,7 @@
   color: var(--bright-second);
   line-height: 28px;
   letter-spacing: .01em;
+  margin-top: 7px;
 }
 
 .md strong {
@@ -51,7 +55,7 @@
 
 .md a {
   color: var(--bright-second);
-  text-decoration-thickness: 1px;
+  text-decoration-thickness: .01px;
 }
 
 .md b {
@@ -108,11 +112,12 @@
 .md table td{
   font-size: 20px;
   padding: 6px 13px;
+  background: var(--dark-second);
   border: 1px solid var(--bright-second);
 }
 
 .md table tr {
-  background-color: var(--dark-second);
+  background-color: var(--dark-main);
   border-top: 1px solid var(--bright-second);
 }
 
@@ -123,3 +128,33 @@
 .md li {
   line-height: 30px;
 }
+
+.md .red {
+  color: #FF2020;
+}
+
+.md .green {
+  color: #20FF20;
+}
+
+.md .blue {
+  color: #2020FF;
+}
+
+.md blockquote {
+  margin: 0;
+  border-left: .25em solid var(--bright-third);
+  background: var(--dark-second);
+  border-radius: 6px;
+  padding: 20px;
+  margin-top: 16px;
+  margin-bottom: 16px;
+}
+
+.md blockquote>:first-child {
+  margin-top: 0;
+}
+
+.md blockquote>:last-child {
+  margin-bottom: 0;
+}

public/news.css

@@ -0,0 +1,29 @@
+main {
+  display: flex;
+  flex-direction: column;
+  padding-top: 50px;
+  gap: 10px;
+}
+
+@media only screen and (max-width: 1200px) {
+  main {
+    padding-top: 50px;
+  }
+}
+
+.small {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  color: white;
+  padding: 20px;
+  background: var(--dark-second);
+  border: solid 1px var(--bright-second);
+  text-decoration: none;
+}
+
+.small h1 {
+  font-size: 20px;
+  font-weight: 400;
+}

public/post.css

@@ -0,0 +1,5 @@
+.subtext {
+  font-size: 18px;
+  color: var(--bright-main);
+  margin: 5px 0 15px 0;
+}

public/style.css

@@ -1,136 +0,0 @@
-@import url("/font.css");
-
-:root {
-  --dark-main: black;
-  --dark-second: #070707;
-  --dark-third: #151515;
-  --bright-main: white;
-  --bright-second: #DFDFDF;
-  --bright-third: #777777;
-}
-
-::selection {
-  background: rgba(150, 150, 150, 0.4);
-}
-
-*{
-  padding: 0;
-  font-family: Ubuntu;
-  margin: 0;
-}
-
-body{
-  background: var(--dark-main);
-  padding-bottom: 50px;
-}
-
-.bar {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  background: var(--dark-second);
-  padding: 20px;
-  border-bottom: solid 1px white;
-}
-
-.logo {
-  font-family: JetBrainsItalic;
-  font-size: 25px;
-  color: white;
-}
-
-.links {
-  display: flex;
-  flex-direction: row;
-  gap: 10px;
-}
-
-.links a{
-  color: var(--bright-main);
-  font-family: Ubuntu;
-  font-size: 20px;
-  text-decoration: none;
-}
-
-.links a:hover {
-  color: var(--bright-second);
-}
-
-.readme {
-  padding: 25px 20% 0% 20%;
-  color: var(--bright-second);
-}
-
-.post {
-  padding: 40px 20% 0% 20%;
-  color: var(--bright-second);
-}
-
-.news {
-  display: flex;
-  flex-direction: column;
-  padding: 40px 20% 0% 20%;
-  gap: 10px;
-}
-
-@media only screen and (max-width: 1200px) {
-  .readme {
-    padding: 25px 10% 0% 10%;
-    color: var(--bright-second);
-  }
-
-  .post {
-    padding: 40px 10% 0% 10%;
-    color: var(--bright-second);
-  }
-
-  .news {
-    display: flex;
-    flex-direction: column;
-    padding: 40px 10% 0% 10%;
-  }
-}
-
-.new-small {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  color: white;
-  padding: 20px;
-  background: var(--dark-second);
-  border: solid 1px var(--bright-second);
-  text-decoration: none;
-}
-
-.new-small h1 {
-  font-size: 20px;
-  font-weight: 400;
-}
-
-.error {
-  text-align: center;
-}
-
-.error h1{
-  font-size: 30px;
-  color: white;
-  margin: 50px 50px 10px 50px;
-}
-
-.error a{
-  font-size: 25px;
-  color: var(--bright-second);
-}
-
-.post h1 {
-  font-size: 30px;
-  color: var(--bright-main);
-}
-
-.post p {
-  font-size: 18px;
-  color: var(--bright-main);
-  margin: 5px 0px 10px 0px;
-}

routes/download.go

@@ -0,0 +1,19 @@
+package routes
+
+import (
+	"git.matterlinux.xyz/Matter/website/lib"
+	"github.com/gofiber/fiber/v2"
+	"github.com/gofiber/fiber/v2/log"
+)
+
+func DownloadRoute(c *fiber.Ctx) error{
+  con, err := lib.GetContent("", "download")
+  if err != nil {
+    log.Error("GetContent -> ", err)
+    return lib.RenderError(c, 500)
+  }
+
+  return c.Render("download", fiber.Map{
+    "readme": con,
+  })
+}

routes/index.go

@@ -1,7 +1,7 @@
 package routes
 
 import (
-	"git.matterlinux.xyz/Matterlinux/website/lib"
+	"git.matterlinux.xyz/Matter/website/lib"
 	"github.com/gofiber/fiber/v2"
 	"github.com/gofiber/fiber/v2/log"
 )

routes/news.go

@@ -3,7 +3,7 @@ package routes
 import (
 	"sort"
 
-	"git.matterlinux.xyz/Matterlinux/website/lib"
+	"git.matterlinux.xyz/Matter/website/lib"
 	"github.com/gofiber/fiber/v2"
 	"github.com/gofiber/fiber/v2/log"
 )

routes/wiki.go

@@ -1,7 +1,7 @@
 package routes
 
 import (
-	"git.matterlinux.xyz/Matterlinux/website/lib"
+	"git.matterlinux.xyz/Matter/website/lib"
 	"github.com/gofiber/fiber/v2"
 	"github.com/gofiber/fiber/v2/log"
 )

templates/download.html

@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>MatterLinux | Download</title>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=1200">
+    <link href="/global.css" rel="stylesheet">
+    <link href="/download.css" rel="stylesheet">
+    <link href="/md.css" rel="stylesheet">
+  </head>
+  <body>
+    {{template "parts/bar" .}}
+    <main>
+      <div class="md">
+        <h1>Download MatterLinux</h1>
+      </div>
+      <div class="list">
+        <div class="entry">
+          <h1>Version</h1>
+          <h1>{{.readme.Title}}</h1>
+        </div>
+        <div class="entry">
+          <h1>Release Archive</h1>
+          <div class="downloads">
+            <a href="https://rel.matterlinux.xyz/{{.readme.Title}}/matterlinux_{{.readme.Title}}.tar.gz">Download</a>
+            <p>|</p>
+            <a href="https://rel.matterlinux.xyz/{{.readme.Title}}/matterlinux_{{.readme.Title}}.tar.gz.sig">Signature</a>
+          </div>
+        </div>
+        <div class="entry">
+          <h1>Release ISO</h1>
+          <div class="downloads">
+            <a href="https://rel.matterlinux.xyz/{{.readme.Title}}/matterlinux_{{.readme.Title}}.iso">Download</a>
+            <p>|</p>
+            <a href="https://rel.matterlinux.xyz/{{.readme.Title}}/matterlinux_{{.readme.Title}}.iso.sig">Signature</a>
+         </div>
+        </div>
+      </div>
+      <div class="readme md">
+        {{.readme.HTML}}
+      </div>
+    </main>
+  </body>
+</html>

templates/index.html

@@ -4,13 +4,13 @@
     <title>MatterLinux</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=1200">
-    <link href="/style.css" rel="stylesheet">
+    <link href="/global.css" rel="stylesheet">
     <link href="/md.css" rel="stylesheet">
   </head>
   <body>
     {{template "parts/bar" .}}
-    <div class="readme md">
+    <main class="md">
       {{.readme.HTML}}
-    </div>
+    </main>
   </body>
 </html>

templates/news.html

@@ -4,17 +4,18 @@
     <title>MatterLinux | News</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=1200">
-    <link href="/style.css" rel="stylesheet">
+    <link href="/global.css" rel="stylesheet">
+    <link href="/news.css" rel="stylesheet">
   </head>
   <body>
     {{template "parts/bar" .}}
-    <div class="news">
+    <main>
-      {{range $new := .news}}
+      {{range .news}}
-        <a href="/news/{{$new.ID}}" class="new-small">
+        <a href="/news/{{.ID}}" class="small">
-          <h1>{{$new.Date}}</h1>
+          <h1>{{.Date}}</h1>
-          <h1>{{$new.Title}}</h1>
+          <h1>{{.Title}}</h1>
         </a>
       {{end}}
-    </div>
+    </main>
   </body>
 </html>

templates/parts/bar.html

@@ -6,5 +6,6 @@
     <a href="/wiki">Wiki</a>
     <a href="https://git.matterlinux.xyz/Matter">Source</a>
     <a href="https://tracker.matterlinux.xyz">Packages</a>
+    <a href="/download">Download</a>
   </div>
 </div>

templates/post.html

@@ -4,17 +4,20 @@
     <title>MatterLinux | {{.title}}</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=1200">
-    <link href="/style.css" rel="stylesheet">
+    <link href="/global.css" rel="stylesheet">
+    <link href="/post.css" rel="stylesheet">
     <link href="/md.css" rel="stylesheet">
   </head>
   <body>
     {{template "parts/bar" .}}
-    <div class="post">
+    <main>
-      <h1>{{.post.Title}}</h1>
+      <div class="md">
-      <p>{{.post.Date}} | by {{.post.Author}}</p>
+        <h1>{{.post.Title}}</h1>
+      </div>
+      <p class="subtext">{{.post.Date}} | by {{.post.Author}}</p>
       <div class="md">
         {{.post.HTML}}
       </div>
-    </div>
+    </main>
   </body>
 </html>