View Source Phoenix.UI.Components.Card (Phoenix UI v0.1.4)
Provides card component.
Link to this section Summary
Functions
Renders card component.
Renders card actions component.
Renders card content component.
Renders card header component.
Renders card media component.
Link to this section Functions
@spec card(Phoenix.LiveView.Socket.assigns()) :: Phoenix.LiveView.Rendered.t()
Renders card component.
examples
Examples
```
<.card
elevation={3}
square={true}
variant="elevated"
>
content
</.card>
```
attributes
Attributes
element
(:string
) - Defaults to"div"
.extend_class
(:string
)rest
(:global
)
slots
Slots
inner_block
(required)
@spec card_action(Phoenix.LiveView.Socket.assigns()) :: Phoenix.LiveView.Rendered.t()
Renders card actions component.
examples
Examples
```
<.card>
...
<.card_action>
content
</.card_action>
...
</.card>
```
attributes
Attributes
element
(:string
) - Defaults to"div"
.extend_class
(:string
)rest
(:global
)
@spec card_content(Phoenix.LiveView.Socket.assigns()) :: Phoenix.LiveView.Rendered.t()
Renders card content component.
examples
Examples
```
<.card>
...
<.card_content>
content
</.card_content>
...
</.card>
```
attributes
Attributes
element
(:string
) - Defaults to"div"
.extend_class
(:string
)rest
(:global
)
@spec card_header(Phoenix.LiveView.Socket.assigns()) :: Phoenix.LiveView.Rendered.t()
Renders card header component.
examples
Examples
```
<.card>
<.card_header>
header
</.card_header>
...
</.card>
```
attributes
Attributes
element
(:string
) - Defaults to"div"
.extend_class
(:string
)rest
(:global
)
slots
Slots
action
avatar_group
avatar
subtitle
title
@spec card_media(Phoenix.LiveView.Socket.assigns()) :: Phoenix.LiveView.Rendered.t()
Renders card media component.
examples
Examples
```
<.card>
...
<.card_media/>
...
</.card>
```
attributes
Attributes
element
(:string
) - Defaults to"img"
.extend_class
(:string
)rest
(:global
)