Globalne zmienne wewnątrz selektorów w SASS
Jeśli definiujemy zmienne znajdujące się
wewnątrz selektorów, to możemy ich używać
tylko w obrębie danego poziomu zagnieżdżenia.
Jednakże, jeśli potrzebujemy,
aby zmienna była dostępna
globalnie, to dopisujemy do jej
wartości znacznik !global.
Rozważmy przykład:
div {
$height: 20px !global;
height: $height;
}
#navbar {
height: $height;
}
Wynik kompilacji podanego kodu będzie następujący:
div {
height: 20px;
}
#navbar {
height: 20px;
}
Opowiedz, jaki będzie wynik kompilacji następującego kodu:
#main {
$font-family: Arial !global;
font-family: $font-family;
}
#navbar {
font-family: $font-family;
}