notkaramel/ECSESS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Lint format with Prettier

Browse Source
This commit is contained in:
Antoine Phan
2026-01-11 21:41:40 -05:00
parent 9fc25f3072
commit 4ffa937600
9 changed files with 67 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/event/EBComponents/EventActionButtons.svelte
View File

@@ -2,11 +2,7 @@
import { FilePen, CalendarPlus, Link as LinkIcon } from '@lucide/svelte'; import { FilePen, CalendarPlus, Link as LinkIcon } from '@lucide/svelte';
import type { LinkType } from '$lib/schemas'; import type { LinkType } from '$lib/schemas';
let { let { registrationLink, paymentLink, addToCalendar } = $props<{
registrationLink,
paymentLink,
addToCalendar
} = $props<{
registrationLink?: LinkType[] | null; registrationLink?: LinkType[] | null;
paymentLink?: LinkType[] | null; paymentLink?: LinkType[] | null;
addToCalendar: () => void; addToCalendar: () => void;
@@ -17,21 +13,23 @@
}; };
</script> </script>
<div class="space-y-2 pointer-events-auto"> <div class="pointer-events-auto space-y-2">
<div class="grid grid-cols-2 gap-3 sm:grid-cols-3 md:gap-2"> <div class="grid grid-cols-2 gap-3 sm:grid-cols-3 md:gap-2">
{#if registrationLink} {#if registrationLink}
<a <a
href={registrationLink[0].url} href={registrationLink[0].url}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
class="flex flex-1 items-center justify-center gap-2 rounded-xl bg-ecsess-500 px-4 py-3 text-sm font-bold text-white transition-colors hover:bg-ecsess-600" class="bg-ecsess-500 hover:bg-ecsess-600 flex flex-1 items-center justify-center gap-2 rounded-xl px-4 py-3 text-sm font-bold text-white transition-colors"
onclick={handleClick} onclick={handleClick}
> >
<FilePen class="h-4 w-4" strokeWidth={2.5} /> <FilePen class="h-4 w-4" strokeWidth={2.5} />
Register Register
</a> </a>
{:else} {:else}
<div class="flex items-center justify-center gap-2 rounded-xl bg-ecsess-700/50 px-4 py-3 text-sm font-bold text-ecsess-300/70 opacity-60"> <div
class="bg-ecsess-700/50 text-ecsess-300/70 flex items-center justify-center gap-2 rounded-xl px-4 py-3 text-sm font-bold opacity-60"
>
<FilePen class="h-4 w-4" strokeWidth={2.5} /> <FilePen class="h-4 w-4" strokeWidth={2.5} />
Drop In Drop In
</div> </div>
@@ -43,7 +41,7 @@
e.stopPropagation(); e.stopPropagation();
addToCalendar(); addToCalendar();
}} }}
class="flex w-full items-center justify-center gap-2 rounded-xl bg-ecsess-700 px-4 py-3 text-sm font-bold text-white transition-colors hover:bg-ecsess-800" class="bg-ecsess-700 hover:bg-ecsess-800 flex w-full items-center justify-center gap-2 rounded-xl px-4 py-3 text-sm font-bold text-white transition-colors"
> >
<CalendarPlus class="h-5 w-5" strokeWidth={2.5} /> <CalendarPlus class="h-5 w-5" strokeWidth={2.5} />
Add to Calendar Add to Calendar
@@ -54,14 +52,16 @@
href={paymentLink[0].url} href={paymentLink[0].url}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
class="col-span-2 flex items-center justify-center gap-2 rounded-xl bg-ecsess-800 px-4 py-3 text-sm font-bold text-white transition-colors hover:bg-ecsess-900 sm:col-span-1" class="bg-ecsess-800 hover:bg-ecsess-900 col-span-2 flex items-center justify-center gap-2 rounded-xl px-4 py-3 text-sm font-bold text-white transition-colors sm:col-span-1"
onclick={handleClick} onclick={handleClick}
> >
<LinkIcon class="h-4 w-4" strokeWidth={2.5} /> <LinkIcon class="h-4 w-4" strokeWidth={2.5} />
Pay Pay
</a> </a>
{:else} {:else}
<div class="col-span-2 flex items-center justify-center gap-2 rounded-xl bg-ecsess-800/50 px-4 py-3 text-sm font-bold text-ecsess-300/70 opacity-60 sm:col-span-1"> <div
class="bg-ecsess-800/50 text-ecsess-300/70 col-span-2 flex items-center justify-center gap-2 rounded-xl px-4 py-3 text-sm font-bold opacity-60 sm:col-span-1"
>
Free! Free!
</div> </div>
{/if} {/if}

