diff options
| author | grm <grm@eyesin.space> | 2026-09-17 21:47:37 +0300 |
|---|---|---|
| committer | grm <grm@eyesin.space> | 2026-09-17 21:47:37 +0300 |
| commit | eaa6dc04d05ad24dea5a7b211928cddb6db5aa73 (patch) | |
| tree | e5f54fc6543fb968265ed6a04bad9b45c7c070a8 /internal/web/static | |
| parent | 2a347ced1b4ea8c24440f646df35207c3a3597ac (diff) | |
| download | blogspace-eaa6dc04d05ad24dea5a7b211928cddb6db5aa73.tar.gz blogspace-eaa6dc04d05ad24dea5a7b211928cddb6db5aa73.tar.bz2 blogspace-eaa6dc04d05ad24dea5a7b211928cddb6db5aa73.zip | |
Add a colons kind to the rule under titles, and stop its label wrapping
The design form's hint on "Rule under titles" wrapped to three lines and
pushed the select below its neighbours; it is a note under the row now.
"Colons" is a row of ":" (a long string in an ::after, clipped to the
title's width), the look of the reference site's dotted borders in text.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Sd8UPWrvyYCLj97JexNw3A
Diffstat (limited to 'internal/web/static')
| -rw-r--r-- | internal/web/static/blog.css | 4 |
1 files changed, 3 insertions, 1 deletions
diff --git a/internal/web/static/blog.css b/internal/web/static/blog.css index 155269d..30b1612 100644 --- a/internal/web/static/blog.css +++ b/internal/web/static/blog.css @@ -39,10 +39,12 @@ img { max-width: 100%; height: auto; } .post-title { margin: 0 0 0.1em; font-size: 1.5em; line-height: 1.25; } /* title rule (body.titles-*): a line under page and post titles, coloured by the theme CSS. overflow:hidden ends it at a floated thumbnail instead of under it. */ -.titles-line .page-title, .titles-line .post-title, .titles-dots .page-title, .titles-dots .post-title, .titles-stripes .page-title, .titles-stripes .post-title { overflow: hidden; padding-bottom: 0.25em; } +.titles-line .page-title, .titles-line .post-title, .titles-dots .page-title, .titles-dots .post-title, .titles-colons .page-title, .titles-colons .post-title, .titles-stripes .page-title, .titles-stripes .post-title { overflow: hidden; padding-bottom: 0.25em; } .titles-line .page-title, .titles-line .post-title { border-bottom-width: 1px; border-bottom-style: solid; } /* the colour is the theme's, so no shorthand */ .titles-dots .page-title, .titles-dots .post-title { border-bottom-width: 3px; border-bottom-style: dotted; } .titles-stripes .page-title::after, .titles-stripes .post-title::after { content: ""; display: block; height: 0.4em; margin-top: 0.35em; background: repeating-linear-gradient(90deg, currentColor, currentColor 2px, transparent 2px, transparent 10px); } +/* colons: a row of ":" clipped to the title's width (the string is long enough for any screen) */ +.titles-colons .page-title::after, .titles-colons .post-title::after { content: "::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::"; display: block; overflow: hidden; white-space: nowrap; margin-top: 0.15em; font-size: 0.7em; font-weight: normal; line-height: 1; letter-spacing: 0.04em; } .post-title a { text-decoration: none; } .post-title a:hover { text-decoration: underline; } .post-date { margin: 0 0 0.8em; font-size: 0.85em; opacity: 0.7; } |