19 lines
1.3 KiB
Plaintext
19 lines
1.3 KiB
Plaintext
<section class="py-16 md:py-20" data-block="pastel-dream:feature-grid-soft">
|
|
<div class="max-w-6xl mx-auto px-4">
|
|
{% if intro %}<div class="font-body text-center max-w-2xl mx-auto mb-12 text-lg" style="color: hsl(var(--foreground) / 0.78);">
|
|
{{ intro|safe }}
|
|
</div>{% endif %}
|
|
{% if items %}<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
{% for item in items %}<article class="pastel-card p-8 transition-transform" style="transition-timing-function: cubic-bezier(.22,1,.36,1); transition-duration: 240ms;">
|
|
{% if item.icon %}<div class="mb-4">
|
|
<img src="{{ item.icon }}" alt="" class="w-12 h-12 object-contain">
|
|
</div>{% else %}<div class="mb-4 w-12 h-12 rounded-full" style="background-color: hsl(var(--accent) / 0.5);" aria-hidden="true"></div>{% endif %}
|
|
{% if item.title %}<h3 class="font-display text-2xl mb-3" style="color: hsl(var(--foreground));">{{ item.title }}</h3>{% endif %}
|
|
{% if item.body %}<p class="font-body text-base" style="color: hsl(var(--foreground) / 0.78); line-height: 1.75;">{{ item.body }}</p>{% endif %}
|
|
</article>{% endfor %}
|
|
</div>{% else %}<div class="text-center font-body text-base" style="color: hsl(var(--muted-foreground));">
|
|
<p>Add up to three cards to the trio.</p>
|
|
</div>{% endif %}
|
|
</div>
|
|
</section>
|