From 3caa276573024e4a5a00aacc0d09309617a95427 Mon Sep 17 00:00:00 2001 From: Marcos Paulo Date: Sat, 5 Sep 2026 06:51:47 +0000 Subject: [PATCH] fix(components): use --step-4 in Callout, flag two untokenized clamps Same gate-evasion class as CodeBlock/Eyebrow: check-tokens.mjs matches `font-size: Npx` only, so raw clamp() values pass. All three are verbatim from styles.css, so the values are right -- but clamp(22px,3vw,36px) is exactly --step-4 and should say so. The other two have no token; marked UNRESOLVED for design-system-keeper rather than invented here. --- src/components/primitives/Callout.astro | 5 ++++- src/components/primitives/Rule.astro | 3 +++ 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/src/components/primitives/Callout.astro b/src/components/primitives/Callout.astro index 8e9d1e2..2114806 100644 --- a/src/components/primitives/Callout.astro +++ b/src/components/primitives/Callout.astro @@ -75,9 +75,12 @@ const { label, tone = 'accent', variant = 'label' } = Astro.props; markup uses is set here so the call site can just write . */ .body :global(strong) { max-width: 850px; - font-size: clamp(22px, 3vw, 36px); + font-size: var(--step-4); line-height: 1.1; } + /* UNRESOLVED — clamp(24px,4vw,46px) is verbatim from `styles.css`, but no + token covers it. Needs one from design-system-keeper; see + .agents/rules/gates.md on reporting token gaps rather than inventing. */ .callout.variant-split .body :global(strong) { font-size: clamp(24px, 4vw, 46px); line-height: 1.05; diff --git a/src/components/primitives/Rule.astro b/src/components/primitives/Rule.astro index a0fafb1..460d0f1 100644 --- a/src/components/primitives/Rule.astro +++ b/src/components/primitives/Rule.astro @@ -45,6 +45,9 @@ const { label, tone = 'accent' } = Astro.props; /* The body renders the slot verbatim; the strong treatment that the source markup uses is set here so the call site can just write . */ + /* UNRESOLVED — clamp(24px,3.3vw,42px) is verbatim from `styles.css`, but no + token covers it. Needs one from design-system-keeper; see + .agents/rules/gates.md on reporting token gaps rather than inventing. */ .body :global(strong) { max-width: 850px; font-size: clamp(24px, 3.3vw, 42px);