Mixins i SASS

I denne leksjonen vil vi bli kjent med mixins (innblanding), som gjør det mulig å inkludere én klasse inni en annen. La oss finne ut hva dette er og hvordan man jobber med det.

I hovedsak er innblanding bruk av en klasse inni andre, der én klasse er en mal - et bestemt kodesnutt, som vi kan bruke på mange steder.

Hvorfor er dette praktisk? I ren CSS måtte vi ha skrevet mal-koden overalt der den trengs, mens i SASS kan vi skrive den på ett sted og deretter inkludere den der vi trenger den i koden.

For å deklarere mixins brukes direktivet @mixin, etterfulgt av det navnet, parametre og en blokk med kropp:

styles.scss@mixin mix {
  width: 100px;
  height: 100px;
}