Init pt 2

author: Elizabeth Hunt <me@liz.coffee> 2025-12-18 21:18:16 -0800
committer: Elizabeth Hunt <me@liz.coffee> 2025-12-18 21:18:16 -0800
commit: ea31ae742a06966c9223b03a27a3c271263424a0 (patch)
tree: 81d8e0ff6e583629557897b6dc7b84d3f15c80ca /src
parent: 0888840cf20de2187095daa154ec441240a12ef3 (diff)
download: lizdotcoffee-ea31ae742a06966c9223b03a27a3c271263424a0.tar.gz
lizdotcoffee-ea31ae742a06966c9223b03a27a3c271263424a0.zip
17 files changed, 331 insertions, 56 deletions
diff --git a/src/_layouts/base.njk b/src/_layouts/base.njk
index 84df4f4..cc89f99 100644
--- a/src/_layouts/base.njk
+++ b/src/_layouts/base.njk
@@ -3,19 +3,67 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="icon" href="https://adelie.liz.coffee/img/favicon.ico" />
   <title>{% if title %}{{ title }} - {% endif %}liz.coffee</title>
-  <link rel="stylesheet" href="/assets/adelie.css">
+  <link rel="stylesheet" href="https://adelie.liz.coffee/bundle.css">
   <link rel="alternate" type="application/atom+xml" title="liz.coffee" href="/feed.xml">
+  <style>
+    .blinkie {
+      image-rendering: optimizeSpeed;
+      image-rendering: -moz-crisp-edges;
+      image-rendering: -o-crisp-edges;
+      image-rendering: -webkit-optimize-contrast;
+      image-rendering: pixelated;
+      image-rendering: optimize-contrast;
+      -ms-interpolation-mode: nearest-neighbor;
+      width: 150px;
+      height: 20px;
+    }
+    .blinkies {
+      display: flex;
+      justify-content: left;
+      flex-wrap: wrap;
+      max-width: 900px;
+      gap: 10px 10px;
+    }
+    .blinkie-linky:hover {
+      text-decoration: none !important;
+    }
+  </style>
   {% if pageStyles %}
   <style>{{ pageStyles | safe }}</style>
   {% endif %}
 </head>
 <body>
+  <header>
+    <nav>
+      <a href="/">Home</a>
+      <a href="/about">About</a>
+      <a href="/blog">Blog</a>
+      <a href="/resume">Resume</a>
+    </nav>
+    <input type="checkbox" id="theme-toggle" class="toggle" aria-label="Toggle dark mode" />
+  </header>
   <main>
-    {{ content | safe }}
+    <article>
+      {{ content | safe }}
+    </article>
   </main>
+  <footer>
+    <div class="blinkies">
+      <a class="blinkie-linky" href="https://liz.coffee">
+        <img class="blinkie" src="https://adelie.liz.coffee/img/blinkies/liz--coffee.gif">
+      </a>
 
-  <script src="/assets/adelie.js"></script>
+      <img class="blinkie" src="https://adelie.liz.coffee/img/blinkies/boys.gif">
+    </div>
+    <div class="text-center">
+      <img width="100" src="/assets/penguin.gif" />
+      <p>add <a href="/blinkies/add">your very own blinkie</a>!</p>
+    </div>
+  </footer>
+
+  <script src="https://adelie.liz.coffee/bundle.js"></script>
   {% if pageScripts %}
   <script>{{ pageScripts | safe }}</script>
   {% endif %}
