3 files changed, 72 insertions(+), 10 deletions(-)

M src/index.11ty.js
A src/static/_headers
R src/static/{thames.gif => avatar.gif}

@@ 10,11 10,11 @@ export function render(data) {
           href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🥃</text></svg>"
           type="image/svg+xml"
         />
-        <link rel="preload" href="/thames.gif" as="image" />
+        <link rel="preload" href="/avatar.gif" as="image" />
         <link
           rel="preload"
           href="/font.woff2"
-          as="mono"
+          as="font"
           type="font/woff2"
           crossorigin="anonymous"
         />


@@ 29,6 29,7 @@ export function render(data) {
             padding: 0;
             height: 100%;
             font-size: clamp(1.2rem, 2vw, 2rem);
+            font-family: 'mono', monospace;
             background: #fdfdff;
             color: #0c0f12;
           }


@@ 47,7 48,6 @@ export function render(data) {
 
           section {
             line-height: 1.4;
-            font-family: 'mono', monospace;
             display: flex;
             align-items: center;
           }


@@ 60,7 60,7 @@ export function render(data) {
             height: 9em;
             width: 9em;
             image-rendering: pixelated;
-            background: #fff8e7;
+            background: #e6e6e8;
             border-radius: 30%;
           }
 


@@ 70,12 70,21 @@ export function render(data) {
           }
 
           a:focus {
-            background: #fff8e7;
-            outline: 2px solid #fff8e7;
+            background: #e6e6e8;
+            outline: 2px solid #e6e6e8;
             outline-offset: 0px;
             border-radius: 5px;
           }
 
+          footer {
+            display: flex;
+            margin-top: 1em;
+            border: 0.2em #e6e6e8 solid;
+            border-left: none;
+            border-right: none;
+            padding: 0.5em 0;
+            justify-content: space-evenly;
+          }
           @media (max-width: 600px) {
             section {
               flex-direction: column;


@@ 83,6 92,45 @@ export function render(data) {
             p {
               margin: 2em 0 0 0;
             }
+            footer {
+              justify-content: space-between;
+            }
+            footer a span {
+              display: none;
+            }
+          }
+
+          @media (prefers-color-scheme: dark) {
+            html,
+            body {
+              background: #0c0f12;
+              color: #bebec4;
+            }
+            img {
+              background: #191f26;
+            }
+
+            a {
+              color: #bebec4;
+            }
+
+            a:focus {
+              background: #1f272e;
+              outline: 2px solid #1f272e;
+            }
+
+            footer {
+              border-color: #191f26;
+            }
+          }
+
+          ::selection {
+            background: #00ffbf;
+            color: black;
+          }
+
+          .u-uid {
+            display: none;
           }
 
           @media (prefers-color-scheme: dark) {


@@ 114,16 162,25 @@ export function render(data) {
         <main class="h-card">
           <header></header>
           <section>
-            <img class="u-photo" src="/thames.gif" />
+            <img class="u-photo" src="/avatar.gif" />
             <p>
-              Welcome, I'm
-              <a class="u-url p-name" rel="me" href="https://tham.es">thames</a
-              >. This is my space on the web&nbsp;— simple, open, and indie.
+              Welcome, I'm thames. This is my space on the web&nbsp;— simple,
+              open, and indie.
               <span class="p-note">
                 I'm a Domain Name, Emacs, NESdev, and Whiskey enthusiast.
               </span>
             </p>
           </section>
+          <footer>
+            <a class="u-url u-uid p-name" href="/">thames</a>
+            <a class="u-url" href="/now">Now<span> Page</span></a>
+            <a class="u-url" href="https://bsky.app/profile/tham.es"
+              >B<span>lue</span>sky</a
+            >
+            <a class="u-url" href="https://git.sr.ht/~thames"
+              >S<span>ou</span>r<span>ce</span>h<span>u</span>t</a
+            >
+          </footer>
         </main>
       </body>
     </html>`

@@ 0,0 1,5 @@
+# Cache avatar.gif and font.woff2 for 1 year
+/avatar.gif
+  Cache-Control: public, max-age=31536000
+/font.woff2
+  Cache-Control: public, max-age=31536000