Pokročilá práce se SASS

19. hodina MVOP WBF

Matěj Cajthaml — SSPŠ

©

Opakování

Co je to SASS? Proč existuje?
Co jsou to moduly v SASS? Kde se používají?
Jak tvoříme v SASS vnořování? Co to znamená?
K čemu slouží tag label?

Funkce

Funkce

  • způsob rozdělení logiky
  • přijímá parametry a vrací jednu hodnotu
  • hodí se např. na výpočty, komplikovanější počty, ...

Ukázka funkcí

Mixins

Mixins

  • způsob definování funkcí které vracejí více vlastností či bloky
  • dají se vkládat do jiných selektorů
  • hodí se např. na responzivitu, opakující se kód, ...

Ukázka mixins

Cykly

Cykly

  • opakování hodnot / vlastností / bloků pro určité hodnoty
  • hodí se např. na repetetivní práci, mnoho hodnot

Ukázka opakování

Dokumentace

https://sass-lang.com/documentation

Podíváme se na práci z minulého týdne

LESS

Mapy a listy v SASS

PRÁCE

https://ssps.cajthaml.eu/3-mvop-wbf/work/19-sass-map-list

Webová stránka s SASS

PRÁCE

https://ssps.cajthaml.eu/3-mvop-wbf/work/21-webova-stranka-s-sass

Shrnutí

Co je to Node.js a npm?
Je CSS validní SASS zápis?
Co je to @mixin v SASS? K čemu slouží?
Jaká třída se používá pro znegování selektoru?

Děkuji za pozornost!

  • matej.cajthaml@ssps.cz
  • https://ssps.cajthaml.eu/