Let's imagine I have created two unique custom elements as extensions of the innovative Polymer Element:
- c-el1
- c-el2
Here is how they are templated:
c-el1
<dom-module id="c-el1">
<template>
<style>
p{
color:red;
}
</style>
<c-el2>
<p>custom text</p>
</c-el2>
</template>
</dom-module>
c-el2
<dom-module id="c-el2">
<template>
<style>
p::slotted(*){
color:green;
}
</style>
<p> <slot></slot></p>
</template>
</dom-module>
If the P
element with custom text is slotted in, will it be displayed in green
or red
?
Currently, the custom element c-el1 applies styles to the P
element with custom text, which is slotted into c-el2.