Collapse

Variables

--va-collapse-font-size: var(--va-font-size-1);
--va-collapse-padding: var(--va-space-3);
--va-collapse-border-width: var(--va-border-width);
--va-collapse-border-color: var(--va-border-color);
--va-collapse-background-color: var(--va-surface-primary);
--va-collapse-caret-width: calc(var(--va-collapse-font-size) / 3);
--va-collapse-tree-indentation: var(--va-space-8);

Default

The purpose of thought

We can attain wisdom by three ways: first, by way of experience, this is the most difficult way; second, by way of imitation, this is the easiest way; and third by way of meditation, and this is the noblest way.

Confucius

<details class="va-collapse w-full">
  <summary>
    <strong>The purpose of thought</strong>
  </summary>
  <p>
    We can attain wisdom by three ways: first, by way of experience, this is
    the most difficult way; second, by way of imitation, this is the easiest
    way; and third by way of meditation, and this is the noblest way.
  </p>
  <p>Confucius</p>
</details>

Nested

Thought
The purpose of thought
1

It often happens that a thought comes to us that seems both true and strange, and we hesitate to believe it. But then, if you think about it thoroughly, you see that the thought that seemed strange is the simplest truth, such that once you come to know it, you cannot stop believing in it.

2

While living among people, do not forget what you learned in solitude. And in solitude, reflect on what you learned from interacting with people.

<div class="va-button-group w-full">
  <details class="va-collapse">
    <summary>
      <strong>Thought</strong>
    </summary>
    <details class="va-collapse">
      <summary>
        <strong>The purpose of thought</strong>
      </summary>
      <details class="va-collapse">
        <summary>
          <strong>1</strong>
        </summary>
        <p>It often happens that a thought comes to us that seems both true and strange, and we hesitate to believe it. But then, if you think about it thoroughly, you see that the thought that seemed strange is the simplest truth, such that once you come to know it, you cannot stop believing in it.</p>
      </details>
        <details class="va-collapse">
        <summary>
          <strong>2</strong>
        </summary>
        <p>
          While living among people, do not forget what you learned in solitude. And in solitude, reflect on what you learned from interacting with people.
        </p>
      </details>
      <button class="va-button"><strong>Buttons can also be nested 🚀</strong></button>
    </details>
  </details>
</div>