Added projects page.

Pages/Bits/Navbar.php

@@ -9,6 +9,10 @@ $NavbarPages = [
         "Href" => "/Pages/Sarahtonin.html",
         "Icon" => "Sarahtonin.png"
     ],
+    "Projects" => [
+        "Href" => "/Pages/Projects.html",
+        "Icon" => "Projects.png"
+    ],
     "Garden" => [
         "Href" => "/Pages/Garden.html",
         "Icon" => "Garden.png"

Pages/Projects.php

@@ -0,0 +1,82 @@
+<?php
+
+$PageTitle = "Projects";
+
+$DownloadBase = "https://view.srhtnin.garden/api/download?Root=Files&Path=Shared/";
+
+
+?>
+
+<!DOCTYPE html>
+
+<html lang="en" data-palette="CatppuccinMocha">
+    <?php require __DIR__ . "/Bits/Head.php"; ?>
+
+    <body>
+        <?php require __DIR__ . "/Bits/Navbar.php"; ?>
+
+        <main class="MainContainer">
+            <h1 id="Projects">Projects</h1>
+
+            <p>
+                These are some of the things I've made that you can download and try for yourself.
+            </p>
+
+            <h2 id="Apeiron">Apeiron</h2>
+
+            <p>
+                A game I'm making in Godot.
+                "You are naught but walking flesh."
+                Download the version for your operating system, run it, and have fun!
+            </p>
+
+            <div class="DownloadButtons">
+                <a
+                    class="ActionButton DownloadButton DownloadButtonWindows"
+                    href="<?= htmlspecialchars($DownloadBase . "Apeiron/Apeiron.exe", ENT_QUOTES, "UTF-8") ?>"
+                    download
+                >
+                    Windows
+                    <span class="DownloadButtonFile">Apeiron.exe</span>
+                </a>
+
+                <a
+                    class="ActionButton DownloadButton DownloadButtonLinux"
+                    href="<?= htmlspecialchars($DownloadBase . "Apeiron/Apeiron.x86_64", ENT_QUOTES, "UTF-8") ?>"
+                    download
+                >
+                    Linux
+                    <span class="DownloadButtonFile">Apeiron.x86_64</span>
+                </a>
+            </div>
+
+            <p>
+                On Linux, you might have to make the file executable first:
+            </p>
+
+            <pre><code>chmod +x Apeiron.x86_64</code></pre>
+
+            <h2 id="SaraSuite">SaraSuite</h2>
+
+            <p>
+                Installs, updates and removes my Sara programs.
+                It's a single AppImage: download it, run it, and pick a program.
+                Your own config edits are kept when a program updates,
+                and removing a program takes out everything it installed.
+            </p>
+
+            <div class="DownloadButtons">
+                <a
+                    class="ActionButton DownloadButton DownloadButtonLinux"
+                    href="<?= htmlspecialchars($DownloadBase . "SaraSuite/SaraSuite-x86_64.AppImage", ENT_QUOTES, "UTF-8") ?>"
+                    download
+                >
+                    Linux
+                    <span class="DownloadButtonFile">SaraSuite-x86_64.AppImage</span>
+                </a>
+            </div>
+        </main>
+
+        <script src="/Scripts/Script.js"></script>
+    </body>
+</html>

Styles/Style.css

@@ -194,6 +194,37 @@ body {
     outline-offset: 3px;
 }
 
+.DownloadButtons {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 1rem;
+    margin-bottom: 1.5rem;
+}
+
+.DownloadButton {
+    display: flex;
+    flex-direction: column;
+    gap: 0.4rem;
+    width: auto;
+    min-width: 12rem;
+    padding: 0.75rem 1rem;
+    font-size: 1.25rem;
+    text-decoration: none;
+}
+
+.DownloadButtonWindows {
+    --ActionAccent: var(--Lavender);
+}
+
+.DownloadButtonLinux {
+    --ActionAccent: var(--Mauve);
+}
+
+.DownloadButtonFile {
+    font-size: 1rem;
+    color: var(--Subtext0);
+}
+
 h1, h2, h3, h4, h5, h6 {
     margin-top: 0;
     margin-bottom: 1rem;