Removed a few typos, added the options for the other popular social links for the speakers grid.

This commit is contained in:
NoobDeveloper412 2024-09-16 19:33:28 +05:00
parent 95d5f8a147
commit f77317bbb1
2 changed files with 45 additions and 27 deletions

View file

@ -8,11 +8,21 @@ const filteredPeople = people
.slice(0, 12); // Limit to the first 12 people .slice(0, 12); // Limit to the first 12 people
function personLink(person) { function personLink(person) {
return person.refs?.twitter if (person.refs?.twitter) {
? `https://twitter.com/${person.refs.twitter}` return `https://twitter.com/${person.refs.twitter}`;
: person.refs?.bsky } else if (person.refs?.bsky) {
? `https://bsky.app/profile/${person.refs.bsky}` return `https://bsky.app/profile/${person.refs.bsky}`;
: "#"; } else if (person.refs?.linkedin) {
return `https://www.linkedin.com/in/${person.refs.linkedin}`;
} else if (person.refs?.github) {
return `https://github.com/${person.refs.github}`;
} else if (person.refs?.matrix) {
return `https://matrix.to/#/${person.refs.matrix}`;
} else if (person.refs?.email) {
return `mailto:${person.refs.email}`;
} else {
return "#";
}
} }
function truncateCaption(caption) { function truncateCaption(caption) {
@ -25,25 +35,33 @@ function truncateCaption(caption) {
} }
--- ---
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-6 gap-4"> <div
{filteredPeople.map((person) => ( class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-6 gap-4"
<div >
class="max-w-xs w-full h-[340px] bg-transparent overflow-hidden p-1 space-y-1 mb-2" {
> filteredPeople.map((person) => (
<a href={personLink(person)}> <div class="max-w-xs w-full h-[340px] bg-transparent overflow-hidden p-1 space-y-1 mb-2">
<img <a href={personLink(person)}>
src={person.imageUrl} <img
alt={person.name} src={person.imageUrl}
class="w-full h-48 object-cover" alt={person.name}
/> class="w-full h-48 object-cover"
</a> />
<div class="mt-4"> </a>
<h3 class="text-lg font-bold leading-6 ">{person.name}</h3> <div class="mt-4">
{person.refs && person.refs.twitter && ( <h3 class="text-lg font-bold leading-6">{person.name}</h3>
<p class="text-sm text-gray-500">@{person.refs.twitter}</p> {person.refs && (
)} <p class="text-sm text-gray-500">
<p class="text-sm">{truncateCaption(person.caption)}</p> {person.refs.twitter && `@${person.refs.twitter}`}
{person.refs.bsky && ` | bsky: ${person.refs.bsky}`}
{person.refs.linkedin && ` | LinkedIn: ${person.refs.linkedin}`}
{person.refs.github && ` | GitHub: ${person.refs.github}`}
{person.refs.matrix && ` | Matrix: ${person.refs.matrix}`}
{person.refs.email && ` | Email: ${person.refs.email}`}
</p>
)}
</div>
</div> </div>
</div> ))
))} }
</div> </div>

View file

@ -70,7 +70,7 @@ for (const e of upcomingEvents) {
<a class="button inverted" href={core.links.manifesto} <a class="button inverted" href={core.links.manifesto}
><button>Read manifesto</button></a ><button>Read manifesto</button></a
> >
<a class="button font-bold " href={core.links.telegram} <a class="button font-bold" href={core.links.telegram}
><button>Join us</button></a ><button>Join us</button></a
> >
</div> </div>
@ -87,7 +87,7 @@ for (const e of upcomingEvents) {
<a class="button inverted" href={core.links.manifesto} <a class="button inverted" href={core.links.manifesto}
><button>Read manifesto</button></a ><button>Read manifesto</button></a
> >
<a class="button " href={core.links.manifesto} <a class="button" href={core.links.manifesto}
><button>Join us</button></a ><button>Join us</button></a
> >
</div> </div>