diff --git a/src/about.njk b/src/about.njk
new file mode 100644
index 0000000..7a1e34f
--- /dev/null
+++ b/src/about.njk
@@ -0,0 +1,66 @@
+---
+layout: base.njk
+title: About
+---
+
+{% markdown %}
+
+## About Me
+
+### Me
+
+<div class="text-center">
+  <img width="200" src="/assets/bellevue.jpeg" />
+  <img width="200" src="/assets/critter.jpeg" />
+
+  <p><small><i>bellevue, washington across the water and a small critter.</i></small></p>
+</div>
+
+I'm programmer with a few years of industry software engineering under my belt, currently at AWS. I
+graduated from Utah State University in 2023 at 20 with a degree in CS and a minor in math. I live in Seattle with my partner
+and dog, Gus.
+
+### What I Do
+
+<div class="text-center">
+  <img width="200" src="/assets/bread.jpeg" />
+  <img width="200" src="/assets/scooters_on_ceiling.jpeg" />
+
+  <p><small><i>sourdough, and some lime scooters where they ought to be parked.</i></small></p>
+</div>
+
+Most of my days are spent designing, writing, and communicating about deep distributed software systems. A lot of it is plumbing.
+But every once in a while I find diamonds in the rough—those really deep technical topics that require the application of real theory,
+which somehow seem to go undiscovered.
+
+Those are the problems I chase. When I encounter them, I dive as far and work as hard as possible to uncover as much as possible. That often turns out to be a nothing-burger.
+But sometimes, underneath all the layers lies a tremendous find no one else would have caught. This part of my job is what I'm absolutely
+addicted to and get so much dopamine from, once that last puzzle piece clicks. It's what I've loved about computers
+most of my life; finding needles in haystacks.
+
+I also love baking sourdough bread. I love taking long uphill runs at the end of a day in the dark of night. I love reading and obsessively learning as much as I can about, objectively,
+the most fascinating creatures there are: penguins. I love getting entrenched in something fun until 2AM. I love the hot and slightly bitter touch of a sip of fresh brewed
+coffee, as well as the blissful sweetness of a mocha. I love going on dates, taking long train rides, anime,
+Rubik's cubes, nice mechanical keyboards, music, collecting cute little stickers and stuffies, the coziness of a storm
+and being wrapped in a blanket.
+
+I guess my main goal in life is to not succumb to the problems with my brain. If I succeed at that for long enough, I
+want to live my life being as curious as I possibly can be. What that will ultimately look like, I don't really know. But
+ I think it is leaving the industry as fast as possible and comfortably researching and asking questions to my heart's
+content without care of prestige, money, or having to constantly deliver something to prove anything. I want to spend as
+much time on this earth without these worries and with people I love and feel at home with.
+
+At least, that's the dream. It has definitely not been smooth sailing up to this point.
+
+### Beliefs
+
+I hate what capitalism has done to warp our tools into something that destroys and rots
+us. Devices that once made our lives a bit easier and pushed forward the frontier of science and math now watch us with as much detail as
+can be recorded.
+
+AI is a peak example of this rot, used to justify ripping wealth and productivity from the laborer and pluck the creativity straight
+from their heads, while the most wealthy profit from cutting them out entirely.
+
+But if you're here you're likely already aware of these issues and probably share similar views in which case I don't need to go any further...
+
+{% endmarkdown %}
diff --git a/src/assets/bellevue.jpeg b/src/assets/bellevue.jpeg
new file mode 100644
index 0000000..0c68197
--- /dev/null
+++ b/src/assets/bellevue.jpeg
diff --git a/src/assets/bread.jpeg b/src/assets/bread.jpeg
new file mode 100644
index 0000000..e9f4021
--- /dev/null
+++ b/src/assets/bread.jpeg
diff --git a/src/assets/critter.jpeg b/src/assets/critter.jpeg
new file mode 100644
index 0000000..168dde4
--- /dev/null
+++ b/src/assets/critter.jpeg
diff --git a/src/assets/gus.jpeg b/src/assets/gus.jpeg
new file mode 100644
index 0000000..1cdae76
--- /dev/null
+++ b/src/assets/gus.jpeg
diff --git a/src/assets/penguin.gif b/src/assets/penguin.gif
new file mode 100644
index 0000000..48bd0e2
--- /dev/null
+++ b/src/assets/penguin.gif
diff --git a/src/assets/petting_basil.mp4 b/src/assets/petting_basil.mp4
new file mode 100644
index 0000000..5d1a556
--- /dev/null
+++ b/src/assets/petting_basil.mp4
diff --git a/src/assets/scooters_on_ceiling.jpeg b/src/assets/scooters_on_ceiling.jpeg
new file mode 100644
index 0000000..2b1e856
--- /dev/null
+++ b/src/assets/scooters_on_ceiling.jpeg
diff --git a/src/blinkies/add.njk b/src/blinkies/add.njk
new file mode 100644
index 0000000..9992041
--- /dev/null
+++ b/src/blinkies/add.njk
@@ -0,0 +1,154 @@
+---
+layout: base.njk
+title: Add a Blinkie!
+---
+
+<h2>Add your very own blinkie!</h2>
+<p>
+  Please allow us 1 to 10 business days to process your request. Your engagement
+  is very important to our shareholders.
+</p>
+
+<form
+  id="form"
+  method="POST"
+  action="https://posthook.liz.coffee/hook/add-a-blinkie"
+  enctype="multipart/form-data"
+>
+  <div class="form-group">
+    <label for="name">Name *</label>
+    <input
+      type="text"
+      id="name"
+      name="name"
+      placeholder="Elizabeth..."
+      required
+    />
+  </div>
+  <br />
+
+  <div class="form-group">
+    <label for="email">Email</label>
+    <p>
+      <small>
+        In case something goes wrong or you want to update the blinkie in the future and need to email <a href="mailto:me@liz.coffee">me</a>.
+      </small>
+    </p>
+    <input
+      type="email"
+      id="email"
+      name="email"
+      placeholder="me@liz.coffee..."
+    />
+  </div>
+  <br />
+
+  <div class="form-group">
+    <label for="description">Description *</label>
+    <p>
+      <small>
+         Please explain why you think this blinkie is a good addition to this site.
+        "I am cool as fuck yo" is a valid reason.
+      </small>
+    </p>
+    <input
+      type="text"
+      id="description"
+      name="description"
+      placeholder="I am cool as fuck yo..."
+      required
+    />
+  </div>
+  <br />
+
+  <div class="form-group">
+    <label for="gif">Blinkie *</label>
+    <p><small>Blinkie gif in 150px:20px or equivalent aspect ratio.</small></p>
+    <input
+      type="file"
+      id="gif"
+      name="gif"
+      accept="image/gif"
+      required
+    />
+    <label for="gif" class="file-input-button">
+      Browse Files
+    </label>
+
+  </div>
+  <br />
+
+  <div
+    class="h-captcha"
+    data-sitekey="70fc31c2-32a4-4304-8b5a-b492eba656ec"
+  ></div>
+
+  <br />
+
+  <input type="hidden" name="_redirect" value="https://liz.coffee/" />
+  <input id="_token" type="hidden" name="_token" />
+
+  <button type="submit">Submit</button>
+</form>
+
+<script src="https://hcaptcha.com/1/api.js" async defer></script>
+
+<script>
+  const form = document.getElementById("form");
+  const tokenInput = document.getElementById("_token");
+  const fileInput = document.getElementById("gif");
+  const fileName = document.getElementById("file-name");
+  const fileGroup = document.getElementById("file-group");
+
+  fileInput.addEventListener("change", () => {
+    if (fileInput.files.length > 0) {
+      fileName.textContent = fileInput.files[0].name;
+      fileGroup.classList.add("has-file");
+    } else {
+      fileName.textContent = "No file selected";
+      fileGroup.classList.remove("has-file");
+    }
+  });
+
+  form.addEventListener("submit", async (event) => {
+    event.preventDefault();
+    const hcaptchaResponse = hcaptcha.getResponse();
+    if (!hcaptchaResponse) {
+      alert("Please complete the hCaptcha before submitting.");
+      return;
+    }
+    try {
+      const tokenRes = await fetch(
+        "https://posthook.liz.coffee/hook/add-a-blinkie/token",
+        { credentials: "omit" }
+      );
+      const tokenData = await tokenRes.json();
+      const csrfToken = tokenData?.ok?.token;
+      if (!csrfToken) throw new Error("Missing token");
+      tokenInput.value = csrfToken;
+
+      const formData = new FormData(form);
+      const submitRes = await fetch(form.action, {
+        method: "POST",
+        body: formData,
+        headers: {
+          "H-Captcha-Response": hcaptchaResponse,
+          "X-CSRF-Token": csrfToken,
+        },
+        redirect: "manual",
+        credentials: "omit",
+      });
+
+      const redirectUrl = formData.get("_redirect");
+      if (typeof redirectUrl === "string" && redirectUrl.length > 0) {
+        window.location.assign(redirectUrl);
+        return;
+      }
+      const text = await submitRes.text();
+      if (!submitRes.ok) throw new Error(text || "Submit failed");
+    } catch (err) {
+      alert("Something went wrong. Please try again.");
+      hcaptcha.reset();
+    }
+  });
+</script>
diff --git a/src/blinkies/submitted.njk b/src/blinkies/submitted.njk
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/blinkies/submitted.njk
diff --git a/src/blog.njk b/src/blog.njk
new file mode 100644
index 0000000..272f29b
--- /dev/null
+++ b/src/blog.njk
@@ -0,0 +1,19 @@
+---
+layout: base.njk
+title: Blog
+permalink: /blog/
+---
+
+<h2>Liz's Ramblings</h2>
+
+{%- for post in collections.posts | reverse %}
+  <div style="display: flex; justify-content: space-between; align-items: baseline;">
+    <div class="text-left">
+      <a href="{{ post.url }}">{{ post.data.title }}</a>
+      {%- if post.data.subtitle %}
+      <br><small>{{ post.data.subtitle }}</small>
+      {%- endif %}
+    </div>
+    <time class="text-right" datetime="{{ post.date | dateToRfc3339 }}">{{ post.date.toLocaleDateString() }}</time>
+  </div>
+{%- endfor %}
diff --git a/src/feed.njk b/src/feed.njk
index b5c45e3..a8ae238 100644
--- a/src/feed.njk
+++ b/src/feed.njk
@@ -3,11 +3,11 @@ permalink: /feed.xml
 eleventyExcludeFromCollections: true
 metadata:
   title: liz.coffee
