Catalog Cards

<.image>

ConnieUI.Cards

Waiting for 2 signers
Feature Film — "Northern Lights"
HEEx 
<div class="w-xs">
  <ConnieUI.Cards.card>
    <ConnieUI.Cards.image image={@project.image}>
      <ConnieUI.Badges.card_status_badge>Waiting for 2 signers</ConnieUI.Badges.card_status_badge>
    </ConnieUI.Cards.image>
    <ConnieUI.Cards.content>{@project.name}</ConnieUI.Cards.content>
  </ConnieUI.Cards.card>
</div>

Variant matrix

Every combination of one or two attributes, side by side.

Controls

:string

nil draws `gradient` instead

Set by the example

gradient click

Docs

No @doc for this component.

Attribute Type Default Description
image * :string
nil draws `gradient` instead
gradient :any nil
a `ConnieUI.ColorTags` tag drawn when there's no image; nil is the brand gradient
grayscale :boolean false
click {:struct, Phoenix.LiveView.JS} nil
Slot Slot attributes Description
inner_block