Variables globales dentro de selectores en SASS
Si definimos variables que se encuentran
dentro de selectores, solo podremos usarlas
dentro del nivel de anidamiento especificado.
Sin embargo, si necesitamos
que una variable sea accesible
globalmente, entonces agregamos la etiqueta
!global a su valor.
Veamos un ejemplo:
div {
$height: 20px !global;
height: $height;
}
#navbar {
height: $height;
}
El resultado de la compilación del código anterior será el siguiente:
div {
height: 20px;
}
#navbar {
height: 20px;
}
Explica, cuál será el resultado de la compilación del siguiente código:
#main {
$font-family: Arial !global;
font-family: $font-family;
}
#navbar {
font-family: $font-family;
}
