Something went wrong. Try again.
Web frontend and supporting services for lance.blue
Something went wrong. Try again.
1.6 kB · 39 lines
TypeScript
12345678910111213141516171819202122232425262728293031323334353637383940/** * The word ALPHA, stamped on the site. * * Three places, on purpose: beside the wordmark, where it is on every page the * site has; across the corner of the landing hero, where a first visit lands; * and above the footer's version line, at the bottom of whatever page a reader * ends up on. It is a status and not decoration — nothing here is finished, * and a player should not have to find that out from a match that breaks. * * One word in one style, so the three read as the same mark rather than three * badges. The look is in styles.css under `.stamp`. * * The masthead's copy is not built here. It has to be in the HTML the server * sends, because the blog's pages never run the app, so layouts/Base.astro * writes the same span by hand — as does components/Footer.astro, the footer * on those same pages. scripts/alpha-stamp.test.mjs keeps the copies together. */
import { el } from "./dom";
/** Uppercased by the stylesheet, so this is the word and not a shout. */export const ALPHA = "Alpha";
/** * A stamp for the app's own screens. `variant` picks the size and the angle: * "hero" is the big one over the landing panel, "foot" the small one above * the version line. * * Hidden from screen readers, both of them. The masthead is above every one of * these on the page and already says it; a reader who has heard it once does * not need it twice more, and there is nothing here to act on. */export function alphaStamp(variant: "hero" | "foot"): HTMLElement { return el("span", { className: `stamp stamp-${variant}`, textContent: ALPHA, "aria-hidden": "true", });}