web3privacy
/
web
mirror of https://github.com/web3privacy/web
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

highlight summits and hackathons

This commit is contained in:
tree🌴 2024-01-26 00:17:22 +01:00
parent 4dedd2128a
commit 28044db906
1 changed files with 23 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/components/EventItem.astro
View File

@ -1,8 +1,11 @@
--- ---
const { item } = Astro.props; const { item } = Astro.props;
import { format, compareAsc, addDays } from 'date-fns'; import { format, compareAsc, addDays, isFuture } from 'date-fns';
import { marked } from 'marked'; import { marked } from 'marked';
const isDate = item.date.match(/^\d{4}-\d{2}-\d{2}$/)
const future = isDate && !isFuture(new Date(item.date));
function dateFormat (str) { function dateFormat (str) {
if (str.match(/^\d{4}-\d{2}-\d{2}$/)) { if (str.match(/^\d{4}-\d{2}-\d{2}$/)) {
return format(new Date(str), 'MMM d, yyyy') return format(new Date(str), 'MMM d, yyyy')
@ -56,10 +59,16 @@ const statuses = {
confirmed: { confirmed: {
title: 'Confirmed', title: 'Confirmed',
color: 'text-green-500', color: 'text-green-500',
},
past: {
title: 'Already happened',
color: 'text-green-800',
} }
} }
const status = item.confirmed ? statuses.confirmed : (item.links?.rsvp ? statuses.preregistration : statuses.unconfirmed) const status = item.confirmed
? (future ? statuses.past : statuses.confirmed)
: (item.links?.rsvp ? statuses.preregistration : statuses.unconfirmed);
--- ---
@ -73,7 +82,14 @@ const status = item.confirmed ? statuses.confirmed : (item.links?.rsvp ? statuse
} }
</div> </div>
<div> <div>
<div class="text-lg text-white">{nameRenderer(item)}</div> <div class="">
<span class="text-white text-lg">{nameRenderer(item)}</span>
<div class="inline-block ml-2">
{item.type === "hackathon" && <span class="text-xs ml-2 text-black bg-white px-1 py-0.5">HACKATHON</span>}
{item.type === "summit" && <span class="text-xs ml-2 text-black bg-white px-1 py-0.5">SUMMIT</span>}
{item.tags && item.tags.includes("sfe") && <span class="text-xs ml-2 text-black bg-gray-500 px-1 py-0.5" title="Sponsorship Free Edition (SFE)">SFE</span>}
</div>
</div>
<div class="flex gap-2"> <div class="flex gap-2">
<img src={`/flags/${item.country}.svg`} class="w-4" /> <img src={`/flags/${item.country}.svg`} class="w-4" />
<div> <div>
@ -99,7 +115,10 @@ const status = item.confirmed ? statuses.confirmed : (item.links?.rsvp ? statuse
<div class="w-0 sm:w-28"></div> <div class="w-0 sm:w-28"></div>
<div> <div>
<div>Date: <span class="text-white">{dateFormat(item.date)} {item.days ? ' - ' + dateFormat(dateEnd(item.date, item.days)) + ` (${item.days} days)` : ''}</span></div> <div>Date: <span class="text-white">{dateFormat(item.date)} {item.days ? ' - ' + dateFormat(dateEnd(item.date, item.days)) + ` (${item.days} days)` : ''}</span></div>
<div>Place: {item.place && <span set:html={marked.parseInline(item.place)} class="text-white"></span> || "TBD"}</div> <div>
Place: {item.place && <span set:html={marked.parseInline(item.place)} class="text-white"></span> || "TBD"}
{item.place && item['place-address'] && <span> @ </span><span class="text-white">{item['place-address']}</span>}
</div>
<div>Status: <span class:list={[status.color]} class="mr-1.5 text-xs">●</span> {status.title}</div> <div>Status: <span class:list={[status.color]} class="mr-1.5 text-xs">●</span> {status.title}</div>
<div>Lead: <span class="text-white">{item.lead || 'n/a'}</span></div> <div>Lead: <span class="text-white">{item.lead || 'n/a'}</span></div>