Button
All copy is placeholder. Real strings come from the i18n layer.
Variants
The destructive label says what it deletes. Colour never carries the meaning on its
own — a red button labelled “Confirm” tells a colour-blind user nothing.
Sizes
All three keep a 44px minimum block size. The small variant reduces padding and font
size, never the touch target — WCAG 2.5.5.
States
Loading uses
aria-busy, so assistive tech is told as well as the eye. The
label stays in the DOM — swapping it for a spinner would lose the accessible name and
make the button jump. Hover and active are live; tab through to see focus.
Full width
Long content
German and Turkish run ~40% longer than English. Nothing may clip.
As a link
Navigation is an anchor. Only use a button for an action.