feat(website): show the sponsor band on category pages

The sponsor band rendered only on the homepage, so visitors who entered on a category page and never opened the homepage saw no sponsors. Category, subcategory, group, and Stdlib pages now show the same band between the hero and the table.

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Vinta Chen
2026-10-21 09:09:22 +08:00
co-authored by Claude
parent 45ad644f1b
commit 786ebb4c78
4 changed files with 35 additions and 1 deletions
+1 -1
View File
@@ -162,7 +162,7 @@ The component vocabulary is small and table-led. Source of truth: `website/stati
- **Hero**. Magazine-cover headline, dark earthy ground, kicker and proof microcopy, primary CTA button using `--hero-btn-start` / `--hero-btn-end`. Subtle grid plus slow sheen. Respects `prefers-reduced-motion`.
- **Jump links**. One per use case in a category hero, plus one for the guide. Underlined like the intro's links, with a trailing ↓. Never tag-styled: tags filter the table or open another page, jump links only scroll.
- **Guide band**. Everything in a category intro after its "How to choose" list. It sits below the table on the hero's dark gradient, with its H2 above the text.
- **Sponsor band**. Sits below the hero on the home page, on `--bg-paper-strong`. Editorial layout, not a logo wall. Sponsor links share the global accent treatment.
- **Sponsor band**. Sits below the hero on the home page and category pages, on `--bg-paper-strong`. Editorial layout, not a logo wall. Sponsor links share the global accent treatment.
- **CTA**. Warm `--cta-bg`, full-bleed within shell. The button itself uses accent tokens.
- **Footer**. Dark warm charcoal, part of the same system. Footer links share the global hover and focus treatment.
- **Search**. Pill input with `--search-inset` interior and `--search-focus-ring` focus ring. Focus shadow uses `--search-focus-shadow`.
+1
View File
@@ -894,6 +894,7 @@ def build(repo_root: Path) -> None:
parent_category=parent_category,
group_categories=group_categories,
category_json_ld=category_json_ld,
sponsors=sponsors,
),
encoding="utf-8",
)
+2
View File
@@ -208,6 +208,8 @@
<td></td>
</tr>
{% endmacro %}
{% include "_sponsor_band.html" %}
<section class="results-section" id="library-index">
<div class="results-intro section-shell" data-reveal>
{% if entry_groups %}
+31
View File
@@ -490,6 +490,37 @@ class TestBuild:
assert 'href="https://sponsor.example.com/?ref=x&amp;utm_source=awesome-python&amp;utm_content=website"' in index_html
assert "utm_content=readme" not in index_html
def test_category_page_shows_sponsor_band(self, tmp_path):
readme = textwrap.dedent("""\
# Awesome Python
Intro.
## **Sponsors**
- [Sponsor](https://sponsor.example.com) - Sponsored tool.
## Projects
**Tools**
## Widgets
- [w1](https://example.com) - A widget.
# Contributing
Help!
""")
(tmp_path / "README.md").write_text(readme, encoding="utf-8")
self._copy_real_templates(tmp_path)
build(tmp_path)
category_html = (tmp_path / "website" / "output" / "categories" / "widgets" / "index.html").read_text(encoding="utf-8")
assert 'href="https://sponsor.example.com"' in category_html
assert '<span class="sponsor-name">Sponsor</span>' in category_html
def test_build_cleans_stale_output(self, tmp_path):
readme = textwrap.dedent("""\
# T