Cfa Ui Components
x
1
2
3
4
5
6
7
8
9
10
11
<div class="border-zinc-300 border rounded-md p-4 space-y-4">
  <details class="group">
    <summary class="flex justify-between items-center after:ml-10px after:content-[url('/icons/arrow_closed.svg')] after:transform-[0.2s] group-open:after:content-[url('/icons/arrow_open.svg')] list-none cursor-pointer">
      <p class='flex font-bold items-center'>
        <img alt="question icon" class="size-[20px] mr-2" src="/assets/icons/circle_question-deb1d81e.svg" />
        I am summary
      </p>
    </summary>
    <p style="margin-top: 8px;">Sample Details</p>
  </details>
</div>
1
2
3
render(RevealComponent.new(summary_text: "I am summary", icon: "question", style: :secondary)) do
  content_tag(:p,  "Sample Details", style: "margin-top: 8px;")
end

No notes provided.

No params configured.