Button
Kedy použiť tento komponent
Tlačidlá sa používajú na posun medzi krokmi v rámci procesov. Cieľom je používať jedno tlačidlo na stránku.
Hlavné tlačidlo
<button type="submit" class="govuk-button" data-module="govuk-button">
Pokračovať
</button>
Vedlajšie tlačidlo
<button type="submit" class="govuk-button govuk-button--secondary" data-module="govuk-button">
Späť na domovskú stránku
</button>
Deštruktívne tlačidlo
<button type="submit" class="govuk-button govuk-button--warning" data-module="govuk-button">
Vymazať
</button>
Neaktívne tlačidlo
<button type="submit" disabled="disabled" aria-disabled="true" class="govuk-button govuk-button--disabled" data-module="govuk-button">
Pokračovať
</button>
Tlačidlo začať
<a href="#" role="button" draggable="false" class="govuk-button govuk-button--start" data-module="govuk-button">
Začať
<svg class="govuk-button__start-icon" xmlns="http://www.w3.org/2000/svg" width="17.5" height="19" viewBox="0 0 33 40" role="presentation" focusable="false">
<path fill="currentColor" d="M0 0h13l20 20-20 20H0l20-20z"/>
</svg>
</a>
Viac tlačidiel alebo linkov vedľa seba
<div class="govuk-button-group">
<button type="submit" class="govuk-button" data-module="govuk-button">
Odoslať na schválenie
</button>
<button type="submit" class="govuk-button govuk-button--secondary" data-module="govuk-button" data-a11y-dialog-show="my-dialog">
Vymazať
</button>
<a href="#" class="govuk-body govuk-link govuk-!-display-inline-block govuk-!-margin-top-1">Späť na predchádzajúci krok</a>
</div>