style(website): add CSS for category-breadcrumb and assert absence on parent

Mirrors the .category-subtitle a underline style for visual cohesion in
the hero, and locks in the gating behavior with a negative assertion so
a regression that drops the page_kind guard would be caught.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Vinta Chen
2026-05-03 00:30:56 +08:00
parent 03702231af
commit 20df47e1e9
2 changed files with 21 additions and 0 deletions

View File

@@ -462,6 +462,23 @@ kbd {
text-wrap: balance;
}
.category-breadcrumb {
margin: 0 0 1rem;
color: var(--hero-muted);
font-size: clamp(1rem, 1.5vw, 1.1rem);
}
.category-breadcrumb a {
color: var(--hero-text);
text-decoration: underline;
text-decoration-color: oklch(100% 0 0 / 0.32);
text-underline-offset: 0.2em;
}
.category-breadcrumb a:hover {
text-decoration-color: oklch(100% 0 0 / 0.7);
}
.category-subtitle {
max-width: 68ch;
margin-top: 1.1rem;

View File

@@ -604,6 +604,10 @@ class TestBuild:
assert 'href="/categories/web-frameworks/"' in sync
assert "Web Frameworks" in sync
assert "<h1>Synchronous</h1>" in sync
assert "category-breadcrumb" in sync
parent = (site / "categories" / "web-frameworks" / "index.html").read_text(encoding="utf-8")
assert "category-breadcrumb" not in parent
def test_build_creates_group_pages(self, tmp_path):
readme = textwrap.dedent("""\