7 lines
2.1 KiB
Plaintext
7 lines
2.1 KiB
Plaintext
<section data-block="earthen:partner_logos"{% if not title and not logos %} data-empty{% endif %} class="earthen-partner-logos py-16 px-4" style="background-color: hsl(var(--background)); color: hsl(var(--foreground));">
|
|
<div class="max-w-5xl mx-auto">
|
|
{% if title %}<h2 class="earthen-display text-2xl md:text-3xl text-center mb-10" style="font-family: var(--font-heading, \000022Fraunces\000022, \000022Playfair Display\000022, Georgia, serif); color: hsl(var(--primary));">{{ title }}</h2>{% endif %}
|
|
{% if logos %}<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-8 items-center">{% for logo in logos %}<div class="earthen-partner-tile flex justify-center items-center">{% if logo.url %}<a href="{{ logo.url }}" class="earthen-partner-link block transition-colors" title="{{ logo.name }}" aria-label="{{ logo.name }}">{% if logo.image %}<img src="{{ logo.image }}" alt="{{ logo.name }}" class="earthen-partner-img max-h-12 object-contain w-full">{% else %}<div class="earthen-partner-fallback w-full h-12 flex items-center justify-center rounded" style="background-color: hsl(var(--muted)); color: hsl(var(--muted-foreground));"><span class="text-sm">{% if logo.name %}{% for w in logo.name|split:" " %}{% if forloop.Counter <= 2 %}{{ w|first }}{% endif %}{% endfor %}{% else %}?{% endif %}</span></div>{% endif %}</a>{% else %}<div class="earthen-partner-link block" title="{{ logo.name }}" aria-label="{{ logo.name }}">{% if logo.image %}<img src="{{ logo.image }}" alt="{{ logo.name }}" class="earthen-partner-img max-h-12 object-contain w-full">{% else %}<div class="earthen-partner-fallback w-full h-12 flex items-center justify-center rounded" style="background-color: hsl(var(--muted)); color: hsl(var(--muted-foreground));"><span class="text-sm">{% if logo.name %}{% for w in logo.name|split:" " %}{% if forloop.Counter <= 2 %}{{ w|first }}{% endif %}{% endfor %}{% else %}?{% endif %}</span></div>{% endif %}</div>{% endif %}</div>{% endfor %}</div>{% else %}<p class="text-center" style="color: hsl(var(--muted-foreground));">Add partner logos to fill this grid.</p>{% endif %}
|
|
</div>
|
|
</section>
|