logo svelte /scoped props v0.1.5
FIG-001/ COMPOUND

compound selectors.

Toggling a conditionally-added class gates a compound rule (.page-rows.paged) on the same child element. The synthesized marker also keeps a descendant-combinator rule alive, so neither survives Svelte's unused-CSS pruning by accident.

↩ all examples
syntax · scoped:classselector · compoundstatus · passing mode · live running source
Child component
Child receives class="page-rows paged svelte-tgsvjm".
Source Current result
Compound selector rowClass = ['page-rows', { paged }] .page-rows.paged { … }
Compound selector child-card page-rows paged svelte-parent svelte-child compound rule applies
Descendant combinator <div class="rows-frame"> .rows-frame .page-rows { … }
Descendant combinator rows-frame svelte-parent > child-card page-rows svelte-parent combinator rule applies
category · compound
sheet · sheet 01 / 01
⟳ to re-run