-  subtitle: A cute little blog with interactive toys
+  subtitle: elizabeth's ramblings
   url: https://liz.coffee/
   feedUrl: https://liz.coffee/feed.xml
   author:
-    name: Lizzy
+    name: emprespresso
 ---
 <?xml version="1.0" encoding="utf-8"?>
 <feed xmlns="http://www.w3.org/2005/Atom">
@@ -15,13 +15,12 @@ metadata:
   <subtitle>{{ metadata.subtitle }}</subtitle>
   <link href="{{ metadata.feedUrl }}" rel="self"/>
   <link href="{{ metadata.url }}"/>
-  <updated>{{ collections.all | getNewestCollectionItemDate | dateToRfc3339 }}</updated>
+  <updated>{{ collections.posts | getNewestCollectionItemDate | dateToRfc3339 }}</updated>
   <id>{{ metadata.url }}</id>
   <author>
     <name>{{ metadata.author.name }}</name>
   </author>
-  {%- for post in collections.all | reverse -%}
-  {%- if post.data.title -%}
+  {%- for post in collections.posts | reverse -%}
   <entry>
     <title>{{ post.data.title }}</title>
     <link href="{{ metadata.url }}{{ post.url }}"/>
@@ -29,6 +28,5 @@ metadata:
     <id>{{ metadata.url }}{{ post.url }}</id>
     <content type="html">{{ post.templateContent | htmlToAbsoluteUrls(metadata.url) }}</content>
   </entry>
