Style Guide
Design-system foundation ported from the legacy React/Tailwind/shadcn app. Colors, radius and typography resolve to the same tokens; buttons and cards are Rails ViewComponents.
Buttons
Variants
Sizes
Disabled
Cards
Card title
Header + content slots
Cards use the bg-card /
text-card-foreground tokens
and rounded-lg radius.
With actions
A card with no slots renders its block content directly.
Color tokens
Swatches are bg-* utilities backed
by the ported HSL custom properties.
background
bg-background
foreground
bg-foreground
card
bg-card
primary
bg-primary
secondary
bg-secondary
muted
bg-muted
accent
bg-accent
destructive
bg-destructive
border
bg-border
success
bg-success
warning
bg-warning
info
bg-info