mirror of
https://github.com/tabler/tabler.git
synced 2026-10-12 21:27:06 +04:00
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
33 lines
835 B
Plaintext
33 lines
835 B
Plaintext
---
|
|
import Subheader from '@ui/Subheader.astro'
|
|
import Avatar from '@ui/Avatar.astro'
|
|
import Progress from '@ui/Progress.astro'
|
|
|
|
interface Props {
|
|
color?: string
|
|
icon?: string
|
|
title?: string
|
|
value?: string
|
|
progress?: number
|
|
}
|
|
|
|
const { color = 'primary', icon = 'trending-up', title = 'Total', value = '0', progress = 0 } = Astro.props
|
|
---
|
|
|
|
<div class={`card card-gradient card-gradient-${color} card-gradient-start`}>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col">
|
|
<Subheader as="h4" class="mb-1">{title}</Subheader>
|
|
<div class="h3 m-0">{value}</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<Avatar icon={icon} color={color} />
|
|
</div>
|
|
<div class="col-12">
|
|
<Progress value={progress} color={color} size="sm" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|