-  {%- endif -%}
   {%- endfor -%}
 </feed>
diff --git a/src/index.njk b/src/index.njk
index 064c05e..59031d3 100644
--- a/src/index.njk
+++ b/src/index.njk
@@ -3,21 +3,31 @@ layout: base.njk
 title: Home
 ---
 
-<h1>liz.coffee</h1>
+<h2>Liz Dot Coffee</h2>
 
-<p>A cute little blog with interactive toys.</p>
+<p>
+  Hello! My name is Elizabeth (she/he). This is me on the best day of my life, meeting and petting penguins in San Diego. This other guy? That's Gus.
+</p>
+<div class="text-center">
+  <video height="200" autoplay loop controls muted>
+    <source src="/assets/petting_basil.mp4" type="video/mp4">
+    Your browser does not support the video tag.
+  </video>
+  <img height="200" src="/assets/gus.jpeg" />
+</div>
 
-<h2>Posts</h2>
+<br />
+<p>Together we run, bake bread, and chase squirrels. Sometimes I do computers while he snoozes.</p>
 
+<p>You can find me on the internet at these places:</p>
 <ul>
-{%- for post in collections.all | reverse -%}
-  {%- if post.data.title -%}
-  <li>
-    <a href="{{ post.url }}">{{ post.data.title }}</a>
-    {%- if post.data.date -%}
-    <span> - {{ post.data.date | date: "%Y-%m-%d" }}</span>
-    {%- endif -%}
-  </li>
-  {%- endif -%}
-{%- endfor -%}
+  <li><a href="https://twitter.com/emprespresso">twitter</a></li>
+  <li><a href="https://www.linkedin.com/in/emprespresso/">linkedin</a></li>
+  <li><a href="https://www.instagram.com/emprespresso/">instagram</a></li>
+  <li><a href="https://github.com/emprespresso">github</a> (Although, I try to do most of my side projecting <a href="https://code.liz.coffee">on my own infra</a>)</li>
+  <li><a href="mailto:me@liz.coffee">me@liz.coffee</a></li>
 </ul>
