How to exclude some of the multiple selectors?
.component .branch-aThe selector you want to keep .elementThe element you want to style,
.component .branch-b .element,
.component .branch-c .elementThe selector you want to omit
- SASS
+component('.component')
+register
+element('{blocks}', '.header', '.body', '.footer')
+__________________________
+element('{blocks}')
+default
display: inline-flex
+only-for('.header')
order: 1
+only-for('.body')
order: 2
+only-for('.footer')
order: 3
- CSS
.component .header, .component .body, .component .footer {
display: inline-flex;
}
.component .header {
order: 1;
}
.component .body {
order: 2;
}
.component .footer {
order: 3;
}
More info: +only-for, +element, +register, +component, separator +___