43 lines
1.2 KiB
Plaintext
43 lines
1.2 KiB
Plaintext
---
|
|
import type { servicesSchema } from '@/content.config'
|
|
import type { z } from 'astro:content'
|
|
|
|
type Props = z.infer<typeof servicesSchema> & { highlighted?: boolean }
|
|
|
|
const { title, description, charachteristics, highlighted = false, link } = Astro.props
|
|
---
|
|
|
|
<div
|
|
class:list={[
|
|
'flex h-full w-full flex-col border-2 px-5 py-6 md:min-h-[550px] md:max-w-[400px] md:px-7 md:py-8',
|
|
'border border-transparent bg-card',
|
|
{ 'border-brand': highlighted },
|
|
]}
|
|
>
|
|
<div class="mb-8 flex flex-col gap-2">
|
|
<h3 class="text-2xl font-bold">{title}</h3>
|
|
{description && <span>{description}</span>}
|
|
</div>
|
|
|
|
<ul class="mb-16 flex-grow space-y-4">
|
|
{
|
|
charachteristics?.map((charachteristic) => (
|
|
<li class="flex items-start justify-between space-x-2">
|
|
<span class="text-text-light">{charachteristic.text}</span>
|
|
{charachteristic.price && (
|
|
<span class="ml-2 text-nowrap text-end text-brand" set:html={charachteristic.price} />
|
|
)}
|
|
</li>
|
|
))
|
|
}
|
|
</ul>
|
|
|
|
{
|
|
link && (
|
|
<a href={link.href} target={link.target} class="brand-btn-outline">
|
|
{link.title}
|
|
</a>
|
|
)
|
|
}
|
|
</div>
|