Fixed What's new banner visual regression

[peterzimon]

ref https://linear.app/ghost/issue/DES-1305/twcss-4-migration-whats-new-banner-shadow-missing

• The custom shadow syntax changed with the recent Tailwind CSS 4 integration, which caused a visual regression in the What's New banner in the sidebar.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 1de16899-22ca-4456-9ea4-c399aa5d64ae

📥 Commits

Reviewing files that changed from the base of the PR and between 1b158dd and 4f79ddf.

📒 Files selected for processing (1)

• apps/shade/src/components/ui/banner.tsx

---

Walkthrough

The change refactors CSS utility classes in the banner component's gradient variant. Multiple explicit shadow utility classes are replaced with consolidated shadow syntax. This updates shadow declarations for normal, dark, hover, and dark-hover states, consolidating them from rgb-based shadow tokens to a unified shadow declaration format. The final hover and translate classes remain unchanged. No modifications to public APIs or component behavior; only the internal CSS class strings are updated.

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'Fixed What's new banner visual regression' clearly and specifically describes the main change—addressing a visual regression in the What's New banner, which aligns with the changeset's focus on fixing shadow styling issues.
Description check	✅ Passed	The description is directly related to the changeset, explaining that custom shadow syntax changed with Tailwind CSS 4 integration and caused a visual regression in the What's New banner, which is what the code changes address.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

• 📝 Generate docstrings (stacked PR)
• 📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix-whatsnew-vis-regression

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}