Only show if there are speakers

This commit is contained in:
Oliver Davies 2024-02-06 08:00:00 +00:00
parent 837ed51ef2
commit 90993284d5

View file

@ -1,25 +1,27 @@
<section>
<h2 class="text-3xl font-bold text-center">Speakers</h2>
{% if speakers is not empty %}
<section>
<h2 class="text-3xl font-bold text-center">Speakers</h2>
<div class="mt-8">
<div class="grid grid-cols-2 gap-10 px-4 mx-auto max-w-sm md:grid-cols-3 md:max-w-md lg:grid-cols-4 lg:gap-8 lg:max-w-full xl:grid-cols-6">
{% for speaker in speakers|sort((a, b) => a.name <=> b.name) %}
<div>
<a href="#" class="flex flex-col-reverse gap-3 items-center group">
<div class="text-center">
<p class="text-base group-hover:underline">{{ speaker.name }}</p>
</div>
<div class="mt-8">
<div class="grid grid-cols-2 gap-10 px-4 mx-auto max-w-sm md:grid-cols-3 md:max-w-md lg:grid-cols-4 lg:gap-8 lg:max-w-full xl:grid-cols-6">
{% for speaker in speakers|sort((a, b) => a.name <=> b.name) %}
<div>
<a href="#" class="flex flex-col-reverse gap-3 items-center group">
<div class="text-center">
<p class="text-base group-hover:underline">{{ speaker.name }}</p>
</div>
<div>
<img
alt="Photo of {{ speaker.name }}"
class="object-cover flex-shrink-0 rounded-full shadow-lg size-20 lg:size-32 xl:size-24"
src="{{ speaker.imageUrl }}"
/>
</div>
</a>
</div>
{% endfor %}
<div>
<img
alt="Photo of {{ speaker.name }}"
class="object-cover flex-shrink-0 rounded-full shadow-lg size-20 lg:size-32 xl:size-24"
src="{{ speaker.imageUrl }}"
/>
</div>
</a>
</div>
{% endfor %}
</div>
</div>
</div>
</section>
</section>
{% endif %}