Files
hallmark/site/css
YoussefandClaude Opus 4.7 adf0da6fd4 Polish — drop Bricolage, vertical section heads, edge-bleed examples, GitHub star button
Six items in one pass:

· **Bricolage Grotesque removed** entirely. Distinctive italic-a
  forms (curl ear) read as "weird" at section-title scale across
  several themes. Replaced per-theme with cleaner alternatives:
  Sport → Inter Tight (italic). Riso → Space Grotesk. Almanac →
  IBM Plex Sans. Plume → Geist. Manifesto's display fallback
  chain swapped Bricolage out for Space Grotesk. Google Fonts
  stylesheet URL updated — Bricolage dropped, Space Grotesk and
  Anton (italic axis) added.

· **Section heads restructured.** Was: 10rem | 1fr two-column with
  the section label ("04 / ANTI-PATTERNS") on the left and the
  title on the right. Problem: at narrow widths (and on themes
  that override to 6rem | 1fr like Sport), the label was forced
  to wrap mid-word ("ANTI-/PATTERNS") and the title felt squeezed.

  Now: single-column. Label stacks ABOVE the title with a small
  gap. Label gets `white-space: nowrap` so it never breaks. Title
  font-size grows from `clamp(2rem, 3vw + 1rem, 3rem)` to
  `clamp(2rem, 4vw + 0.5rem, 3.5rem)` since it has full row width.
  Sport's per-theme override (was 6rem | 1fr) now also 1fr.

· **Foundations card strokes — fixed.** The gap-as-border pattern
  (gap: 0.5px, parent bg showing through) sub-pixel-rounded
  inconsistently — col 2/3 boundaries dropped on some themes.
  Replaced with explicit 1px right + bottom borders on each card,
  plus left + top on the parent. Every divider now renders crisp
  at every theme + viewport. Atelier/Salon use a dashed bottom
  rule instead, no vertical dividers (matches their borderless
  card aesthetic).

· **Worked examples — full bleed to viewport edges.** The rail had
  `margin-inline: calc(-1 * var(--page-gutter))` which only
  escaped the page gutter, not the page max-width. On wide
  desktops the rail still capped at 76rem. Now uses
  `width: 100vw; margin-inline: calc(50% - 50vw)` so cards extend
  flush to the viewport edges no matter how wide the screen.
  Internal scroll-padding still snaps the first/last card cleanly.

· **Study brief pill** — "Paste a design you admire." → "/hallmark
  study this landing page". Reads as the actual command the user
  would type, matches the Build row's brief style.

· **GitHub star button** added to the nav. Sits beside Install,
  styled as an inverse pill (ink fill, accent star, paper text).
  Live star count fetched from the GitHub API on first paint,
  cached in localStorage for 1h to avoid rate-limit. Falls back
  to "★" if the request fails. Counts ≥1000 render as "1.2k" etc.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-06 14:06:15 +01:00
..