Files
tabler/shared/components/cards/ProjectProgress.astro
T

53 lines
1.3 KiB
Plaintext

---
// NOTE: the `days-ago` param is assigned in the Liquid source but never rendered
// ("Updated 2 hours ago" is hardcoded) — accepted here but unused.
import Progress from '@ui/Progress.astro'
import CardDropdown from '@ui/CardDropdown.astro'
import projects from '@data/projects.json'
interface Project {
title?: string
image?: string
[key: string]: unknown
}
interface Props {
projectId?: number
progress?: number
daysAgo?: number
}
const { projectId = 0, progress = 25 } = Astro.props
const project = (projects as Project[])[projectId]
---
<div class="card">
<div class="card-body">
<div class="row align-items-center">
<div class="col-3">
<img src={project.image} alt={project.title} class="rounded" />
</div>
<div class="col">
<h3 class="card-title mb-1">
<a href="#" class="text-reset">{project.title}</a>
</h3>
<div class="text-secondary">Updated 2 hours ago</div>
<div class="mt-3">
<div class="row g-2 align-items-center">
<div class="col-auto">
{progress}%
</div>
<div class="col">
<Progress value={progress} size="sm" />
</div>
</div>
</div>
</div>
<div class="col-auto">
<CardDropdown />
</div>
</div>
</div>
</div>