Files
tabler/shared/components/cards/UserCardBg.astro
Paweł Kunaandgithub-actions[bot] 39634cb4b9 Improve docs SEO, performance and content quality (#2841)
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
2026-08-11 14:45:31 +02:00

40 lines
1.1 KiB
Plaintext

---
// person = people[person-id]; the cover photo is photos[person-id].file.
import { staticPath } from '@shared/lib/assets'
import Avatar from '@ui/Avatar.astro'
import people from '@data/people.json'
import photos from '@data/photos.json'
import { requireIndex } from '@shared/lib/array'
interface Person {
full_name?: string
job_title?: string
photo?: string
[key: string]: unknown
}
interface Photo {
file?: string
[key: string]: unknown
}
interface Props {
personId?: number
blurred?: boolean
}
const { personId = 0, blurred } = Astro.props
const person = requireIndex(people as Person[], personId)
const photo = requireIndex(photos as Photo[], personId)
---
<a class="card card-link" href="#">
<div class={`card-cover text-center${blurred ? ' card-cover-blurred' : ''}`} style={`background-image: url(${staticPath(`photos/${photo.file}`)})`}>
<Avatar size="xl" person={person} thumb />
</div>
<div class="card-body text-center">
<h3 class="card-title mb-1">{person.full_name}</h3>
<div class="text-secondary">{person.job_title}</div>
</div>
</a>