Skip to main content

Layout

shadow

WebJET Elements umožňuje jednoducho skladať rozvrhnutie stránky pomocou piatich základných stavebných blokov: Container, Header, Main, Aside a Footer. Pri komplexnejších stránkach ich môžete kombinovať aj so systémom Grid.

Príklady použitia​

Ukážka skladá typické layout kombinácie z headeru, mainu, aside a footeru, aby bolo jasné, ako sa tieto stavebné bloky kombinujú.

Kedy použiť​

Použite layout primitives WebJET Elements vtedy, keď potrebujete stabilnú štruktúru stránky s jasnou hierarchiou hlavičky, hlavného obsahu, bočného panelu a päty.

Kedy nepoužiť​

Tieto elementy nepoužívajte na riešenie biznis logiky ani na orchestráciu stavu aplikácie. Ich úlohou je štruktúra a rozloženie.

Prístupnosť​

Zachovajte semantiku dokumentu (header, main, aside, footer) a logické poradie fokusovateľných prvkov. Na stránke by mal byť vždy práve jeden hlavný obsahový región main.

Odporúčané postupy​

  • Najprv definujte desktop/mobile breakpoints a až potom dolaďujte detaily.
  • Preferujte konzistentné spacing tokeny pred ad-hoc margin/padding hodnotami.
  • Pri layoutoch s overflow vždy otestujte klávesnicovú navigáciu a čítačky.

Atribúty a vlastnosti​

Pre tento komponent nie sú dostupné žiadne vlastnosti.

Udalosti​

Pre tento komponent nie sú dostupné žiadne udalosti.

Metódy​

Pre tento komponent nie sú dostupné žiadne verejné metódy.

CSS tieňové časti​

Pre tento komponent nie sú dostupné žiadne CSS časti tieňa.

CSS vlastné premenné​

Pre tento komponent nie sú dostupné žiadne vlastné CSS vlastnosti.

Sloty​

Pre tento komponent nie sú dostupné žiadne sloty.