Namespaces in LESS
Het kan voorkomen dat je twee verschillende mixins hebt met dezelfde naam, maar die zich in verschillende blokken bevinden:
#block1 {
.button {
border: 1px solid black;
}
}
#block2 {
.button {
width: 100px;
}
}
In dat geval wordt gezegd dat deze mixins behoren tot verschillende namespaces. Om zo'n mixin te gebruiken, moet je, naast de naam, ook de selector van het bovenliggende blok specificeren.
Laten we de eerste mixin gebruiken:
.test {
#block1 > .button;
}
En nu de tweede:
.test {
#block2 > .button;
}
Vertel wat het resultaat zal zijn van de compilatie van de volgende code:
#block1 {
.mix {
width: 100px;
}
}
#block2 {
.mix {
height: 200px;
}
}
.test {
#block1 > .mix;
#block2 > .mix;
}