Die Direktive nuiButton gestaltet ein natives <button> oder <a>. Das Element behält seine Semantik und sein Tastaturverhalten und nimmt weiter an Formularen teil; die Direktive überträgt nur ihre Inputs auf die Data-Attribute, die das Stylesheet anspricht.
Verwende ein <button> für Aktionen und ein <a> für die Navigation. Beide sehen gleich aus, und beide unterstützen disabled.
Varianten
Vier Füllstile, vom auffälligsten bis zum dezentesten. Verwende pro Ansicht nur einen gefüllten Button für die Hauptaktion.
Farbtöne
Der Farbton bestimmt die Palette: accent für den Hauptweg, neutral für sekundäre Aktionen, danger für destruktive.
Größen
Drei Höhen: 28, 36 und 44 Pixel. Selbst die kleinste übertrifft die Mindestzielgröße der WCAG 2.2.
Links und deaktivierte Buttons
Links lassen sich nicht nativ deaktivieren. Ein deaktivierter Link erhält daher aria-disabled="true", und seine Klicks werden blockiert, auch mit routerLink.