Components · Dialog
Components

Dialog

Overlay is ink at 40%, not shadcn's black at 80% — the page stays legible behind it, because the dialog is usually asking about something you can see.

Maratona de Lisboa · 412 reviews · the page behind stays readable at 40% ink
Delete this review?

The organizer will no longer see it. This cannot be undone.

Copy contract
  • The title is a question.
  • The body states the consequence, one sentence, present tense.
  • The confirm button's verb matches the title's verb.
  • Cancel is always "Cancel".
Structure
  • 8px radius, hairline, --shadow-overlay.
  • placement="sheet" is a bottom sheet for Capacitor, with pb-safe-lg.
  • Footer stacks on mobile, right-aligns from md.
  • Focus is trapped; Esc closes; focus returns to the trigger.
Sporting Scouter Design System
Every token on this site is generated from theme.css.