Cfa Ui Components

Previews

No matching results.

x
1
2
3
4
5
6
7
8
9
10
11
<article class="cfa-card border border-border-secondary rounded-lg overflow-clip bg-white">
  <div class="flex flex-col gap-px">
    <div class="bg-white p-cfa-lg cfa-stack-sm">
      <h2>This is the card title</h2>
      <p>This is the card content</p>
    </div>
    <div class="bg-white px-cfa-lg pt-cfa-sm pb-cfa-lg cfa-stack-med [&_.btn]:mx-0!">
      <button class="btn btn--primary btn--large">Button</button>
    </div>
  </div>
</article>
1
2
3
4
5
6
7
render(CardComponent.new) do |card|
  card.with_button { content_tag(:button, "Button", class: "btn btn--primary btn--large") }
  safe_join([
    content_tag(:h2, "This is the card title"),
    content_tag(:p, "This is the card content")
  ])
end

No notes provided.

No params configured.