@magic-spells/collapsible-content/dist/collapsible-content.css

Collapsible content web component

:root {
  --cc-component-display: block;
  --cc-button-width: 100%;
  --cc-button-text-align: left;
  --cc-button-background: none;
  --cc-button-border: none;
  --cc-button-cursor: pointer;
  --cc-content-padding: 0px;
  --cc-content-display: block;
  --cc-content-overflow: hidden;
  --cc-transition-duration: 0.35s;
  --cc-transition-timing: ease-out;
}

collapsible-component {
  display: var(--cc-component-display, block);
}
collapsible-component button {
  width: var(--cc-button-width, 100%);
  text-align: var(--cc-button-text-align, left);
  background: var(--cc-button-background, none);
  border: var(--cc-button-border, none);
  cursor: var(--cc-button-cursor, pointer);
}
collapsible-component collapsible-content[hidden] {
  display: var(--cc-content-display, block);
}

collapsible-content {
  padding: var(--cc-content-padding, 0px);
  display: var(--cc-content-display, block);
  overflow: var(--cc-content-overflow, hidden);
  transition: height var(--cc-transition-duration, 0.35s) var(--cc-transition-timing, ease-out);
}