wordmark_ink: an SVG wordmark drawn in the page's own ink, following light and dark everywhere
Test / test (pull_request) Successful in 1m8s

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01GT37Z1Xtfd9pUuQtMTg6Yt
This commit is contained in:
Bendik Aagaard Lynghaug
2026-10-01 09:33:27 +02:00
co-authored by Claude Opus 5.5
parent c8901558b2
commit 8376c68f8f
5 changed files with 50 additions and 4 deletions
+14
View File
@@ -244,6 +244,20 @@ main.not-found {
display: block;
}
/* A wordmark in the page's ink (site.yaml `wordmark_ink`): the file is a
mask over the text colour. The invisible image inside gives the span
the file's own size. */
.wordmark-ink-mark {
display: block;
background: var(--ink);
-webkit-mask: var(--wordmark-src) center / contain no-repeat;
mask: var(--wordmark-src) center / contain no-repeat;
}
.wordmark-ink-mark img {
visibility: hidden;
}
.hero-copy h1 {
font-size: 2.1rem;
}