Sass

Ved å bruke Sass får du et kompileringssteg for CSS, som gir ekstra trygghet og fleksibilitet.

Hvorfor Sass?

Ved å bruke Sass får du et kompileringssteg for CSS, som gir ekstra trygghet og fleksibilitet. Kompilatoren vil si ifra om en verdi du refererer til ikke finnes. Modulsystemet gir deg god kontroll på hva som inkluderes, og er i scope. Det gir også større muligheter for god autocomplete i editoren. SCSS er et supersett av CSS, så du kan bruke så mye eller lite Sass du ønsker. I Jøkul bruker vi:

Nøsting, for å gjøre det enklere å skrive selectors i BEM-stil.
Mixins, blant annet for forhåndsdefinerte media queries.
Funksjoner, hovedsakelig for å konvertere fra pixelverdi til rem.
Løkker og annen flytkontroll, for å generere klasser fra verdier, for eksempel spacing.

Block, Element, Modifier

Block, Element, Modifier (BEM) er en metode for å skrive CSS med konsekvent navngiving, og lav spesifisitet. BEM passer godt til komponentbasert utvikling.

En komponent kan typisk tenkes på som en block.
Mindre deler av komponenten kan ses på som elements.
Tilstander som hover og active er modifiers.

En ulempe med BEM er at klassenavn ofte blir lange. Sass og nøsting gjør det enklere å skrive BEM-klasser.

.block {
  &__element {
    &--element-modifier {
    }
  }

  &--block-modifier {
  }
}