36 lines
1.1 KiB
Text
36 lines
1.1 KiB
Text
---
|
|
import IconButton from '@/components/icon-button.astro';
|
|
import Photo from '@/components/photo.astro';
|
|
import Typography from '@/components/typography.astro';
|
|
import type { Testimonial } from '@/types/testimonials-section';
|
|
|
|
export interface Props {
|
|
testimonial: Testimonial;
|
|
}
|
|
|
|
const {
|
|
testimonial: { author, content, image, relation, socials },
|
|
} = Astro.props;
|
|
---
|
|
|
|
<div class="flex w-full flex-col gap-4">
|
|
<div class="flex justify-between">
|
|
<div class="flex flex-col gap-4 sm:flex-row">
|
|
<Photo src={image} alt={author} class="w-14 h-14 rounded-lg" width={108} height={108} />
|
|
<div>
|
|
<Typography variant="item-title">{author}</Typography>
|
|
<Typography variant="item-subtitle">{relation}</Typography>
|
|
</div>
|
|
</div>
|
|
{
|
|
socials && (
|
|
<div class="flex gap-3">
|
|
{socials.map(({ icon, url, name }) => (
|
|
<IconButton icon={icon} href={url} target="_blank" size="small" aria-label={name} />
|
|
))}
|
|
</div>
|
|
)
|
|
}
|
|
</div>
|
|
<Typography variant="paragraph">{content}</Typography>
|
|
</div>
|