Ukázka komponenty

// .notice .notice--{type}

Typové varianty

Pět sémantických barev. Titulek (.notice__title) a akce (.notice__action) jsou volitelné.

Pět stavů

Uloženo

Data jsou uložena a publikována.

Tip

Publikování lze naplánovat dopředu v záložce Plánování.

Pozor

Licence expiruje za 3 dny.

Chyba

Formulář nelze odeslat – opravte označená pole.

Žádná data

Zatím nejsou žádné záznamy.

// .notice--inline

Jednořádková varianta. Ikona a text na jedné lince, menší padding.

Kompaktní řádky

Heslo bylo změněno.

Pole musí mít alespoň 8 znaků.

E-mail je již registrován.

Tato operace je nevratná.

// .notice--empty

Centrovaný stav pro prázdné výpisy. Ikona v kroužku nahoře, titulek, popis, CTA.

Empty state

Žádné záznamy

Zatím tu nic není. Začni přidáním prvního záznamu.

// .notice--banner

Full-width bez border-radius, 4px levý border. Pod navbar nebo nad tabulku.