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

Quality of life update & package migrations. Use Vercel as default adapter (#67)

Browse Source 
* Update all packages
* Manual migration to SkeletonUI v4.8.0. Event elements has breaking tabs underline highlight
* Remove unused dependencies & Let Prettier clean everything
* Minor misc styling update
This commit is contained in:
Antoine Phan
2025-12-19 22:21:00 -05:00
committed by GitHub
parent a7ce1b8683
commit 37666f9d0a
32 changed files with 755 additions and 472 deletions
Download Patch File Download Diff File Expand all files Collapse all files

839
bun.lock
View File

File diff suppressed because it is too large Load Diff

43
package.json
View File

@@ -12,31 +12,30 @@
"lint": "prettier --check ." "lint": "prettier --check ."
}, },
"devDependencies": { "devDependencies": {
"@portabletext/svelte": "^3.0.0", "@portabletext/svelte": "^3.0.1",
"@skeletonlabs/skeleton": "^3.2.0", "@skeletonlabs/skeleton": "^4.8.0",
"@skeletonlabs/skeleton-svelte": "^1.5.0", "@skeletonlabs/skeleton-svelte": "^4.8.0",
"@sveltejs/adapter-auto": "^6.1.0", "@sveltejs/adapter-vercel": "^6.2.0",
"@sveltejs/adapter-node": "^5.3.1", "@sveltejs/kit": "^2.49.2",
"@sveltejs/kit": "^2.36.0", "@sveltejs/vite-plugin-svelte": "^6.2.1",
"@sveltejs/vite-plugin-svelte": "^5.1.1", "@tailwindcss/typography": "^0.5.19",
"@tailwindcss/typography": "^0.5.16", "@tailwindcss/vite": "^4.1.18",
"@tailwindcss/vite": "^4.1.12", "@vercel/analytics": "^1.6.1",
"@vercel/analytics": "^1.5.0", "@vercel/speed-insights": "^1.3.1",
"@vercel/speed-insights": "^1.2.0", "prettier": "^3.7.4",
"prettier": "^3.6.2", "prettier-plugin-svelte": "^3.4.1",
"prettier-plugin-svelte": "^3.4.0", "prettier-plugin-tailwindcss": "^0.7.2",
"prettier-plugin-tailwindcss": "^0.6.14", "svelte": "^5.46.0",
"svelte": "^5.38.2", "svelte-check": "^4.3.4",
"svelte-check": "^4.3.1", "tailwindcss": "^4.1.18",
"tailwindcss": "^4.1.12", "typescript": "^5.9.3",
"typescript": "^5.9.2", "vite": "^7.2.7"
"vite": "^6.3.5"
}, },
"private": true, "private": true,
"type": "module", "type": "module",
"dependencies": { "dependencies": {
"@lucide/svelte": "^0.540.0", "@lucide/svelte": "^0.561.0",
"@sanity/client": "^7.9.0", "@sanity/client": "^7.13.2",
"vercel": "^46.0.2" "vercel": "^50.0.1"
} }
} }

1
src/app.css
View File

