Shrnutí
Dnešek nepřinesl novou látku – ukázal, jestli ta dosavadní drží pohromadě, když se s ní má dokončit celá stránka. A přidal dovednost, která se nepíše do kódu: přečíst cizí řešení a říct k němu něco užitečného.
Tímhle blokem končí modul o pokročilém CSS. Než se pustíme dál, hodí se projít si, co z něj zůstalo v rukou.
Umím?
- Postavím stylopis od mobilu: základ mimo media query, v media query jen změny.
- Podle snímků výsledku poznám, co se mezi mobilem, tabletem a desktopem mění.
- Nakreslím rozvržení stránky mustrem a posadím do něj prvky.
- Postavím galerii, které se počet sloupců mění bez media query.
- Rozhodnu se mezi mřížkou a Flexboxem a rozhodnutí zdůvodním.
-
Napíšu velikosti relativně a nadpis přes
clamp(). - Zavedu tokeny a přepnu jimi celou variantu vzhledu.
- Nechám komponentu reagovat na šířku rodiče místo okna.
- Poskládám prvek z utility tříd v Tailwindu.
- Vyberu pro konkrétní projekt mezi nativním CSS, Tailwindem a SCSS.
- Zkontroluju kód od asistenta a vysvětlím každý řádek, který odevzdávám.
- Napíšu k cizímu kódu komentář, se kterým se dá pracovat.