events filter border

This commit is contained in:
tree🌴 2024-03-02 18:15:26 +01:00
parent 47a992ccf4
commit abfa34fff8

View file

@ -75,15 +75,15 @@ places = places.sort((x, y) => x.num < y.num ? 1 : -1)
<div class="middle-pane-medium mt-10"> <div class="middle-pane-medium mt-10">
<div class="mb-10 sm:mb-14"> <div class="mb-8 sm:mb-14">
<div class="flex flex-wrap gap-3 uppercase mb-4"> <div class="flex flex-wrap gap-3 uppercase mb-4">
{types.map((type) => ( {types.map((type) => (
<a href={`/events/${type.id}`} class="px-2 py-0 border border-white/15 rounded-xl" class:list={[ (type.id === selectedType) || (!type.id && !selectedType)? 'text-white border-white' : 'hover:bg-white/20']}>{type.plural} ({type.id ? core.events.filter(obj => obj.type === type.id).length : core.events.length})</a> <a href={`/events/${type.id}`} class="px-2 py-0 border border-white/15 rounded-xl" class:list={[ (type.id === selectedType) || (!type.id && !selectedType)? 'text-white border-white/60' : 'hover:bg-white/20']}>{type.plural} ({type.id ? core.events.filter(obj => obj.type === type.id).length : core.events.length})</a>
))} ))}
</div> </div>
<div class="flex flex-wrap gap-2 uppercase text-sm"> <div class="flex flex-wrap gap-2 uppercase text-sm">
{places.map((place) => ( {places.map((place) => (
<a href={place.id ? `/events/country/${place.id}` : `/events`} class="px-2 py-0.5 border border-white/15 rounded-xl flex gap-2" class:list={[ (place.id === selectedCountry) || (!place.id && !selectedCountry)? 'text-white border-white' : 'hover:bg-white/20']}> <a href={place.id ? `/events/country/${place.id}` : `/events`} class="px-2 py-0.5 border border-white/15 rounded-xl flex gap-2" class:list={[ (place.id === selectedCountry) || (!place.id && !selectedCountry)? 'text-white border-white/60' : 'hover:bg-white/20']}>
{place.id && {place.id &&
<img src={`/flags/${place.country}.svg`} class="w-4 inline-block" /> <img src={`/flags/${place.country}.svg`} class="w-4 inline-block" />
} }
@ -97,16 +97,15 @@ places = places.sort((x, y) => x.num < y.num ? 1 : -1)
<img src="/events-map.svg" class="w-full" /> <img src="/events-map.svg" class="w-full" />
</div--> </div-->
{upcoming.length > 0 && {upcoming.length > 0}
<div> <div>
<h1 id="upcoming">Upcoming {title} ({upcoming.length})</h1> <h1 id="upcoming">Upcoming {title} ({upcoming.length})</h1>
<div class="mb-10"> <div class="mb-10">
{upcoming.map((event) => ( {upcoming.map((event) => (
<EventItem item={event} /> <EventItem item={event} />
))} ))}
</div>
</div> </div>
} </div>
{pastTotal > 0 && {pastTotal > 0 &&
<div> <div>