Collapsible · Styling

Density and trigger colors via modifier classes on the collapsible root.

Color

    <.collapsible class="collapsible collapsible--md">
  <:trigger>Default width</:trigger>
  <:content>Content</:content>
</.collapsible>
<.collapsible class="collapsible collapsible--md collapsible--accent">
  <:trigger>Accent trigger</:trigger>
  <:content>Content</:content>
</.collapsible>
<.collapsible class="collapsible collapsible--md collapsible--brand">
  <:trigger>Brand trigger</:trigger>
  <:content>Content</:content>
</.collapsible>

Size

    <.collapsible class="collapsible collapsible--sm">
  <:trigger>Small max-width</:trigger>
  <:content>Content</:content>
</.collapsible>
<.collapsible class="collapsible collapsible--lg">
  <:trigger>Large max-width</:trigger>
  <:content>Content</:content>
</.collapsible>