20 lines
520 B
HTML
20 lines
520 B
HTML
<div class=test><span>First</span></div>
|
|
<div class=test><span>Second</span></div>
|
|
<script>
|
|
for (test of document.querySelectorAll('.test')) {
|
|
const shadow = test.attachShadow({mode: 'open'});
|
|
shadow.innerHTML = `
|
|
<style>
|
|
@media (min-width:200px) {
|
|
div { color: green }
|
|
:host { background-color: lightgrey }
|
|
}
|
|
@media (max-width:200px) {
|
|
::slotted(*) { color: red }
|
|
}
|
|
</style>
|
|
<div><slot></slot></div>
|
|
`;
|
|
}
|
|
</script>
|