Fix light mode for V3 banner

[shrey150]

why

The banner was hard-coded for light mode only

what changed

test plan

---

Summary by cubic

Fixed the V3 docs banner to support light mode while preserving dark mode styling. Added light-theme border, background, and text colors with dark: variants and aligned link hover states to improve readability.

^{Written for commit 14ab04f. Summary will update automatically on new commits.}

[changeset-bot]

⚠️ No Changeset found

Latest commit: 14ab04f

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[cubic-dev-ai]

No issues found across 1 file

[greptile-apps]

Greptile Overview

Greptile Summary

Fixed the V3 banner component to support both light and dark modes by adding light mode defaults and dark: prefixed classes for dark mode styling.

• Updated container background from dark-only (bg-zinc-800/50) to light mode default (bg-zinc-100) with dark mode override (dark:bg-zinc-800/50)
• Updated border colors to use border-zinc-300 for light mode and dark:border-zinc-700/50 for dark mode
• Updated text colors for proper contrast in both themes: text-zinc-600 for light, dark:text-zinc-400 for dark
• Updated link colors and hover states to work in both light and dark modes

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• The changes are straightforward UI styling updates using standard Tailwind CSS patterns. The implementation correctly applies light mode defaults with dark mode overrides using the dark: prefix. No logic changes or potential bugs identified.
• No files require special attention

Important Files Changed

File Analysis

Filename	Score	Overview
packages/docs/snippets/v3-banner.mdx	5/5	Added proper light and dark mode support to banner component with appropriate color classes

Sequence Diagram

sequenceDiagram
    participant User
    participant Browser
    participant V3Banner
    participant TailwindCSS

    User->>Browser: Visit docs page
    Browser->>V3Banner: Render component
    V3Banner->>TailwindCSS: Apply light mode classes (zinc-100, zinc-600, etc.)
    TailwindCSS-->>V3Banner: Styled with light colors
    V3Banner-->>Browser: Display banner in light mode
    
    User->>Browser: Toggle to dark mode
    Browser->>V3Banner: Re-render with dark mode
    V3Banner->>TailwindCSS: Apply dark: prefixed classes (dark:bg-zinc-800/50, etc.)
    TailwindCSS-->>V3Banner: Styled with dark colors
    V3Banner-->>Browser: Display banner in dark mode

Loading

[greptile-apps]

_{1 file reviewed, no comments}

_{Edit Code Review Agent Settings | Greptile}