fix(css): restore JT brand red CTA buttons + pin bun#337
Conversation
bun-version: latest caused production CSS to differ from local builds.
When bun's latest version rolled, CI started producing a CSS bundle
(homepage.min.df726d1a...css) that was missing the `a.fl-button {
background-color: #cc342d !important }` brand override from
navigation.css — buttons rendered as default blue pills instead of
JT brand red. Local build with bun 1.3.13 produces the correct bundle
(homepage.min.42f525ea...css) with the rule intact.
Pin to 1.3.13 (known-good, matches user's local) to make CI deterministic
and stop CSS drift across deploys of the same git SHA.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
|
Warning Rate limit exceeded
You’ve run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (3)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Production homepage's CTA buttons rendered as default blue pills
instead of the JT Ruby red (#cc342d) brand override. Root cause:
PurgeCSS in CI was stripping the navigation.css rule
a.fl-button, a.fl-button:visited, .fl-button-wrap a {
background-color: #cc342d !important;
border-radius: 8px !important;
...
}
despite hugo_stats.json containing the fl-button class. CI's PurgeCSS
behavior differs from local — possibly a timing race between Hugo's
incremental hugo_stats.json writes and PostCSS's read of that file
when processing the inline navigation.css bundle.
Fix: add brand CTA class names to safelist.standard. Standard safelist
matches classes regardless of hugo_stats.json content — the rule's
selector contains any of these classes → rule is preserved
unconditionally.
Classes added:
- btn, btn-primary (pagination Next, page nav, header Contact Us)
- fl-button, fl-button-wrap (homepage hero, about-us footer, every
Beaver Builder CTA module)
- action-button (Use Cases tab CTAs)
Verified locally: red brand rule appears in inlined navigation <style>
block of generated index.html. Same CSS bundle hash as before
(42f525ea) — no unintended changes elsewhere.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
) fix(css): use greedy safelist for fl-button + btn to preserve brand override Follow-up to #337: standard safelist preserved .btn.btn-primary (class-only selector matched) but failed for a.fl-button (tag+class compound). PurgeCSS treats class-only and tag+class selectors differently for safelist matching, and only the class-only rule survived. Result: Contact Us header button got brand red, but hero CTAs ("Talk to an Expert", "Explore Use Cases") stayed default blue pill. Move fl-button, btn, action-button to safelist.greedy — preserves any rule whose selector mentions these classes regardless of tag prefix. Verified locally: red rule appears in inlined navigation <style>: .fl-button-wrap a, a.fl-button, a.fl-button:visited { background-color: #cc342d !important; border-radius: 8px !important; ... } Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Symptom
Production homepage CTA buttons rendered as default blue pills instead of JT Ruby red (#cc342d) rectangular brand buttons. User reported "we lost previous design."
Investigation chain
bin/inline-critical, so deployed CSS bundle was unchanged. Reverted (Revert "feat(perf): Beasties critical CSS — homepage-only (#335)" #336) for safety; no impact on the broken state — symptom persists.df726d1a...css, 222507 bytes) against local build (42f525ea...css, 225143 bytes) showed local is 2636 bytes larger and contains rules production is missing.themes/beaver/assets/css/navigation.css:<style>block). Production strips it.fl-buttonclass on CI, even though it does locally.Fixes (two layered)
1.
postcss.config.js— Add brand CTA class names tosafelist.standard:btn,btn-primary(pagination Next, page nav, header Contact Us)fl-button,fl-button-wrap(homepage hero, every Beaver Builder CTA)action-button(Use Cases tab CTAs)Standard safelist matches classes regardless of hugo_stats.json content — these rules are now unconditionally preserved.
2.
bun-version: 1.3.13(both_hugo.ymlandsetup-hugo/action.yml) — Replacelatestwith a known-good pin.latestis time-dependent and contributed to non-deterministic CI builds across deploys of the same git SHA.Verification
#cc342dred rule in inlined<style>block42f525ea) — confirms safelist addition didn't break unrelated rules🤖 Generated with Claude Code