thaw/demo_markdown/docs/card/mod.md

45 lines
1.6 KiB
Markdown
Raw Normal View History

# Card
```rust demo
view! {
2024-05-14 14:56:48 +08:00
<Card>
<CardHeader>
2024-05-16 16:18:36 +08:00
<Body1>
2024-06-03 16:31:32 +08:00
<b>"Header"</b>" 2022-02-22"
2024-05-16 16:18:36 +08:00
</Body1>
2024-05-14 14:56:48 +08:00
<CardHeaderDescription slot>
2024-05-14 17:39:13 +08:00
<Caption1>"Description"</Caption1>
2024-05-14 14:56:48 +08:00
</CardHeaderDescription>
<CardHeaderAction slot>
<Button appearance=ButtonAppearance::Transparent>
"..."
</Button>
</CardHeaderAction>
</CardHeader>
<CardPreview>
<img src="https://s3.bmp.ovh/imgs/2021/10/2c3b013418d55659.jpg" style="width: 100%"/>
</CardPreview>
<CardFooter>
<Button>"Reply"</Button>
<Button>"Share"</Button>
</CardFooter>
</Card>
}
```
### Card Props
2024-02-09 22:44:22 +08:00
| Name | Type | Default | Description |
| -------- | ----------------------------------- | -------------------- | --------------------------------------- |
| class | `OptionalProp<MaybeSignal<String>>` | `Default::default()` | Addtional classes for the card element. |
| title | `OptionalProp<MaybeSignal<String>>` | `Default::default()` | Card title. |
| children | `Children` | | Card's content. |
### Card Slots
| Name | Default | Description |
| --------------- | ------- | --------------------- |
| CardHeader | `None` | Header content. |
| CardHeaderExtra | `None` | Header extra content. |
| CardFooter | `None` | Footer content. |