Import Bersarang di SASS

Biasanya @import digunakan di awal dokumen, tapi preprocessor SASS memungkinkan untuk mengimpor file di bagian mana pun dari file yang kita butuhkan, termasuk di dalam selector.

Mari kita lihat contoh berikut:

main.scss.active {
  color: blue;
}

Selanjutnya, impor file tersebut ke dalam file style.scss:

style.scssdiv {
  @import "main";
}

Sekarang mari kita lihat hasil kompilasinya:

style.cssdiv .active {
  color: blue; 
}

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