+
+<blockquote>
+  "Right," Holden said. "No coffee. This is a terrible, terrible planet."
+</blockquote>
diff --git a/src/posts/TBD.md b/src/posts/TBD.md
new file mode 100644
index 0000000..4de0c75
--- /dev/null
+++ b/src/posts/TBD.md
@@ -0,0 +1,8 @@
+---
+layout: base.njk
+title: Hello World
+subtitle: I've spent too much time on other stuff to write a first post on my blog recently but I have a lot I want to talk about so come back soon!
+date: 2025-12-14
+---
+
+## Hello World!
diff --git a/src/posts/hello-world.md b/src/posts/hello-world.md
deleted file mode 100644
index 22eef26..0000000
--- a/src/posts/hello-world.md
+++ /dev/null
@@ -1,34 +0,0 @@
----
-layout: base.njk
-title: Hello World
-date: 2025-12-14
----
-
-# Hello World!
-
-This is my first blog post. I can write regular markdown here.
-
-## Interactive Toy Example
-
-Here's a little interactive toy:
-
-<div id="color-toy" style="padding: 2rem; background: #f0f0f0; border-radius: 8px; text-align: center;">
-  <button id="change-color">Click me!</button>
-  <p id="color-display" style="margin-top: 1rem; font-weight: bold;">Color: #f0f0f0</p>
-</div>
-
-<script>
-  const btn = document.getElementById('change-color');
-  const display = document.getElementById('color-display');
-  const toy = document.getElementById('color-toy');
-
-  btn.addEventListener('click', () => {
-    const randomColor = '#' + Math.floor(Math.random()*16777215).toString(16);
-    toy.style.background = randomColor;
-    display.textContent = 'Color: ' + randomColor;
-  });
-</script>
-
-## More Content
-
-And I can continue writing markdown after the interactive bit!
diff --git a/src/resume.njk b/src/resume.njk
new file mode 100644
index 0000000..6d3bdd1
--- /dev/null
+++ b/src/resume.njk
@@ -0,0 +1,6 @@
+---
+layout: base.njk
+title: Resume
+---
+
+I'll add this if I need to.
author	Elizabeth Hunt <me@liz.coffee>	2025-12-18 21:18:16 -0800
committer	Elizabeth Hunt <me@liz.coffee>	2025-12-18 21:18:16 -0800
commit	ea31ae742a06966c9223b03a27a3c271263424a0 (patch)
tree	81d8e0ff6e583629557897b6dc7b84d3f15c80ca /src
parent	0888840cf20de2187095daa154ec441240a12ef3 (diff)
download	lizdotcoffee-ea31ae742a06966c9223b03a27a3c271263424a0.tar.gz lizdotcoffee-ea31ae742a06966c9223b03a27a3c271263424a0.zip