@@ -1,5 +1,6 @@
@import url('https://fonts.googleapis.com/css2?family=Saira:ital,wght@0,100..900;1,100..900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Saira:ital,wght@0,100..900;1,100..900&display=swap');
@import 'tailwindcss'; @import 'tailwindcss';
/* @import '@skeletonlabs/skeleton-svelte'; */
@theme { @theme {
/* Light shades - for backgrounds and cards */ /* Light shades - for backgrounds and cards */

14
src/app.d.ts vendored
View File

@@ -1,13 +1,13 @@
// See https://svelte.dev/docs/kit/types#app.d.ts // See https://svelte.dev/docs/kit/types#app.d.ts
// for information about these interfaces // for information about these interfaces
declare global { declare global {
namespace App { namespace App {
// interface Error {} // interface Error {}
// interface Locals {} // interface Locals {}
// interface PageData {} // interface PageData {}
// interface PageState {} // interface PageState {}
// interface Platform {} // interface Platform {}
} }
} }
export {}; export {};

20
src/app.html
View File

@@ -1,13 +1,13 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/ECSESS.png" /> <link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="color-scheme" /> <meta name="color-scheme" />
%sveltekit.head% %sveltekit.head%
</head> </head>
<body data-sveltekit-preload-data="hover"> <body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div> <div style="display: contents">%sveltekit.body%</div>
</body> </body>
</html> </html>

2
src/components/Button.svelte
View File

@@ -7,7 +7,7 @@
inline-block rounded-md border-none px-4 inline-block rounded-md border-none px-4
py-2 text-white transition-all py-2 text-white transition-all
duration-200 ease-out duration-200 ease-out
hover:shadow-xl hover:scale-105" hover:scale-105 hover:shadow-xl"
{onclick} {onclick}
> >
{@render children()} {@render children()}

4
src/components/Link.svelte
View File

@@ -1,7 +1,7 @@
<script> <script>
let { href = "https://www.example.com", children } = $props(); let { href = 'https://www.example.com', children } = $props();
</script> </script>
<a {href} target="_blank" rel="noopener noreferrer" class="underline"> <a {href} target="_blank" rel="noopener noreferrer" class="underline">
{@render children()} {@render children()}
</a> </a>

2
src/components/RichText.svelte
View File

@@ -1,5 +1,5 @@
<script> <script>
// NOTE: I think there could be a better way to do this // NOTE: I think there could be a better way to do this
import { PortableText } from '@portabletext/svelte'; import { PortableText } from '@portabletext/svelte';
let { value } = $props(); let { value } = $props();
</script> </script>

16
src/components/council/Avatar.svelte
View File

@@ -1,16 +0,0 @@
<script lang="ts">
// Reference: https://github.com/skeletonlabs/skeleton/blob/main/packages/skeleton-svelte/src/components/Avatar/Avatar.svelte
import { Avatar } from '@skeletonlabs/skeleton-svelte';
// Note: size, font, etc., are styled with TailwindCSS classes
let { name, size, src }: {name: string, size: string, src: string} = $props();
</script>
<Avatar
{name}
{src}
font={"text-xl text-ecsess-black"}
{size}
rounded={"rounded-full"}
background="bg-ecsess-400"
imageBase="object-cover w-full h-full"
/>

23
src/components/council/CouncilAvatar.svelte Normal file
View File

@@ -0,0 +1,23 @@
<script lang="ts">
// Reference: https://github.com/skeletonlabs/skeleton/tree/88844ffb67b7c9553c5245dd6d70146a3d6b8932/packages/skeleton-svelte/src/components/avatar
import { Avatar } from '@skeletonlabs/skeleton-svelte';
let { name, src }: { name: string; src: string } = $props();
function getInitials(name: string): string {
const words = name.trim().split(/\s+/);
return words
.slice(0, 5)
.map((word) => word.charAt(0).toUpperCase())
.join('');
}
</script>
<Avatar class="size-26 md:size-32">
<Avatar.Image {src} class="h-full w-full rounded-full object-cover" />
<Avatar.Fallback>
<div class="bg-ecsess-400 flex h-full w-full items-center justify-center rounded-full">
<span class="text-ecsess-black text-xl font-bold"> {getInitials(name)} </span>
</div>
</Avatar.Fallback>
</Avatar>

12
src/components/council/CouncilCard.svelte
View File

@@ -1,17 +1,17 @@
<script> <script>
let { onViewProfile, name, position, image } = $props(); let { onViewProfile, name, position, image } = $props();
import Button from 'components/Button.svelte'; import Button from 'components/Button.svelte';
import Avatar from 'components/council/Avatar.svelte'; import CouncilAvatar from 'components/council/CouncilAvatar.svelte';
</script> </script>
<div class="text-ecsess-100 flex max-w-md items-center gap-6 p-3"> <div class="text-ecsess-100 flex max-w-md items-center gap-6 p-3">
<!-- Profile picture --> <!-- Profile picture -->
<div> <div>
<Avatar {name} size={"size-26 md:size-32"} src={image}/> <CouncilAvatar {name} src={image} />
</div> </div>
<div class="text-left"> <div class="text-left">
<div class="text-xl md:text-2xl font-bold">{name}</div> <div class="text-xl font-bold md:text-2xl">{name}</div>
<div class="text-sm md:text-base text-ecsess-200 mb-2 italic">{position}</div> <div class="text-ecsess-200 mb-2 text-sm italic md:text-base">{position}</div>
<Button onclick={onViewProfile}>View Profile</Button> <Button onclick={onViewProfile}>View Profile</Button>
</div> </div>
</div> </div>

8
src/components/council/CouncilCardPopUp.svelte
View File

@@ -6,9 +6,9 @@
</script> </script>
<div <div
class="text-ecsess-800 m-4 flex h-[275px] max-w-[564px] class="text-ecsess-800 from-ecsess-50 to-ecsess-300 m-4 flex
items-center gap-3 rounded-md border-transparent bg-transparent h-70 max-w-142 items-center gap-3 rounded-md
bg-gradient-to-br from-ecsess-50 to-ecsess-300 p-6" border-transparent bg-transparent bg-linear-to-br p-6"
transition:slide transition:slide
> >
<!-- AVATAR --> <!-- AVATAR -->
@@ -24,7 +24,7 @@
<p class="text-2xl font-bold lg:text-3xl">{name}</p> <p class="text-2xl font-bold lg:text-3xl">{name}</p>
<p class="text-base italic">{position}</p> <p class="text-base italic">{position}</p>
</div> </div>
<hr class="hr border-ecsess-600 border-1 border-dashed" /> <hr class="hr border-ecsess-600 border border-dashed" />
<div class="my-2 text-left"> <div class="my-2 text-left">
<ul> <ul>
<li> <li>

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

@@ -95,7 +95,7 @@
<!-- Gradient overlay --> <!-- Gradient overlay -->
<div <div
class="absolute inset-0 bg-gradient-to-b from-transparent via-ecsess-800/30 to-ecsess-950" class="via-ecsess-800/30 to-ecsess-950 absolute inset-0 bg-gradient-to-b from-transparent"
></div> ></div>
<!-- Badges --> <!-- Badges -->
@@ -139,9 +139,7 @@
<div class="flex flex-1 flex-col p-6"> <div class="flex flex-1 flex-col p-6">
<!-- Description --> <!-- Description -->
{#if eventDescription} {#if eventDescription}
<div <div class="text-ecsess-100 mb-6 line-clamp-5">
class="text-ecsess-100 mb-6 line-clamp-5"
>
<RichText value={eventDescription} /> <RichText value={eventDescription} />
</div> </div>
{/if} {/if}

12
src/components/event/EventTabControl.svelte
View File

@@ -1,12 +0,0 @@
<script>
import { Tabs } from '@skeletonlabs/skeleton-svelte';
let { value, children } = $props();
</script>
<Tabs.Control
{value}
classes="hover:border-b-ecsess-200 border-b-4 transition-all ease-in-out pb-2 text-lg active:border-b-ecsess-500 px-2"
stateActive="border-b-ecsess-400"
>
{@render children()}
</Tabs.Control>

10
src/components/event/EventTabPanel.svelte → src/components/event/EventTabsContent.svelte
View File

@@ -54,11 +54,11 @@
const isPastEvent = (dateString: string): boolean => { const isPastEvent = (dateString: string): boolean => {
const eventDate = parseEventDate(dateString); const eventDate = parseEventDate(dateString);
// Add 1 day to the event date // Add 1 day to the event date
const now = new Date(); const now = new Date();
const eventDatePlusOneDay = new Date(eventDate.getTime() + 24 * 60 * 60 * 1000); const eventDatePlusOneDay = new Date(eventDate.getTime() + 24 * 60 * 60 * 1000);
return now > eventDatePlusOneDay; return now > eventDatePlusOneDay;
// return eventDate < now; // return eventDate < now;
}; };
@@ -77,7 +77,7 @@
); );
</script> </script>
<Tabs.Panel {value}> <Tabs.Content {value}>
<div class="space-y-12 px-4 py-8 lg:px-8"> <div class="space-y-12 px-4 py-8 lg:px-8">
<!-- Upcoming Events --> <!-- Upcoming Events -->
{#if upcomingEvents.length > 0} {#if upcomingEvents.length > 0}
@@ -139,4 +139,4 @@
</div> </div>
{/if} {/if}
</div> </div>
</Tabs.Panel> </Tabs.Content>

15
src/components/event/EventTabsTrigger.svelte Normal file
View File

@@ -0,0 +1,15 @@
<script>
import { Tabs } from '@skeletonlabs/skeleton-svelte';
let { value, children } = $props();
</script>
<Tabs.Trigger {value}>
{#snippet element(attributes)}
<button
{...attributes}
class="hover:border-b-ecsess-200 data-[state=active]:border-b-ecsess-400 border-b-4 border-b-transparent px-2 pb-2 text-lg transition-all ease-in-out"
>
{@render children()}
</button>
{/snippet}
</Tabs.Trigger>

78
src/components/homepage/FAQAccordion.svelte
View File

@@ -1,60 +1,54 @@
<script lang="ts"> <script lang="ts">
import type { FAQ } from '$lib/schemas'; import type { FAQ } from '$lib/schemas';
import { Accordion } from '@skeletonlabs/skeleton-svelte'; import { Accordion } from '@skeletonlabs/skeleton-svelte';
import { slide } from 'svelte/transition';
// Variable to be included into the component // Variable to be included into the component
let { entries }: { entries: FAQ[] } = $props(); let { entries }: { entries: FAQ[] } = $props();
</script> </script>
<Accordion multiple> <Accordion multiple class="space-y-3">
{#snippet iconClosed()}
<svg
width="20"
height="20"
fill="none"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
stroke="currentColor"
><path d="M9 5l7 7-7 7" />
</svg>
{/snippet}
{#snippet iconOpen()}
<svg
class="rotate-90"
width="20"
height="20"
fill="none"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
stroke="currentColor"
><path d="M9 5l7 7-7 7" />
</svg>
{/snippet}
{#each entries as entry, index} {#each entries as entry, index}
<Accordion.Item <Accordion.Item
value={index.toString()} value={index.toString()}
classes="border-ecsess-300 mb-4 rounded-md border-2 hover:bg-ecsess-500/30 transition-all" class="border-ecsess-300 hover:bg-ecsess-500/30 rounded-md border-2 transition-colors duration-200"
leadClasses="text-lg font-bold"
controlClasses="
flex cursor-pointer justify-between
py-4 ease-in-out"
panelClasses=" border-t-ecsess-300 border-t-2 bg-transparent p-4 bg-ecsess-400/50"
> >
<!-- Control --> <!-- Question -->
{#snippet lead()} <Accordion.ItemTrigger
class="flex w-full items-center gap-3 px-3 py-2 text-left text-lg font-bold"
>
{entry.question} {entry.question}
{/snippet} <Accordion.ItemIndicator class="group ml-auto">
<svg
{#snippet control()}{/snippet} class="size-5 shrink-0 transition-transform duration-200 group-data-[state=open]:rotate-90"
width="20"
height="20"
fill="none"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
stroke="currentColor"
><path d="M9 5l7 7-7 7" />
</svg>
</Accordion.ItemIndicator>
</Accordion.ItemTrigger>
<!-- Panel --> <!-- Panel -->
{#snippet panel()}{entry.answer}{/snippet} <Accordion.ItemContent class="border-t-ecsess-300 bg-ecsess-400/50 h-fit overflow-hidden">
{#snippet element(attributes)}
{#if !attributes.hidden}
<div
{...attributes}
class="border-t-ecsess-300 overflow-hidden border-t-2 px-4 py-3
text-base leading-relaxed transition-all duration-200"
transition:slide={{ duration: 200 }}
>
{entry.answer}
</div>
{/if}
{/snippet}
</Accordion.ItemContent>
</Accordion.Item> </Accordion.Item>
{/each} {/each}
</Accordion> </Accordion>

6
src/components/layout/Footer.svelte
View File

@@ -42,14 +42,12 @@
<div class="mb-6 grid grid-cols-1 gap-6 md:grid-cols-3"> <div class="mb-6 grid grid-cols-1 gap-6 md:grid-cols-3">
<!-- Left: ECSESS Lounge --> <!-- Left: ECSESS Lounge -->
<div class="border-ecsess-800 border-b-1 pb-4 text-center md:border-0 md:text-left"> <div class="border-ecsess-800 border-b-1 pb-4 text-center md:border-0 md:text-left">
<p class="text-ecsess-300 mb-3 text-lg"> <p class="text-ecsess-300 mb-3 text-lg">Visit the ECSESS lounge!</p>
Visit the ECSESS lounge!
</p>
<a <a
href="https://maps.app.goo.gl/m9ZqjTrPM7pcBzhbA" href="https://maps.app.goo.gl/m9ZqjTrPM7pcBzhbA"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
class="text-ecsess-300 hover:text-ecsess-100 border-b-1 border-b-transparent hover:border-b-ecsess-100 inline-flex items-center gap-2 justify-baseline transition-all pb-0.5" class="text-ecsess-300 hover:text-ecsess-100 hover:border-b-ecsess-100 inline-flex items-center justify-baseline gap-2 border-b-1 border-b-transparent pb-0.5 transition-all"
> >
<svg <svg
class="h-4 w-4 flex-shrink-0" class="h-4 w-4 flex-shrink-0"

2
src/components/layout/NavButton.svelte
View File

@@ -7,7 +7,7 @@
const isActive = $derived(page.url.pathname === href); const isActive = $derived(page.url.pathname === href);
</script> </script>
<a {href} class="w-auto mx-1"> <a {href} class="mx-1 w-auto">
<button <button
class="hover:text-ecsess-100 hover:border-ecsess-100 text-ecsess-200 text-shadow-xl active:border-ecsess-500 class="hover:text-ecsess-100 hover:border-ecsess-100 text-ecsess-200 text-shadow-xl active:border-ecsess-500
active:text-ecsess-500 mx-0.5 w-full rounded-none border-b-4 px-6 py-2 active:text-ecsess-500 mx-0.5 w-full rounded-none border-b-4 px-6 py-2

3
src/components/layout/SeoMetaTags.svelte
View File

@@ -5,7 +5,8 @@
canonical = 'https://ecsess.mcgilleus.ca' canonical = 'https://ecsess.mcgilleus.ca'
} = $props(); } = $props();
let thumbnail = "https://cdn.sanity.io/images/vmtsvpe2/production/5d68504038cc692805dc5e51af83adedfefde442-5304x3443.jpg?h=628&fm=webp"; let thumbnail =
'https://cdn.sanity.io/images/vmtsvpe2/production/5d68504038cc692805dc5e51af83adedfefde442-5304x3443.jpg?h=628&fm=webp';
</script> </script>
<svelte:head> <svelte:head>

2
src/components/officehour/OHBlock.svelte
View File

@@ -9,7 +9,7 @@
</script> </script>
<div <div
class="bg-ecsess-100 text-ecsess-900 grid h-full place-content-center rounded-md text-center hover:bg-ecsess-200 border-ecsess-300 border shadow-md transition-all hover:shadow-lg" class="bg-ecsess-100 text-ecsess-900 hover:bg-ecsess-200 border-ecsess-300 grid h-full place-content-center rounded-md border text-center shadow-md transition-all hover:shadow-lg"
> >
<p class="text-base font-extrabold lg:text-lg"> <p class="text-base font-extrabold lg:text-lg">
{officeHour.member.name.split(' ')[0]} {officeHour.member.name.split(' ')[0]}

6
src/components/officehour/OHSchedule.svelte
View File

@@ -11,7 +11,7 @@
const DEFAULT_START_TIME = 10 * 60; // 10 AM in minutes const DEFAULT_START_TIME = 10 * 60; // 10 AM in minutes
const DEFAULT_END_TIME = 17 * 60; // 5 PM in minutes const DEFAULT_END_TIME = 17 * 60; // 5 PM in minutes
type Segment = { type SegmentedControl = {
startSlot: number; startSlot: number;
endSlot: number; endSlot: number;
ohs: OfficeHour[]; ohs: OfficeHour[];
@@ -86,8 +86,8 @@
}); });
// Create continuous segments for a day // Create continuous segments for a day
const getSegmentsForDay = (day: string): Segment[] => { const getSegmentsForDay = (day: string): SegmentedControl[] => {
const segments: Segment[] = []; const segments: SegmentedControl[] = [];
for (const currentSlot of timeSlots) { for (const currentSlot of timeSlots) {
const activeOHs = getActiveOHs(day, currentSlot); const activeOHs = getActiveOHs(day, currentSlot);

10
src/components/resource/ResourceCard.svelte
View File

@@ -1,10 +1,16 @@
<script> <script>
import { CircleArrowRight } from '@lucide/svelte'; import { CircleArrowRight } from '@lucide/svelte';
import Link from 'components/Link.svelte'; import Link from 'components/Link.svelte';
let { title = '_Resource Title_', description = "Lorem ipsum", link = 'https://example.com' } = $props(); let {
title = '_Resource Title_',
description = 'Lorem ipsum',
link = 'https://example.com'
} = $props();
</script> </script>
<div class="bg-ecsess-50 relative h-fit max-w-xl min-w-12 rounded-md px-4 py-2 md:py-0 hover:shadow-md transition-shadow border border-ecsess-100"> <div
class="bg-ecsess-50 border-ecsess-100 relative h-fit max-w-xl min-w-12 rounded-md border px-4 py-2 transition-shadow hover:shadow-md md:py-0"
>
<div class="grid grid-cols-1 md:grid-cols-[7fr_1fr]"> <div class="grid grid-cols-1 md:grid-cols-[7fr_1fr]">
<div class="flex flex-col items-start p-4"> <div class="flex flex-col items-start p-4">
<p class="text-ecsess-900 my-1 pb-1 text-left text-xl font-extrabold"> <p class="text-ecsess-900 my-1 pb-1 text-left text-xl font-extrabold">

11
src/lib/utils.ts
View File

@@ -2,10 +2,10 @@ import { createClient } from '@sanity/client';
import { SANITY_ID } from '$env/static/private'; import { SANITY_ID } from '$env/static/private';
const client = createClient({ const client = createClient({
projectId: SANITY_ID, projectId: SANITY_ID,
dataset: 'production', dataset: 'production',
useCdn: true, useCdn: true,
apiVersion: '2025-02-06' apiVersion: '2025-02-06'
}); });
/** /**
@@ -13,6 +13,5 @@ const client = createClient({
* @param {String} query the GROQ query from Sanity CMS * @param {String} query the GROQ query from Sanity CMS
*/ */
export async function getFromCMS(query: string) { export async function getFromCMS(query: string) {
return await client.fetch(query); return await client.fetch(query);
} }

1
src/routes/+page.svelte
View File

@@ -77,5 +77,4 @@
</div> </div>
</div> </div>
</div> </div>
</Section> </Section>

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

@@ -9,7 +9,7 @@ const councilQuery = `*[_type == "members"]{
email, email,
position, position,
positionDescription, positionDescription,
"image": image.asset->url+"?h=200&fm=webp", "image": image.asset->url+"?h=300&fm=webp",
yearProgram yearProgram
}`; }`;

37
src/routes/events/+page.svelte
View File

@@ -3,8 +3,8 @@
import { Tabs } from '@skeletonlabs/skeleton-svelte'; import { Tabs } from '@skeletonlabs/skeleton-svelte';
import Section from 'components/layout/Section.svelte'; import Section from 'components/layout/Section.svelte';
import SeoMetaTags from 'components/layout/SeoMetaTags.svelte'; import SeoMetaTags from 'components/layout/SeoMetaTags.svelte';
import EventTabControl from 'components/event/EventTabControl.svelte'; import EventTabsTrigger from 'components/event/EventTabsTrigger.svelte';
import EventTabPanel from 'components/event/EventTabPanel.svelte'; import EventTabsContent from 'components/event/EventTabsContent.svelte';
let { data } = $props(); let { data } = $props();
@@ -20,25 +20,20 @@
<Section from="from-ecsess-black" to="to-ecsess-black" via="via-ecsess-600" direction="to-b"> <Section from="from-ecsess-black" to="to-ecsess-black" via="via-ecsess-600" direction="to-b">
<p class="page-title">Events</p> <p class="page-title">Events</p>
<Tabs
value={group}
onValueChange={(e) => (group = e.value)}
listClasses="flex-wrap place-content-center"
>
{#snippet list()}
<EventTabControl value="allEvents">All Events</EventTabControl>
<EventTabControl value="academic">Academic</EventTabControl>
<EventTabControl value="professional">Professional</EventTabControl>
<EventTabControl value="social">Social</EventTabControl>
<EventTabControl value="technical">Technical</EventTabControl>
{/snippet}
{#snippet content()} <Tabs value={group} onValueChange={(e) => (group = e.value)} composite={true}>
<EventTabPanel value="allEvents" category="allEvents" {events} /> <Tabs.List>
<EventTabPanel value="academic" category="academic" {events} /> <EventTabsTrigger value="allEvents">All Events</EventTabsTrigger>
<EventTabPanel value="professional" category="professional" {events} /> <EventTabsTrigger value="academic">Academic</EventTabsTrigger>
<EventTabPanel value="social" category="social" {events} /> <EventTabsTrigger value="professional">Professional</EventTabsTrigger>
<EventTabPanel value="technical" category="technical" {events} /> <EventTabsTrigger value="social">Social</EventTabsTrigger>
{/snippet} <EventTabsTrigger value="technical">Technical</EventTabsTrigger>
</Tabs.List>
<EventTabsContent value="allEvents" category="allEvents" {events} />
<EventTabsContent value="academic" category="academic" {events} />
<EventTabsContent value="professional" category="professional" {events} />
<EventTabsContent value="social" category="social" {events} />
<EventTabsContent value="technical" category="technical" {events} />
</Tabs> </Tabs>
</Section> </Section>

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

@@ -1,5 +1,5 @@
export const load = async ({ url }) => { export const load = async ({ url }) => {
return { return {
canonical: url.href canonical: url.href
}; };
}; };

14
src/routes/r/[shortname]/+page.svelte
View File

@@ -8,17 +8,17 @@
<Section from="from-ecsess-black" to="to-ecsess-black" via="via-ecsess-800" direction="to-b"> <Section from="from-ecsess-black" to="to-ecsess-black" via="via-ecsess-800" direction="to-b">
<p class="page-title">Can't redirect you to <code>"r/{data.shortname}"</code>!</p> <p class="page-title">Can't redirect you to <code>"r/{data.shortname}"</code>!</p>
<hr class="border-2 w-1/2"> <hr class="w-1/2 border-2" />
<div> <div>
Maybe you were trying to get to: Maybe you were trying to get to:
<ul> <ul>
{#each data.availableShortnames as redirect} {#each data.availableShortnames as redirect}
<li class="list-disc list-inside text-lg my-1"> <li class="my-1 list-inside list-disc text-lg">
{redirect.name} ~ {redirect.name} ~
<Link href={redirect.url}> <Link href={redirect.url}>
/r/{redirect.shortname} /r/{redirect.shortname}
</Link> </Link>
</li> </li>
{/each} {/each}
</ul> </ul>
</div> </div>

2
svelte.config.js
View File

@@ -1,4 +1,4 @@
import adapter from '@sveltejs/adapter-auto'; import adapter from '@sveltejs/adapter-vercel';
/** @type {import('@sveltejs/kit').Config} */ /** @type {import('@sveltejs/kit').Config} */
const config = { const config = {

12
vite.config.js
View File

@@ -21,22 +21,14 @@ export default defineConfig({
build: { build: {
target: 'esnext', target: 'esnext',
minify: 'esbuild', minify: 'esbuild',
cssMinify: true, cssMinify: true
}, },
// Server optimizations for dev // Server optimizations for dev
server: { server: {
fs: {
// Allow serving files from project root
strict: false
},
warmup: { warmup: {
// Pre-transform commonly used files // Pre-transform commonly used files
clientFiles: [ clientFiles: ['./src/routes/+layout.svelte']
'./src/routes/+layout.svelte',
'./src/routes/+page.svelte',
'./src/components/layout/*.svelte'
]
} }
}, },