Initial scaffold: Hugo site for west575.org
Blog with contact form and newsletter signup, structured like the other Reground-hosted sites but with its own visual identity.
This commit is contained in:
@@ -0,0 +1,34 @@
|
||||
name: deploy
|
||||
on:
|
||||
push:
|
||||
branches: [master]
|
||||
jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-latest
|
||||
container:
|
||||
image: hugomods/hugo:exts
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
with:
|
||||
submodules: recursive
|
||||
- name: Install rsync + ssh client
|
||||
run: |
|
||||
if command -v apk >/dev/null; then
|
||||
apk add --no-cache rsync openssh-client
|
||||
else
|
||||
apt-get update && apt-get install -y rsync openssh-client
|
||||
fi
|
||||
- run: hugo --minify -d public
|
||||
- name: Deploy via rsync
|
||||
run: |
|
||||
mkdir -p ~/.ssh
|
||||
printf '%s\n' "$DEPLOY_SSH_KEY" > ~/.ssh/deploy_key
|
||||
chmod 600 ~/.ssh/deploy_key
|
||||
# The server-side key is forced-command, restricted via rrsync to
|
||||
# this site's own docroot only (see the static-site-deploy
|
||||
# Ansible role) — it can push new files but can never read/list
|
||||
# anything back off the server, and can't reach any other site's
|
||||
# directory regardless of what path is requested here.
|
||||
rsync -az --delete -e "ssh -i ~/.ssh/deploy_key -o StrictHostKeyChecking=accept-new" public/ root@west575.org:
|
||||
env:
|
||||
DEPLOY_SSH_KEY: ${{ secrets.DEPLOY_SSH_KEY }}
|
||||
@@ -0,0 +1,3 @@
|
||||
public/
|
||||
resources/
|
||||
.hugo_build.lock
|
||||
@@ -0,0 +1,310 @@
|
||||
/* ==========================================================================
|
||||
west575.org — site stylesheet
|
||||
|
||||
Fonts: Fraunces (headings) — a soft-edged serif with a lot of character
|
||||
at display sizes, so headings read as written-by-a-person rather than
|
||||
templated. Work Sans (body/UI) — a plain, well-built humanist sans that
|
||||
stays out of the way at paragraph length. Loaded from Google Fonts in
|
||||
layouts/_default/baseof.html.
|
||||
|
||||
Accent: one color, a warm terracotta/marigold (#d9531e). Picked because
|
||||
it reads as a highlighter or a sticky note, not a corporate swatch —
|
||||
nothing here is trying to look like a SaaS product or a publisher's
|
||||
imprint, just a person's site with one confident splash of color.
|
||||
========================================================================== */
|
||||
|
||||
:root {
|
||||
color-scheme: light dark;
|
||||
|
||||
--bg: #fbf8f3;
|
||||
--bg-raised: #f2ece1;
|
||||
--fg: #241f19;
|
||||
--fg-muted: #6e6559;
|
||||
--border: #e2d8c7;
|
||||
|
||||
--accent: #d9531e;
|
||||
--accent-fg: #ffffff;
|
||||
/* Same hue as --accent, darkened for button/link contrast on light bg
|
||||
(white-on-#d9531e is 3.6:1, fails WCAG AA for normal text; this pairing
|
||||
hits 4.7:1 against --bg-raised and 5.1:1 for --accent-fg on --cta). */
|
||||
--cta: #b8431a;
|
||||
--cta-fg: #ffffff;
|
||||
|
||||
--radius: 0.4rem;
|
||||
--max-width: 40rem;
|
||||
|
||||
--font-heading: "Fraunces", Georgia, "Times New Roman", serif;
|
||||
--font-body: "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--bg: #1a1611;
|
||||
--bg-raised: #241f19;
|
||||
--fg: #f2ece1;
|
||||
--fg-muted: #b3a795;
|
||||
--border: #3a3227;
|
||||
|
||||
--accent: #f0834f;
|
||||
--accent-fg: #1a1611;
|
||||
--cta: #f0834f;
|
||||
--cta-fg: #1a1611;
|
||||
}
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: var(--font-body);
|
||||
line-height: 1.65;
|
||||
background: var(--bg);
|
||||
color: var(--fg);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
a { color: var(--cta); }
|
||||
a:hover { text-decoration-thickness: 2px; }
|
||||
|
||||
.skip-link {
|
||||
position: absolute;
|
||||
left: -9999px;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
background: var(--cta);
|
||||
color: var(--cta-fg);
|
||||
padding: 0.75rem 1.25rem;
|
||||
border-radius: 0 0 var(--radius) 0;
|
||||
}
|
||||
.skip-link:focus { left: 0; }
|
||||
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
font-family: var(--font-heading);
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
color: var(--fg);
|
||||
}
|
||||
h1 { font-size: 2.25rem; }
|
||||
h2 { font-size: 1.5rem; margin-top: 3rem; }
|
||||
|
||||
/* Header: plain wordmark + nav, no color band — the accent is saved for
|
||||
links and buttons rather than spent on chrome. */
|
||||
header.site {
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
header.site .inner {
|
||||
max-width: var(--max-width);
|
||||
margin: 0 auto;
|
||||
padding: 1.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
header.site .brand {
|
||||
font-family: var(--font-heading);
|
||||
font-weight: 600;
|
||||
font-size: 1.25rem;
|
||||
color: var(--fg);
|
||||
text-decoration: none;
|
||||
}
|
||||
header.site nav {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
header.site nav a {
|
||||
color: var(--fg-muted);
|
||||
text-decoration: none;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
header.site nav a:hover,
|
||||
header.site nav a[aria-current="page"] {
|
||||
color: var(--cta);
|
||||
}
|
||||
|
||||
main {
|
||||
flex: 1;
|
||||
max-width: var(--max-width);
|
||||
margin: 0 auto;
|
||||
padding: 3.5rem 1.5rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hero p { font-size: 1.1rem; }
|
||||
|
||||
.home-subscribe {
|
||||
background: var(--bg-raised);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius);
|
||||
padding: 2rem;
|
||||
margin-top: 3rem;
|
||||
}
|
||||
.home-subscribe h2 { margin-top: 0; }
|
||||
|
||||
/* Footer: about/links on one side, a subscribe form on the other — the
|
||||
one place the newsletter ask repeats on every page. */
|
||||
footer.site {
|
||||
border-top: 1px solid var(--border);
|
||||
margin-top: 3rem;
|
||||
background: var(--bg-raised);
|
||||
}
|
||||
footer.site .inner {
|
||||
max-width: var(--max-width);
|
||||
margin: 0 auto;
|
||||
padding: 2rem 1.5rem;
|
||||
}
|
||||
footer.site .footer-top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 2rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
footer.site .footer-about {
|
||||
font-size: 0.9rem;
|
||||
color: var(--fg-muted);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
footer.site .footer-about nav {
|
||||
display: flex;
|
||||
gap: 1.25rem;
|
||||
}
|
||||
footer.site .footer-about nav a {
|
||||
color: var(--fg-muted);
|
||||
}
|
||||
footer.site .footer-about nav a:hover { color: var(--cta); }
|
||||
footer.site .footer-subscribe {
|
||||
min-width: 16rem;
|
||||
flex: 1 1 16rem;
|
||||
}
|
||||
footer.site .footer-subscribe-label {
|
||||
margin: 0 0 0.75rem;
|
||||
font-size: 0.9rem;
|
||||
color: var(--fg-muted);
|
||||
}
|
||||
.subscribe-form {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.subscribe-form input[type="email"] {
|
||||
flex: 1 1 12rem;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.subscribe-status {
|
||||
font-size: 0.85rem;
|
||||
color: var(--fg-muted);
|
||||
margin: 0.5rem 0 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
padding: 0.7rem 1.4rem;
|
||||
border-radius: var(--radius);
|
||||
background: var(--cta);
|
||||
color: var(--cta-fg);
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
border: none;
|
||||
font-size: 1rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn:hover { opacity: 0.9; }
|
||||
.btn-subscribe { padding: 0.7rem 1.1rem; }
|
||||
|
||||
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
|
||||
outline: 2px solid var(--cta);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
label {
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 0.35rem;
|
||||
}
|
||||
input, textarea {
|
||||
width: 100%;
|
||||
padding: 0.6rem 0.75rem;
|
||||
border-radius: var(--radius);
|
||||
border: 1px solid var(--border);
|
||||
background: var(--bg);
|
||||
color: var(--fg);
|
||||
font-family: inherit;
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.field-honeypot {
|
||||
position: absolute;
|
||||
left: -9999px;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.contact-form { max-width: 28rem; margin-top: 2rem; }
|
||||
.contact-status { color: var(--fg-muted); }
|
||||
.lede { color: var(--fg-muted); font-size: 1.05rem; }
|
||||
|
||||
/* Post list (home page + /posts/) */
|
||||
.post-list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
.post-list-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
padding: 0.75rem 0;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
.post-list-item a {
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
color: var(--fg);
|
||||
}
|
||||
.post-list-item a:hover { color: var(--cta); }
|
||||
.post-date {
|
||||
color: var(--fg-muted);
|
||||
font-size: 0.9rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* Single post */
|
||||
.post-header { margin-bottom: 2rem; }
|
||||
.post-meta {
|
||||
color: var(--fg-muted);
|
||||
font-size: 0.9rem;
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.post-tags { display: flex; gap: 0.5rem; }
|
||||
.post-tag {
|
||||
background: var(--bg-raised);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 999px;
|
||||
padding: 0.15rem 0.65rem;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
.post-body { font-size: 1.05rem; }
|
||||
.post-body p { margin: 1.25rem 0; }
|
||||
@@ -0,0 +1,13 @@
|
||||
---
|
||||
title: "west575"
|
||||
---
|
||||
|
||||
I'm Will. I write software, run other people's production servers, and
|
||||
occasionally finish a short story. This site is where those things live
|
||||
without pretending to be one coherent "brand" — it's just what I'm doing
|
||||
and thinking about, in roughly that order of frequency.
|
||||
|
||||
Expect notes on infrastructure and small-business tooling, some fiction
|
||||
and the occasional submission log, and whatever else seemed worth writing
|
||||
down at the time. No content calendar, no funnel — just a [feed](/posts/)
|
||||
you can subscribe to if any of it's useful.
|
||||
@@ -0,0 +1,3 @@
|
||||
---
|
||||
title: "Contact"
|
||||
---
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
title: "Posts"
|
||||
---
|
||||
|
||||
Notes, essays, and updates — roughly in the order I thought of them.
|
||||
@@ -0,0 +1,27 @@
|
||||
---
|
||||
title: "Hello, World"
|
||||
date: 2026-08-26
|
||||
tags: ["meta", "placeholder"]
|
||||
---
|
||||
|
||||
<!-- PLACEHOLDER POST — replace with a real first entry before launch. -->
|
||||
|
||||
This is the first post on west575.org, which mostly exists right now to
|
||||
prove that the blog list and single-post templates render the way I want
|
||||
them to. Nothing below this line is meant to survive contact with an
|
||||
actual reader.
|
||||
|
||||
A real first post will probably explain what this site is for: some mix
|
||||
of infrastructure notes from running Reground's client stack, observations
|
||||
from freelancing and consulting, and updates on whatever fiction project
|
||||
is currently eating my evenings. I haven't decided yet whether that's one
|
||||
blog or three, so for now it's one blog and we'll see what happens.
|
||||
|
||||
In the meantime, here's a paragraph of genuinely placeholder text just to
|
||||
give the layout something to wrap, indent, and otherwise misbehave around:
|
||||
long enough to wrap onto a second line on most screens, short enough that
|
||||
nobody should mistake it for content. If you're reading this on the live
|
||||
site, something went wrong in the publishing checklist — email me.
|
||||
|
||||
Tags and dates on this post are also placeholders — adjust both when the
|
||||
real post goes up.
|
||||
@@ -0,0 +1,41 @@
|
||||
baseURL = "https://west575.org/"
|
||||
locale = "en-US"
|
||||
title = "west575"
|
||||
|
||||
enableRobotsTXT = true
|
||||
buildDrafts = false
|
||||
buildFuture = false
|
||||
buildExpired = false
|
||||
disableKinds = ["taxonomy", "term"]
|
||||
|
||||
# RSS/Atom output is on by default (Hugo ships an "index.xml" RSS output
|
||||
# for home/section/taxonomy pages) — nothing to configure, just don't add
|
||||
# an `outputs` override that drops "RSS".
|
||||
|
||||
[params]
|
||||
env = "production"
|
||||
description = "Will Estes' personal site — DevOps, fiction, and whatever else is on my mind."
|
||||
author = "Will Estes"
|
||||
# Placeholder — the eec instance for this domain isn't provisioned yet.
|
||||
# Update once reground-infrastructure stands up eec-west575.
|
||||
eec_base_url = "https://eec-west575.reground.org"
|
||||
|
||||
[[menu.main]]
|
||||
name = "Home"
|
||||
url = "/"
|
||||
weight = 10
|
||||
|
||||
[[menu.main]]
|
||||
name = "Posts"
|
||||
url = "/posts/"
|
||||
weight = 20
|
||||
|
||||
[[menu.main]]
|
||||
name = "Contact"
|
||||
url = "/contact/"
|
||||
weight = 30
|
||||
|
||||
[[menu.footer]]
|
||||
name = "Contact"
|
||||
url = "/contact/"
|
||||
weight = 10
|
||||
@@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ .Site.Language.LanguageCode | default "en" }}">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} · {{ .Site.Title }}{{ end }}</title>
|
||||
<meta name="description" content="{{ .Site.Params.description }}">
|
||||
<link rel="alternate" type="application/rss+xml" title="{{ .Site.Title }}" href="{{ "index.xml" | absURL }}">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,600&family=Work+Sans:wght@400;500;600&display=swap">
|
||||
{{ $css := resources.Get "css/main.css" }}
|
||||
{{ if hugo.IsProduction }}
|
||||
{{ $css = $css | minify | fingerprint }}
|
||||
<link rel="stylesheet" href="{{ $css.RelPermalink }}" integrity="{{ $css.Data.Integrity }}">
|
||||
{{ else }}
|
||||
<link rel="stylesheet" href="{{ $css.RelPermalink }}">
|
||||
{{ end }}
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#main-content">Skip to content</a>
|
||||
|
||||
{{ partial "header.html" . }}
|
||||
|
||||
<main id="main-content">
|
||||
{{ block "main" . }}{{ end }}
|
||||
</main>
|
||||
|
||||
{{ partial "footer.html" . }}
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,60 @@
|
||||
{{ define "main" }}
|
||||
<h1>Get in touch</h1>
|
||||
<p class="lede">Questions, corrections, or just want to say hi — I read every message myself.</p>
|
||||
|
||||
<form id="contact-form" class="contact-form">
|
||||
<label for="name">Name</label>
|
||||
<input type="text" id="name" name="name" required autocomplete="name">
|
||||
|
||||
<label for="email">Email</label>
|
||||
<input type="email" id="email" name="email" required autocomplete="email">
|
||||
|
||||
<label for="message">Message</label>
|
||||
<textarea id="message" name="message" rows="6" required></textarea>
|
||||
|
||||
<div class="field-honeypot" aria-hidden="true">
|
||||
<label for="website">Leave this field empty</label>
|
||||
<input type="text" id="website" name="website" tabindex="-1" autocomplete="off">
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn">Send message</button>
|
||||
</form>
|
||||
<p id="contact-status" role="status" class="contact-status"></p>
|
||||
|
||||
<script>
|
||||
(function () {
|
||||
var form = document.getElementById("contact-form");
|
||||
var status = document.getElementById("contact-status");
|
||||
form.addEventListener("submit", function (e) {
|
||||
e.preventDefault();
|
||||
if (form.website.value) return; // honeypot
|
||||
var payload = {
|
||||
name: form.name.value,
|
||||
email: form.email.value,
|
||||
message: form.message.value
|
||||
};
|
||||
var submitBtn = form.querySelector("button[type=submit]");
|
||||
submitBtn.disabled = true;
|
||||
status.textContent = "Sending…";
|
||||
fetch("{{ .Site.Params.eec_base_url }}/contact", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(payload)
|
||||
}).then(function (res) {
|
||||
submitBtn.disabled = false;
|
||||
if (res.ok) {
|
||||
form.reset();
|
||||
status.textContent = "Thanks — I'll get back to you soon.";
|
||||
return;
|
||||
}
|
||||
return res.text().then(function (msg) {
|
||||
status.textContent = msg || "Something went wrong sending that. Try again, or email will@west575.org directly.";
|
||||
});
|
||||
}).catch(function () {
|
||||
submitBtn.disabled = false;
|
||||
status.textContent = "Something went wrong sending that. Try again, or email will@west575.org directly.";
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
{{ end }}
|
||||
@@ -0,0 +1,14 @@
|
||||
{{ define "main" }}
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ .Content }}
|
||||
<ul class="post-list">
|
||||
{{ range .Pages }}
|
||||
<li class="post-list-item">
|
||||
<a href="{{ .RelPermalink }}">{{ .Title }}</a>
|
||||
{{ if not .Date.IsZero }}
|
||||
<span class="post-date">{{ .Date.Format "January 2, 2006" }}</span>
|
||||
{{ end }}
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
@@ -0,0 +1,21 @@
|
||||
{{ define "main" }}
|
||||
<article class="post">
|
||||
<header class="post-header">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ if not .Date.IsZero }}
|
||||
<p class="post-meta">
|
||||
<time datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "January 2, 2006" }}</time>
|
||||
{{ with .Params.tags }}
|
||||
<span class="post-tags">
|
||||
{{ range . }}<span class="post-tag">{{ . }}</span>{{ end }}
|
||||
</span>
|
||||
{{ end }}
|
||||
</p>
|
||||
{{ end }}
|
||||
</header>
|
||||
|
||||
<div class="post-body">
|
||||
{{ .Content }}
|
||||
</div>
|
||||
</article>
|
||||
{{ end }}
|
||||
@@ -0,0 +1,25 @@
|
||||
{{ define "main" }}
|
||||
<section class="hero">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ .Content }}
|
||||
</section>
|
||||
|
||||
<section class="home-recent">
|
||||
<h2>Recent posts</h2>
|
||||
<ul class="post-list">
|
||||
{{ range first 5 (where .Site.RegularPages "Section" "posts") }}
|
||||
<li class="post-list-item">
|
||||
<a href="{{ .RelPermalink }}">{{ .Title }}</a>
|
||||
<span class="post-date">{{ .Date.Format "January 2, 2006" }}</span>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
<p><a href="/posts/">All posts →</a></p>
|
||||
</section>
|
||||
|
||||
<section class="home-subscribe">
|
||||
<h2>Stay in the loop</h2>
|
||||
<p>New posts land here first, and occasionally by email.</p>
|
||||
{{ partial "subscribe-form.html" . }}
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -0,0 +1,19 @@
|
||||
<footer class="site">
|
||||
<div class="inner">
|
||||
<div class="footer-top">
|
||||
<div class="footer-about">
|
||||
<span>© {{ now.Year }} {{ .Site.Params.author | default .Site.Title }}</span>
|
||||
<nav aria-label="Footer">
|
||||
{{ range .Site.Menus.footer }}
|
||||
<a href="{{ .URL }}">{{ .Name }}</a>
|
||||
{{ end }}
|
||||
<a href="{{ "index.xml" | absURL }}">RSS</a>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="footer-subscribe">
|
||||
<p class="footer-subscribe-label">Get new posts by email, occasionally.</p>
|
||||
{{ partial "subscribe-form.html" . }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
@@ -0,0 +1,10 @@
|
||||
<header class="site">
|
||||
<div class="inner">
|
||||
<a class="brand" href="/">{{ .Site.Title }}</a>
|
||||
<nav aria-label="Primary">
|
||||
{{ range .Site.Menus.main }}
|
||||
<a href="{{ .URL }}"{{ if $.IsMenuCurrent "main" . }} aria-current="page"{{ end }}>{{ .Name }}</a>
|
||||
{{ end }}
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
@@ -0,0 +1,51 @@
|
||||
{{/* Standalone newsletter signup — not tied to any ARC/giveaway flow.
|
||||
Posts a JSON body to {eec_base_url}/subscribe. Include anywhere with
|
||||
{{ partial "subscribe-form.html" . }}. */}}
|
||||
{{ $id := printf "subscribe-%d" (now.UnixNano) }}
|
||||
<form id="{{ $id }}" class="subscribe-form">
|
||||
<label for="{{ $id }}-email" class="sr-only">Email address</label>
|
||||
<input type="email" id="{{ $id }}-email" name="email" required autocomplete="email" placeholder="you@example.com">
|
||||
|
||||
<div class="field-honeypot" aria-hidden="true">
|
||||
<label for="{{ $id }}-website">Leave this field empty</label>
|
||||
<input type="text" id="{{ $id }}-website" name="website" tabindex="-1" autocomplete="off">
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-subscribe">Subscribe</button>
|
||||
</form>
|
||||
<p id="{{ $id }}-status" role="status" class="subscribe-status"></p>
|
||||
|
||||
<script>
|
||||
(function () {
|
||||
var form = document.getElementById("{{ $id }}");
|
||||
var status = document.getElementById("{{ $id }}-status");
|
||||
form.addEventListener("submit", function (e) {
|
||||
e.preventDefault();
|
||||
if (form.website.value) return; // honeypot
|
||||
var payload = {
|
||||
email: form.email.value
|
||||
};
|
||||
var submitBtn = form.querySelector("button[type=submit]");
|
||||
submitBtn.disabled = true;
|
||||
status.textContent = "Subscribing…";
|
||||
fetch("{{ .Site.Params.eec_base_url }}/subscribe", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(payload)
|
||||
}).then(function (res) {
|
||||
submitBtn.disabled = false;
|
||||
if (res.ok) {
|
||||
form.reset();
|
||||
status.textContent = "You're on the list — check your inbox to confirm.";
|
||||
return;
|
||||
}
|
||||
return res.text().then(function (msg) {
|
||||
status.textContent = msg || "Something went wrong. Try again in a moment.";
|
||||
});
|
||||
}).catch(function () {
|
||||
submitBtn.disabled = false;
|
||||
status.textContent = "Something went wrong. Try again in a moment.";
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
@@ -0,0 +1,5 @@
|
||||
This directory is intentionally empty for now.
|
||||
|
||||
TODO: add a real favicon (favicon.ico / favicon.svg / apple-touch-icon.png)
|
||||
before launch. Not fabricating placeholder binary image files here — drop
|
||||
real ones in and reference them from layouts/_default/baseof.html's <head>.
|
||||
Reference in New Issue
Block a user