Lekce 1.4

Tailwind CSS: utility-first přístup

Vzhled skládaný z hotových tříd přímo na prvku v HTML.

Doporučené úlohy na doma

Obě úlohy jsou malé a jde v nich o rychlost. Mají vás naučit pohotově hledat utility v dokumentaci.

Patička

Přestylujte patičku webu do utilit: tři sloupce odkazů v širokém okně, pod sebou v úzkém, a k tomu řádek s copyrightem. Nepoužijte při tom ani jednu hodnotu v hranatých závorkách. Hotovo je ve chvíli, kdy v projektu nezůstalo jediné vlastní pravidlo v CSS.

Formulář

Vysázejte přihlašovací formulář se dvěma poli a tlačítkem. Každé pole má mít viditelný stav při zaostření a tlačítko stav při najetí myší i ve chvíli, kdy je zakázané. Hotovo je ve chvíli, kdy se formulář dá celý projít tabulátorem a v každém kroku je vidět, kde kurzor stojí.