Nested import i SASS

Vanligvis brukes @import i starten av et dokument, men preprosessoren SASS tillater å importere filer i alle deler av filen vi trenger, inkludert inn i selektorer.

La oss se på følgende eksempel:

main.scss.active {
  color: blue;
}

Deretter importerer vi den til filen style.scss:

style.scssdiv {
  @import "main";
}

La oss nå se på resultatet av kompileringen:

style.cssdiv .active {
  color: blue; 
}
Задание 1

Opprett en fil navbar.scss med følgende innhold:

navbar.scss.link {
  color: red;
  font-size: 12px;
}

Deretter importerer du dette fragmentet inn i blokken #main i filen styles.scss og utfør kompilering til styles.css.