doorman doorman - 3 months ago 31
Sass (Sass) Question

Shadow piercing inside scss

I am using shadow piercing css for one of my styles. But I have color codes inside scss which I want to use in the style. Is it possible to have the shadow piercing inside a scss file?

@Component({
selector: 'my-selector',
styles: [
require('./my.style.scss'),
':host >>> .mystyle { background-color: green }'
],
templateUrl: './my.template.html'
})

Answer

AFAIK >>> is not supported in SASS because this combinator didn't make it into the CSS standard. Angular has it's own implementation to emulate it's support. AFAIR just using a space instead of >>> has the same effect in Angular2 with ViewEncapsulation.Emulated (default).