Add initial download page

fooyin · Jun 12, 2024 · 21cc678 · 21cc678
1 parent cc220b4
commit 21cc678
Show file tree

Hide file tree

Showing 3 changed files with 63 additions and 0 deletions.
diff --git a/_data/navigation-left.yml b/_data/navigation-left.yml
@@ -1,2 +1,4 @@
 - link: /
   name: Overview
+- link: /download
+  name: Download
diff --git a/assets/css/main.css b/assets/css/main.css
@@ -5,6 +5,9 @@
   --base-color-text: hsl(0, 0%, 2.7%);
   --base-color-text-title: hsl(0, 0%, 2.7%);
 
+  --primary-color: hsl(201.6, 45.1%, 40%);
+  --primary-color-text: hsl(0, 0%, 100%, 0.9);
+
   --navbar-link-color: hsl(0, 0%, 2.7%);
   --navbar-link-active-color: hsl(201.6, 45.1%, 40%);
 
@@ -14,6 +17,8 @@
   --footer-color: var(--base-color-text);
   --footer-background-color: var(--navbar-background-color);
 
+  --button-background-color: hsl(0, 0%, 100%);
+
   --default-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
     Oxygen-Sans, Ubuntu, Cantarell, sans-serif;
   --header-font-family: Roboto, sans-serif;
@@ -37,6 +42,8 @@
     --navbar-background-color: hsl(210, 9.3%, 28.2%);
     --footer-color: var(--base-color-text);
     --footer-background-color: var(--navbar-background-color);
+
+    --button-background-color: hsl(210, 5%, 21%);
   }
 
   .nav-logo {
@@ -330,3 +337,31 @@ footer {
 .footer-container {
   flex-direction: column;
 }
+
+.btn {
+  background-color: var(--button-background-color);
+  box-shadow: var(--base-shadow);
+  font-size: 16px;
+  display: inline-block;
+  text-decoration: none;
+  font-weight: bold;
+}
+
+.btn.btn-download {
+  background-color: var(--navbar-background-color);
+  text-align: center;
+}
+
+.btn.btn-download > .download-title {
+  color: var(--base-color-text-title);
+  display: inline-block;
+  padding: 16px 32px;
+}
+
+.btn.btn-download > .download-hint {
+  background-color: var(--primary-color);
+  color: var(--primary-color-text);
+  display: inline-block;
+  padding: 16px;
+  min-width: 46px;
+}
diff --git a/pages/download.html b/pages/download.html
@@ -0,0 +1,26 @@
+---
+permalink: download
+title: "Download | fooyin"
+layout: default
+---
+
+{% include header.html %}
+
+<div class="container-text">
+    <h2 class="title">Download</h2>
+    <h3 class="title">Linux</h3>
+    <p>fooyin is available on the Flathub store:
+    </p>
+    <a href="https://flathub.org/apps/details/org.fooyin.fooyin" target="_blank" rel="noopener noreferrer">
+        <img alt="Download on Flathub" height="70" src="https://flathub.org/assets/badges/flathub-badge-en.png"></a>
+    <h3 class="title">Source</h3>
+    <p>For building from source, follow the instructions in BUILD.md for the latest release:</p>
+    <a class="btn btn-download" href="https://github.com/ludouzi/fooyin/archive/refs/tags/v0.4.5.tar.gz" target="_blank"
+        rel="noopener noreferrer">
+        <div class="download-title">
+            fooyin - src</div>
+        <div class="download-hint">0.4.5</div>
+    </a>
+</div>
+
+{% include footer.html %}