16
src/components/event/EBComponents/EventBadges.svelte
View File

@@ -5,13 +5,19 @@
}>(); }>();
</script> </script>
<div class="absolute top-0 left-0 right-0 z-30 flex items-start justify-between gap-2 p-4 pointer-events-none"> <div
class="pointer-events-none absolute top-0 right-0 left-0 z-30 flex items-start justify-between gap-2 p-4"
>
{#if isPastEvent} {#if isPastEvent}
<span class="rounded-full bg-ecsess-800/90 px-4 py-1.5 text-xs font-bold uppercase tracking-wider text-gray-300 backdrop-blur-sm"> <span
class="bg-ecsess-800/90 rounded-full px-4 py-1.5 text-xs font-bold tracking-wider text-gray-300 uppercase backdrop-blur-sm"
>
Past Event Past Event
</span> </span>
{:else} {:else}
<span class="rounded-full bg-ecsess-400 px-4 py-1.5 text-xs font-bold uppercase tracking-wider text-white backdrop-blur-sm"> <span
class="bg-ecsess-400 rounded-full px-4 py-1.5 text-xs font-bold tracking-wider text-white uppercase backdrop-blur-sm"
>
Upcoming Upcoming
</span> </span>
{/if} {/if}
@@ -19,7 +25,9 @@
{#if eventCategory && eventCategory.length > 0} {#if eventCategory && eventCategory.length > 0}
<div class="flex flex-wrap justify-end gap-2"> <div class="flex flex-wrap justify-end gap-2">
{#each eventCategory as category} {#each eventCategory as category}
<span class="rounded-full bg-ecsess-500/90 px-3 py-1.5 text-xs font-bold uppercase tracking-wider text-white backdrop-blur-sm"> <span
class="bg-ecsess-500/90 rounded-full px-3 py-1.5 text-xs font-bold tracking-wider text-white uppercase backdrop-blur-sm"
>
{category} {category}
</span> </span>
{/each} {/each}

20
src/components/event/EBComponents/EventDescription.svelte
View File

@@ -15,12 +15,14 @@
}; };
</script> </script>
<div class="relative z-30 p-6 pointer-events-auto"> <div class="pointer-events-auto relative z-30 p-6">
<h3 class="text-2xl font-bold leading-tight text-white">{eventTitle}</h3> <h3 class="text-2xl leading-tight font-bold text-white">{eventTitle}</h3>
</div> </div>
<div class="relative z-30 my-2 flex h-56 flex-col md:h-64 xl:h-80 pointer-events-auto"> <div class="pointer-events-auto relative z-30 my-2 flex h-56 flex-col md:h-64 xl:h-80">
<div class="flex flex-1 justify-center overflow-y-auto border-y border-ecsess-800 p-6 text-ecsess-100"> <div
class="border-ecsess-800 text-ecsess-100 flex flex-1 justify-center overflow-y-auto border-y p-6"
>
{#if eventDescription} {#if eventDescription}
<RichText value={eventDescription} /> <RichText value={eventDescription} />
{:else} {:else}
@@ -30,13 +32,15 @@
</div> </div>
{#if generalLink} {#if generalLink}
<div class="relative z-30 flex w-full flex-wrap items-center justify-center gap-3 overflow-auto p-6 pb-8 pointer-events-auto"> <div
class="pointer-events-auto relative z-30 flex w-full flex-wrap items-center justify-center gap-3 overflow-auto p-6 pb-8"
>
{#each generalLink.slice(0, 4) as link} {#each generalLink.slice(0, 4) as link}
<a <a
href={link.url} href={link.url}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
class="flex items-center justify-center gap-2 rounded-xl bg-ecsess-600 px-4 py-3 text-sm font-bold text-white transition-colors hover:bg-ecsess-700" class="bg-ecsess-600 hover:bg-ecsess-700 flex items-center justify-center gap-2 rounded-xl px-4 py-3 text-sm font-bold text-white transition-colors"
onclick={handleClick} onclick={handleClick}
> >
<ExternalLinkIcon class="h-4 w-4" strokeWidth={2.5} /> <ExternalLinkIcon class="h-4 w-4" strokeWidth={2.5} />
@@ -46,6 +50,6 @@
</div> </div>
{/if} {/if}
<div class="relative z-30 p-4 lg:hidden pointer-events-auto"> <div class="pointer-events-auto relative z-30 p-4 lg:hidden">
<p class="text-sm text-ecsess-400">Click to flip back</p> <p class="text-ecsess-400 text-sm">Click to flip back</p>
</div> </div>

12
src/components/event/EBComponents/EventImageHeader.svelte
View File

@@ -26,10 +26,12 @@
const imageAlt = $derived(thumbnail ? eventTitle : `${eventCategory?.[0] || 'Default'} Event`); const imageAlt = $derived(thumbnail ? eventTitle : `${eventCategory?.[0] || 'Default'} Event`);
</script> </script>
<div class="relative z-30 h-80 overflow-hidden rounded-t-2xl pointer-events-none"> <div class="pointer-events-none relative z-30 h-80 overflow-hidden rounded-t-2xl">
<img class="h-full w-full object-cover pointer-events-none" src={imageSrc} alt={imageAlt} /> <img class="pointer-events-none h-full w-full object-cover" src={imageSrc} alt={imageAlt} />
<div class="absolute inset-0 bg-gradient-to-b from-transparent via-ecsess-800/20 to-ecsess-950 rounded-t-2xl pointer-events-none"></div> <div
<div class="absolute bottom-0 left-0 right-0 p-6 pointer-events-none"> class="via-ecsess-800/20 to-ecsess-950 pointer-events-none absolute inset-0 rounded-t-2xl bg-gradient-to-b from-transparent"
<h3 class="text-2xl font-bold leading-tight text-white">{eventTitle}</h3> ></div>
<div class="pointer-events-none absolute right-0 bottom-0 left-0 p-6">
<h3 class="text-2xl leading-tight font-bold text-white">{eventTitle}</h3>
</div> </div>
</div> </div>

12
src/components/event/EBComponents/EventInfoGrid.svelte
View File

@@ -7,22 +7,24 @@
}>(); }>();
</script> </script>
<div class="relative z-30 m-5 space-y-3 rounded-xl border border-ecsess-800/30 bg-ecsess-900/60 p-4 backdrop-blur-sm pointer-events-none"> <div
class="border-ecsess-800/30 bg-ecsess-900/60 pointer-events-none relative z-30 m-5 space-y-3 rounded-xl border p-4 backdrop-blur-sm"
>
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<div class="flex h-10 w-10 items-center justify-center rounded-full bg-ecsess-400"> <div class="bg-ecsess-400 flex h-10 w-10 items-center justify-center rounded-full">
<CalendarDays class="h-5 w-5 text-white" strokeWidth={2.5} /> <CalendarDays class="h-5 w-5 text-white" strokeWidth={2.5} />
</div> </div>
<div class="flex-1"> <div class="flex-1">
<p class="text-sm font-semibold text-ecsess-50">{date}</p> <p class="text-ecsess-50 text-sm font-semibold">{date}</p>
</div> </div>
</div> </div>
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<div class="flex h-10 w-10 items-center justify-center rounded-full bg-ecsess-400"> <div class="bg-ecsess-400 flex h-10 w-10 items-center justify-center rounded-full">
<MapPin class="h-5 w-5 text-white" strokeWidth={2.5} /> <MapPin class="h-5 w-5 text-white" strokeWidth={2.5} />
</div> </div>
<div class="flex-1"> <div class="flex-1">
<p class="text-sm font-semibold text-ecsess-50">{location ?? 'TBA'}</p> <p class="text-ecsess-50 text-sm font-semibold">{location ?? 'TBA'}</p>
</div> </div>
</div> </div>
</div> </div>

11
src/components/event/EventBlock.svelte
View File

@@ -80,13 +80,13 @@
<div class="group relative flex h-full w-full flex-col rounded-2xl perspective-[1000px]"> <div class="group relative flex h-full w-full flex-col rounded-2xl perspective-[1000px]">
<div <div
class="grid h-full w-full text-center transition-transform duration-500 rounded-2xl transform-3d {showDescription class="grid h-full w-full rounded-2xl text-center transition-transform duration-500 transform-3d {showDescription
? 'transform-[rotateY(180deg)]' ? 'transform-[rotateY(180deg)]'
: ''}" : ''}"
> >
<!-- Front Side --> <!-- Front Side -->
<div <div
class="col-start-1 row-start-1 flex h-full w-full flex-col rounded-2xl bg-ecsess-950 transition-opacity duration-500 backface-hidden transform-3d transform-[rotateY(0)] cursor-pointer {showDescription class="bg-ecsess-950 col-start-1 row-start-1 flex h-full w-full transform-[rotateY(0)] cursor-pointer flex-col rounded-2xl transition-opacity duration-500 backface-hidden transform-3d {showDescription
? 'pointer-events-none opacity-0' ? 'pointer-events-none opacity-0'
: 'opacity-100'}" : 'opacity-100'}"
data-flip-side="front" data-flip-side="front"
@@ -96,26 +96,25 @@
onkeydown={handleKeyDown} onkeydown={handleKeyDown}
aria-label="Flip event card to view description" aria-label="Flip event card to view description"
> >
<EventImageHeader {eventTitle} {thumbnail} {eventCategory} /> <EventImageHeader {eventTitle} {thumbnail} {eventCategory} />
<EventBadges {isPastEvent} {eventCategory} /> <EventBadges {isPastEvent} {eventCategory} />
<EventInfoGrid {date} {location} /> <EventInfoGrid {date} {location} />
{#if !isPastEvent} {#if !isPastEvent}
<div class="relative z-30 flex-1 px-6 pb-4 pt-0 pointer-events-auto"> <div class="pointer-events-auto relative z-30 flex-1 px-6 pt-0 pb-4">
<EventActionButtons {registrationLink} {paymentLink} {addToCalendar} /> <EventActionButtons {registrationLink} {paymentLink} {addToCalendar} />
</div> </div>
{/if} {/if}
<div class="p-4 lg:hidden"> <div class="p-4 lg:hidden">
<p class="text-sm text-ecsess-400">Click to view more</p> <p class="text-ecsess-400 text-sm">Click to view more</p>
</div> </div>
</div> </div>
<!-- Back Side --> <!-- Back Side -->
<div <div
class="col-start-1 row-start-1 flex h-full w-full flex-col rounded-2xl bg-ecsess-950 transition-opacity duration-500 backface-hidden transform-3d transform-[rotateY(180deg)] cursor-pointer {showDescription class="bg-ecsess-950 col-start-1 row-start-1 flex h-full w-full transform-[rotateY(180deg)] cursor-pointer flex-col rounded-2xl transition-opacity duration-500 backface-hidden transform-3d {showDescription
? 'opacity-100' ? 'opacity-100'
: 'pointer-events-none opacity-0'}" : 'pointer-events-none opacity-0'}"
data-flip-side="back" data-flip-side="back"

6
src/routes/council/+page.server.ts
View File

@@ -19,7 +19,11 @@ const councilQuery = `{
}`; }`;
export const load = async ({ url }) => { export const load = async ({ url }) => {
const { members, councilGoofyPic }: { members: CouncilMember[], councilGoofyPic: { url: string } } = await getFromCMS(councilQuery); const {
members,
councilGoofyPic
}: { members: CouncilMember[]; councilGoofyPic: { url: string } } =
await getFromCMS(councilQuery);
return { return {
members: members, members: members,

6
vite.config.js
View File

@@ -7,11 +7,7 @@ export default defineConfig({
// Optimize dependency pre-bundling // Optimize dependency pre-bundling
optimizeDeps: { optimizeDeps: {
include: [ include: ['@portabletext/svelte', '@lucide/svelte', '@sanity/client'],
'@portabletext/svelte',
'@lucide/svelte',
'@sanity/client'
],
// Force pre-bundle these dependencies // Force pre-bundle these dependencies
force: false force: false
}, },