How to omit a part of the selector?
.component .parent-elementThe selector you want to omit .elementThe element you want to style
- SASS
+component('.component')
+register
+element('.parent-element')
+element('.element')
+element('.inner')
+element('.deeper')
+element('.leaf')
display: flex
+_____________________________
+element('.parent-element')
display: inline-flex
+_________________________
+element('.element')
+omit-selector('.parent-element')
position: relative
+_________________________
+element('.inner')
+_________________________
+element('.deeper')
+_________________________
+element('.leaf')
position: relative
left: 0
+omit-selector('.parent-element', '.deeper')
top: 0
- CSS
.component {
display: flex;
}
.component .parent-element {
display: inline-flex;
}
.component .element {
background: red;
}
.component .parent-element .inner .deeper .leaf {
position: relative;
left: 0;
}
.component .inner .leaf {
top: 0;
}
More info: +omit-selector, +element, +register, +component, separator +___