web3privacy/web
1
0
Fork 0
mirror of https://github.com/web3privacy/web synced 2024-10-15 18:26:27 +02:00
Code Issues Projects Releases Packages Wiki Activity

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

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

42
src/components/SpeakerGrid.astro
View file

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