Create the Queue page.

source/queue/index.html

@@ -0,0 +1,47 @@
+{% extends "source/includes/base.html" %}
+{% import "source/includes/macros.html" as macros %}
+
+{% set title = "Queue ⇥" %}
+
+{% block head %}
+<link rel="stylesheet" href="/scss/queue/queue.scss">
+{% endblock %}
+
+{% block body %}
+<header class="page-header">
+  <h1>
+    <span class="icon">⇥</span>
+    Queue
+  </h1>
+  <p class="byline">Effortless temporary bookmarks.</p>
+</header>
+
+<main class="page-main">
+  <p class="store-links">
+    <a title="Get Queue for Firefox"
+      href="https://addons.mozilla.org/firefox/addon/holllo-queue">
+      <img src="../assets/mozilla-addons.png" alt="Get Queue for Firefox">
+    </a>
+    <a title="Get Queue for Chrome"
+      href="https://chrome.google.com/webstore/detail/queue/epnbikemcmienphlfmidkimpjnmohcbl">
+      <img src="../assets/chrome-web-store.png" alt="Get Queue for Chrome">
+    </a>
+    <a title="Get Queue for Edge"
+      href="https://microsoftedge.microsoft.com/addons/detail/queue/aanjampfdpcnhoeglmfefmmegdbifaak">
+      <img src="../assets/microsoft.png" alt="Get Queue for Edge">
+    </a>
+  </p>
+
+  <img class="screenshot" alt="Queue Screenshot" title="Queue Screenshot"
+    src="../assets/queue-screenshot.png">
+</main>
+
+<footer class="page-footer">
+  &copy;
+  <a href="https://git.bauke.xyz/Holllo/queue">AGPL-3.0-or-later</a>
+  💖
+  <a href="mailto:helllo@holllo.org">helllo@holllo.org</a>
+  📚
+  <a href="https://git.bauke.xyz/Holllo/queue/wiki">Wiki</a>
+</footer>
+{% endblock %}

source/scss/mixins.scss

@@ -1,12 +1,12 @@
 $medium-breakpoint: 900px;
 $large-breakpoint: 1200px;
 
-@mixin responsive-container {
+@mixin responsive-container($width-breakpoint: $large-breakpoint) {
   margin-left: auto;
   margin-right: auto;
-  width: $large-breakpoint;
+  width: $width-breakpoint;
 
-  @media (max-width: $large-breakpoint) {
+  @media (max-width: $width-breakpoint) {
     width: 100%;
   }
 }

source/scss/queue/queue.scss

@@ -0,0 +1,77 @@
+@use '../mixins';
+
+body {
+  padding: var(--spacing-16);
+}
+
+.page-header {
+  @include mixins.responsive-container($width-breakpoint: 600px);
+
+  margin-bottom: var(--spacing-16);
+
+  h1 {
+    align-items: center;
+    border: 1px solid var(--foreground-2);
+    display: flex;
+    font-size: 2.5rem;
+    margin-bottom: var(--spacing-08);
+  }
+
+  .icon {
+    align-items: center;
+    background-color: var(--df-2);
+    color: var(--db-1);
+    display: inline-flex;
+    height: 4.5rem;
+    justify-content: center;
+    margin-right: var(--spacing-08);
+    width: 4.5rem;
+  }
+
+  .byline {
+    background-color: var(--background-2);
+    font-weight: bold;
+    padding: var(--spacing-08);
+    text-align: center;
+  }
+}
+
+.page-main {
+  @include mixins.responsive-container($width-breakpoint: 900px);
+
+  margin-bottom: var(--spacing-16);
+  display: flex;
+  flex-direction: column;
+
+  .store-links {
+    align-items: center;
+    display: flex;
+    gap: var(--spacing-08);
+    justify-content: center;
+    margin-bottom: var(--spacing-16);
+
+    @media (max-width: 600px) {
+      flex-direction: column;
+    }
+
+    a {
+      padding: var(--spacing-04);
+      text-decoration: none;
+    }
+
+    img {
+      display: block;
+      height: fit-content;
+    }
+  }
+
+  .screenshot {
+    border: 1px solid var(--foreground-2);
+  }
+}
+
+.page-footer {
+  @include mixins.responsive-container($width-breakpoint: 600px);
+
+  text-align: center;
+}

source/static/_redirects

@@ -0,0 +1,6 @@
+# Redirect any non-existing files to /
+/* / 200
+
+# Redirect projects to Gitea
+/fangs/gitea https://git.bauke.xyz/Holllo/fangs 301
+/queue/gitea https://git.bauke.xyz/Holllo/queue 301

vite.config.ts

@@ -13,6 +13,12 @@ export default defineConfig({
   build: {
     minify: false,
     outDir: buildDir,
+    rollupOptions: {
+      input: {
+        home: path.join(sourceDir, 'index.html'),
+        queue: path.join(sourceDir, 'queue/index.html'),
+      },
+    },
     sourcemap: true,
   },
   plugins: [
@@ -22,5 +28,6 @@ export default defineConfig({
       },
     }),
   ],
+  publicDir: path.join(sourceDir, 'static'),
   root: sourceDir,
 });