Skip to content

Card components redesign: full-width stacked, compact, subtle hover#495

Merged
LindsayAuch merged 2 commits into
LindsayAuch/visual-refresh-sandboxfrom
LindsayAuch/card-redesign
May 12, 2026
Merged

Card components redesign: full-width stacked, compact, subtle hover#495
LindsayAuch merged 2 commits into
LindsayAuch/visual-refresh-sandboxfrom
LindsayAuch/card-redesign

Conversation

@LindsayAuch
Copy link
Copy Markdown
Collaborator

@LindsayAuch LindsayAuch commented May 1, 2026

Changes

Layout

  • Generated index page cards: 2-column grid → full-width stacked
  • Removed gems-bg background decoration
  • Vertical gap between cards: 2rem → 1.25rem

Card visuals (src/theme/DocCard)

  • Removed padding--lg className from component (was tying with module CSS at same !important specificity)
  • Padding 2rem → 0.75rem × 1.25rem
  • Min-height 3.25rem with vertically centered content
  • Rounded 8px corners, 1px border, white background
  • Hover: light grey (#F3F4F6) replaces mint green
  • Title 1.25rem → 1.0625rem semibold
  • Description 1rem → 14px Inter, muted (rgba(4,24,52,0.65))

Test plan

  • /changelog, /recipes, /authoring-recipes show stacked cards
  • Hover is light grey, not green
  • No yellow gems decoration on category pages
  • Cards without descriptions match height of cards with descriptions

- Generated index page cards now span full width and stack vertically
  instead of a 2-column grid
- Remove gems-bg decoration from generated index pages
- Drop padding--lg from DocCard so module CSS controls padding (was
  blocked by a same-specificity !important tie with Infima)
- Card padding 2rem -> 0.75rem 1.25rem; min-height 3.25rem; rounded 8px
- Hover: light grey #F3F4F6 background instead of mint green
- Title 1.25rem -> 1.0625rem; description 1rem -> 14px Inter, muted
- Card vertical gap 2rem -> 1.25rem

Refs #492

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@github-project-automation github-project-automation Bot moved this from In Progress to Ready to Review in OpenRewrite May 1, 2026
@LindsayAuch LindsayAuch marked this pull request as ready for review May 12, 2026 15:06
@LindsayAuch LindsayAuch merged commit 62ac0a3 into LindsayAuch/visual-refresh-sandbox May 12, 2026
@github-project-automation github-project-automation Bot moved this from Ready to Review to Done in OpenRewrite May 12, 2026
@LindsayAuch LindsayAuch deleted the LindsayAuch/card-redesign branch May 12, 2026 15:13
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Archived in project

Development

Successfully merging this pull request may close these issues.

2 participants