Quality of life update & package migrations. Use Vercel as default adapter (#67)
* 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:
43
package.json
43
package.json
@@ -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,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 */
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<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%
|
||||||
|
|||||||
@@ -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()}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<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">
|
||||||
|
|||||||
@@ -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
23
src/components/council/CouncilAvatar.svelte
Normal 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>
|
||||||
@@ -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>
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
@@ -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}
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -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
15
src/components/event/EventTabsTrigger.svelte
Normal 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>
|
||||||
@@ -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="
|
<!-- Question -->
|
||||||
flex cursor-pointer justify-between
|
<Accordion.ItemTrigger
|
||||||
py-4 ease-in-out"
|
class="flex w-full items-center gap-3 px-3 py-2 text-left text-lg font-bold"
|
||||||
panelClasses=" border-t-ecsess-300 border-t-2 bg-transparent p-4 bg-ecsess-400/50"
|
|
||||||
>
|
>
|
||||||
<!-- Control -->
|
|
||||||
{#snippet lead()}
|
|
||||||
{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>
|
||||||
|
|||||||
@@ -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"
|
||||||
|
|||||||
@@ -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
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
@@ -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]}
|
||||||
|
|||||||
@@ -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);
|
||||||
|
|||||||
@@ -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">
|
||||||
|
|||||||
@@ -15,4 +15,3 @@ const client = createClient({
|
|||||||
export async function getFromCMS(query: string) {
|
export async function getFromCMS(query: string) {
|
||||||
return await client.fetch(query);
|
return await client.fetch(query);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -77,5 +77,4 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</Section>
|
</Section>
|
||||||
|
|||||||
@@ -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
|
||||||
}`;
|
}`;
|
||||||
|
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
@@ -8,12 +8,12 @@
|
|||||||
|
|
||||||
<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}
|
||||||
|
|||||||
@@ -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 = {
|
||||||
|
|||||||
@@ -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'
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user