Card

[karamba228]

Reference Issues or PRs

What does this implement/fix?

Put a x in the boxes that apply

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds a feature)
• Breaking change (fix or feature that would cause existing features not to work as expected)
• Documentation Update
• Code style update (formatting, renaming)
• Refactoring (no functional changes, no API changes)
• Build related changes
• Other (please describe):

Testing

• Did you test the pull request locally?
• Did you add new tests?

Documentation

Access-centered content checklist

Text styling

• The content is written with plain language (where relevant).
• If there are headers, they use the proper header tags (with only one level-one header: H1 or # in markdown).
• All links describe where they link to (for example, check the Nebari website).
• This content adheres to the Nebari style guides.

Non-text content

• All content is represented as text (for example, images need alt text, and videos need captions or descriptive transcripts).
• If there are emojis, there are not more than three in a row.
• Don't use flashing GIFs or videos.
• If the content were to be read as plain text, it still makes sense, and no information is missing.

Any other comments?

[jbouder]

One minor nit...
stories/card.stories.tsx:307 — "Edge-to-edge content" story is not actually edge-to-edge at the top.

The Card root always applies py-(--card-spacing) (~20px), and the only rule that removes the top padding is has-[>img:first-child]:pt-0 (card.tsx:6), which requires the first child to be an . This story's first child is a

, not an img, so pt-0 never matches — the colored media block renders with ~20px of leftover padding above it (card background showing through), demonstrating the opposite of what the story name promises. The sibling rule *:[img:first-child]:rounded-t-md likewise doesn't fire for the div.

Fix: use an as the first child (matching how the has-[>img:first-child] rules are designed to be consumed), or add an explicit pt-0 on the story's Card.