52 lines
1.6 KiB
Plaintext
52 lines
1.6 KiB
Plaintext
---
|
|
import Avatar from '@components/ui/avatars/Avatar.astro';
|
|
|
|
const { avatars, rating, reviews } = Astro.props;
|
|
|
|
interface Props {
|
|
avatars?: Array<string>;
|
|
rating?: string;
|
|
reviews?: string;
|
|
}
|
|
---
|
|
|
|
<div class="mt-6 lg:mt-10">
|
|
<div class="py-5">
|
|
<div class="text-center sm:flex sm:items-center sm:text-start">
|
|
<div class="shrink-0 pb-5 sm:flex sm:pe-5 sm:pb-0">
|
|
{/* Avatar Group */}
|
|
<div class="flex justify-center -space-x-3">
|
|
{
|
|
avatars?.map(src => (
|
|
<Avatar src={src} alt="Illustrative reviewer avatar" />
|
|
))
|
|
}
|
|
<span
|
|
class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-zinc-800 ring-2 ring-white dark:bg-zinc-900 dark:ring-zinc-800"
|
|
>
|
|
<span class="text-xs leading-none font-medium text-white uppercase"
|
|
>Demo</span
|
|
>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="mx-auto h-px w-32 border-t border-neutral-400 sm:mx-0 sm:h-8 sm:w-auto sm:border-s sm:border-t-0 dark:border-neutral-500"
|
|
>
|
|
</div>
|
|
<div class="flex flex-col items-center sm:items-start">
|
|
<div class="flex items-baseline space-x-1 pt-5 sm:ps-5 sm:pt-0">
|
|
<p class="text-neutral-800 dark:text-neutral-200">
|
|
<Fragment set:html={rating || 'Illustrative review preview'} />
|
|
</p>
|
|
</div>
|
|
<div class="text-sm text-neutral-800 sm:ps-5 dark:text-neutral-200">
|
|
<p>
|
|
<Fragment set:html={reviews || 'Static example only'} />
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|