New homepage look

This commit is contained in:
Antoine Phan
2025-07-19 18:41:46 -04:00
parent 613a24c7a2
commit 2d79110182

View File

@@ -9,46 +9,59 @@
// Temporary progress bar. Update the value below! // Temporary progress bar. Update the value below!
import { Progress } from '@skeletonlabs/skeleton-svelte'; import { Progress } from '@skeletonlabs/skeleton-svelte';
let progress = 60; let progress = 63.33;
</script> </script>
<title> McGill ECSESS </title> <title> McGill ECSESS </title>
<!-- ECSESS Introduction --> <!-- ECSESS Introduction -->
<Section> <Section>
<div class="flex h-1/2 flex-col items-center justify-center text-center"> <div class="place-self-center-safe md:grid md:gap-6 lg:grid-cols-3">
<p class="page-title">What is ECSESS?</p> <div class="m-8 w-full place-self-center md:place-content-around lg:col-span-1">
<div id="test"> <div class="flex h-1/2 flex-col items-center justify-center text-center">
<PortableText value={data.description} /> <div class="animate-pulse">
</div> <p class="italic">
Development progress: {progress}%
</p>
<div id="progress" class="my-2 w-[80vw] border-2 lg:w-1/2">
<Progress value={progress} max={100} meterBg="bg-ecsess-200" height="h-4"></Progress>
</div>
</div>
<br /> <p class="page-title">What is ECSESS?</p>
<p class="italic"> <div class="p-4">
Current development progress: {progress}% <PortableText value={data.description} />
</p> </div>
<div id="progress" class="w-[80vw] lg:w-1/2 border-2"> </div>
<Progress value={progress} max={100} meterBg="bg-ecsess-200" height="h-4"></Progress> </div>
<div class="m-4 place-content-around lg:col-span-2 lg:mx-12 lg:my-0">
<img
src={data.councilPhoto}
alt="ECSESS Council"
class="ring-ecsess-600 shadow-ecsess-400 rounded-2xl shadow-md ring-4"
/>
</div> </div>
</div> </div>
</Section> </Section>
<!-- Picture, FAQ --> <!-- Picture, FAQ -->
<Section black>
<div class="md:grid md:grid-cols-3 md:gap-6">
<div class="col-span-2">
<h1>Our Student Council</h1>
<img src={data.councilPhoto} alt="ECSESS Council" />
</div>
<div class="col-span-1 place-self-center md:place-content-around m-6 w-full">
<h1>FAQ</h1>
<FaqAccordion entries={data.faqs} />
</div>
</div>
</Section>
<!-- Office Hours Calendar --> <!-- Office Hours Calendar -->
<Section> <Section black>
<div> <div class="w-full">
<h1 class="text-2xl">Office Hours</h1> <div class="">
<OhSchedule allOhs={data.allOHs}/> <h1 id="office-hours">Office Hours</h1>
<OhSchedule allOhs={data.allOHs} />
</div>
</div>
</Section>
<Section>
<div class="col-span-1">
<h1>FAQ</h1>
<FaqAccordion entries={data.faqs} />
</div>
<div id="sponsors">
<h1>Sponsors</h1>
{'<Insert companies & brands/>'}
</div> </div>
</Section> </Section>