Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 22 additions & 9 deletions src/components/keynoters/keynoter.astro
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---
import type { ImageMetadata } from "astro";
import { getCollection } from "astro:content";
import { Image } from "astro:assets";
import Person1 from "../placeholders/person-1.astro";
import Person2 from "../placeholders/person-2.astro";
Expand All @@ -19,6 +20,7 @@ export interface Props {

const {
name,
slug,
tagline,
image,
placeholder,
Expand All @@ -30,10 +32,12 @@ const placeholders = [Person1, Person2, Person3, Person4, Person5];
const Placeholder =
placeholders[Math.floor(Math.random() * placeholders.length)];

const entries = await getCollection("speakers");
const isSpeaker = entries.some((entry) => entry.id === slug);
---

<li class:list={["list-none rounded-2xl overflow-clip flex group", className]}>
<a class="block w-full h-full relative " >
<div class="block w-full h-full relative">
<div class="relative aspect-[9/10] overflow-clip">
{
image ? (
Expand All @@ -51,21 +55,30 @@ const Placeholder =
}
</div>

<div
class="px-5 py-2 pb-4 bg-keynoter-info rounded-t-none h-full "
>
<div class="px-5 py-2 pb-4 bg-keynoter-info rounded-t-none h-full">
{
placeholder ? (
<p class="text-body-inverted ">More keynoters coming soon</p>
<p class="text-body-inverted">More keynoters coming soon</p>
) : (
<>
<p class="text-[#17223A] font-bold">{name}</p>
{tagline ? (
{isSpeaker ? (
<p class="text-[#17223A] font-bold">
<a
href={`/speaker/${slug}`}
class="text-[#17223A] font-bold hover:underline"
>
{name}
</a>
</p>
) : (
<p class="text-[#17223A] font-bold">{name}</p>
)}
{tagline && (
<p class="text-secondary-hover text-lg italic">{tagline}</p>
) : null}
)}
</>
)
}
</div>
</a>
</div>
</li>