From 757d2b65b644530f19b6ce57b1bb4e2686ab21b7 Mon Sep 17 00:00:00 2001
From: Zack Hoang <zackhoang2004@gmail.com>
Date: Wed, 25 Mar 2026 22:35:03 -0700
Subject: [PATCH 1/2] Add schedule for Vancouver

---
 package-lock.json             |  4 +++
 src/components/Schedule.astro | 51 ++++++++++++++++++++++++++++
 src/lib/cityContent.ts        | 62 +++++++++++++++++++++++++++++++++++
 src/pages/index.astro         |  2 ++
 4 files changed, 119 insertions(+)
 create mode 100644 src/components/Schedule.astro

diff --git a/package-lock.json b/package-lock.json
index 1bc6d3c..f6ec5d6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1656,6 +1656,7 @@
       "resolved": "https://registry.npmjs.org/astro/-/astro-5.15.9.tgz",
       "integrity": "sha512-XLDXxu0282cC/oYHswWZm3johGlRvk9rLRS7pWVWSne+HsZe9JgrpHI+vewAJSSNHBGd1aCyaQOElT5RNGe7IQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@astrojs/compiler": "^2.13.0",
         "@astrojs/internal-helpers": "0.7.5",
@@ -4046,6 +4047,7 @@
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.53.2.tgz",
       "integrity": "sha512-MHngMYwGJVi6Fmnk6ISmnk7JAHRNF0UkuucA0CUW3N3a4KnONPEZz+vUanQP/ZC/iY1Qkf3bwPWzyY84wEks1g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/estree": "1.0.8"
       },
@@ -4681,6 +4683,7 @@
       "resolved": "https://registry.npmjs.org/vite/-/vite-6.4.1.tgz",
       "integrity": "sha512-+Oxm7q9hDoLMyJOYfUYBuHQo+dkAloi33apOPP56pzj+vsdJDzr+j1NISE5pyaAuKL4A3UD34qd0lx5+kfKp2g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.25.0",
         "fdir": "^6.4.4",
@@ -4879,6 +4882,7 @@
       "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.76.tgz",
       "integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==",
       "license": "MIT",
+      "peer": true,
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }
diff --git a/src/components/Schedule.astro b/src/components/Schedule.astro
new file mode 100644
index 0000000..8fd3617
--- /dev/null
+++ b/src/components/Schedule.astro
@@ -0,0 +1,51 @@
+---
+// import type { CitySchedule } from "../lib/cityContent"
+
+// interface Props {
+//     props: CitySchedule[]
+// }
+
+// const { props } = Astro.props;
+import { cityContent } from "../lib/cityContent"
+---
+
+<section class="schedule">
+    <h2>Schedule</h2>
+    <div id="wrapper">
+        {cityContent.vancouver.schedule.map((event) => {
+            return <div class="item">
+                { event.endTime? <p class="time">{event.startTime} - {event.endTime}</p> : <p class="time">{event.startTime}</p>}
+                {event.activities.map((activity) => {
+                    return <ul class="activities">
+                        <li>{activity}</li>
+                    </ul>
+                })}
+            </div>
+        })}
+    </div>
+</section>
+
+<style>
+    .schedule {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+    }
+    #wrapper {
+        display: flex;
+        flex-direction: column;
+        gap: 1rem;
+    }
+    .item {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        text-align: center;
+    }
+    .time {
+        font-weight: bold;
+    }
+    .activities {
+        list-style-type: none;
+    }
+</style>
diff --git a/src/lib/cityContent.ts b/src/lib/cityContent.ts
index c86f0c8..4f46221 100644
--- a/src/lib/cityContent.ts
+++ b/src/lib/cityContent.ts
@@ -1,5 +1,11 @@
 export type City = 'vancouver' | 'toronto';
 
+export interface CitySchedule {
+	startTime: string;
+	endTime?: string;
+	activities: string[]
+}
+
 export interface CityContent {
 	name: string;
 	displayName: string;
@@ -8,6 +14,7 @@ export interface CityContent {
 	description: string;
 	venue?: string;
 	date?: string;
+	schedule?: CitySchedule[]
 }
 
 export const cityContent: Record<City, CityContent> = {
@@ -19,6 +26,61 @@ export const cityContent: Record<City, CityContent> = {
 		description: 'Connect with over 1,000 cloud professionals and decision-makers. Showcase your brand at this premier gathering of AWS, Azure, Google Cloud, and IBM Cloud experts.',
 		venue: 'Science World',
 		date: 'Friday, May 1st, 2026 • 2pm-9pm',
+		schedule: [
+		{
+			startTime: "3:00 PM",
+			activities: ["Doors Open"]
+		},
+		{
+			startTime: "3:00 PM",
+			activities: ["Community Experience sponsored by AWS opens"]
+		},
+		{
+			startTime: "3:20 PM",
+			endTime: "3:30 PM",
+			activities: ["Opening Welcome Remarks", "Community Stage, streamed to Main Stage"]
+		},
+		{
+			startTime: "3:30 PM",
+			endTime: "4:00 PM",
+			activities: ["Main Stage Session 1", " Community Stage Session 1"]
+		},
+		{
+			startTime: "4:00 PM",
+			endTime: "4:30 PM",
+			activities: ["Main Stage Session 2", "Community Stage Session 2"]
+		},
+		{
+			startTime: "4:30 PM",
+			endTime: "5:00 PM",
+			activities: ["Main Stage Session 3", "Community Stage HackerRivals Round 1"]
+		},
+		{
+			startTime: "5:00 PM",
+			endTime: "5:30 PM",
+			activities: ["Main Stage Session 4", "Community Stage Session 3"]
+		},
+		{
+			startTime: "5:30 PM",
+			endTime: "6:00 PM",
+			activities: ["Main Stage Session 5", "Community Stage HackerRivals Elimination Round"]
+		},
+		{
+			startTime: "6:00 PM",
+			endTime: "6:30 PM",
+			activities: ["Main Stage Session 6", "Community Stage Session 4"]
+		},
+		{
+			startTime: "6:30 PM",
+			endTime: "7:00 PM",
+			activities: ["HackerRivals Final", " Live on the Community Stage, streamed to the Main Stage"]
+		},
+		{
+			startTime: "7:00 PM",
+			endTime: "7:30 PM",
+			activities: ["HackerRivals Awards", "Closing Remarks", "Live on the Community Stage, streamed to the Main Stage"]
+		}
+		]
 	},
 	toronto: {
 		name: 'toronto',
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 9ea4cf3..dbef35c 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -15,6 +15,7 @@ import Footer from '../components/Footer.astro';
 import SeeYouThere from '../components/SeeYouThere.astro';
 import ScrollAnimations from '../components/ScrollAnimations.astro';
 import { heroContent, navigationContent, aboutCPCAContent, whatIsCloudSummitContent, cloudSummitActivitiesContent, eventHighlightsContent, tickerContent, pastSponsorsContent, newsletterContent, footerContent, defaultCity } from '../lib/content';
+import Schedule from '../components/Schedule.astro';
 
 // Use default city for SSR, will be updated client-side
 const content = heroContent[defaultCity];
@@ -39,6 +40,7 @@ const content = heroContent[defaultCity];
 		<WhatIsCloudSummit content={whatIsCloudSummitContent} />
 		<CloudSummitActivities content={cloudSummitActivitiesContent} />
 		<EventLocations />
+		<Schedule></Schedule>
 		<SummitSummary content={eventHighlightsContent} />
 		<HighlightReel content={eventHighlightsContent} />
 		<Ticker content={tickerContent} />

From 6422a8f229bf5957cc10b750e9d4d81c2b6d8ade Mon Sep 17 00:00:00 2001
From: Nichanun <nichanun.luck@gmail.com>
Date: Fri, 27 Mar 2026 00:08:01 -0700
Subject: [PATCH 2/2] adjust schedule section

---
 src/components/Schedule.astro | 135 ++++++++++++++++++++++++++++++----
 1 file changed, 122 insertions(+), 13 deletions(-)

diff --git a/src/components/Schedule.astro b/src/components/Schedule.astro
index 8fd3617..e48b543 100644
--- a/src/components/Schedule.astro
+++ b/src/components/Schedule.astro
@@ -10,42 +10,151 @@ import { cityContent } from "../lib/cityContent"
 ---
 
 <section class="schedule">
-    <h2>Schedule</h2>
+    <h2 class="section-heading">Schedule</h2>
     <div id="wrapper">
         {cityContent.vancouver.schedule.map((event) => {
             return <div class="item">
-                { event.endTime? <p class="time">{event.startTime} - {event.endTime}</p> : <p class="time">{event.startTime}</p>}
-                {event.activities.map((activity) => {
-                    return <ul class="activities">
-                        <li>{activity}</li>
-                    </ul>
-                })}
+                {event.endTime ? (
+                    <p class="time">{event.startTime} - {event.endTime}</p>
+                ) : (
+                    <p class="time">{event.startTime}</p>
+                )}
+                <div class="details">
+                    {event.activities.map((activity, idx) => (
+                        <p class:list={["activity", idx === 0 ? "activity-title" : "activity-meta"]}>
+                            {activity.trim()}
+                        </p>
+                    ))}
+                </div>
             </div>
         })}
     </div>
 </section>
 
+<script>
+    import { getCityStore } from '../lib/cityStore';
+    import type { City } from '../lib/content';
+
+    function syncScheduleVisibility(city: City) {
+        const el = document.querySelector('.schedule') as HTMLElement | null;
+        if (!el) return;
+        const show = city === 'vancouver';
+        el.classList.toggle('schedule--hidden', !show);
+        el.setAttribute('aria-hidden', show ? 'false' : 'true');
+    }
+
+    function initCityAwareSchedule() {
+        const cityStore = getCityStore();
+        cityStore.init();
+        syncScheduleVisibility(cityStore.getCity());
+        cityStore.subscribe(syncScheduleVisibility);
+    }
+
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', initCityAwareSchedule);
+    } else {
+        initCityAwareSchedule();
+    }
+</script>
+
 <style>
+    .schedule.schedule--hidden {
+        display: none !important;
+    }
+
     .schedule {
         display: flex;
         flex-direction: column;
         align-items: center;
+        padding: 4rem 1.5rem;
+        background: black;
+    }
+    .section-heading {
+        font-family: 'Squada One', system-ui, sans-serif;
+        font-size: 2.5rem;
+        text-align: center;
+        margin: 0 0 3rem 0;
+        color: rgb(255, 193, 77);
     }
     #wrapper {
+        width: 100%;
+        max-width: 1200px;
         display: flex;
         flex-direction: column;
-        gap: 1rem;
+        background: rgba(61, 120, 171, 0.08);
+        border: 1px solid rgba(61, 120, 171, 0.2);
+        border-radius: 1rem;
+        overflow: hidden;
     }
     .item {
         display: flex;
         flex-direction: column;
-        align-items: center;
-        text-align: center;
+        gap: 0.75rem;
+        padding: 0.9rem 0.9rem;
+        border-top: 1px solid rgba(255, 255, 255, 0.12);
     }
     .time {
-        font-weight: bold;
+        margin: 0;
+        color: rgba(255, 255, 255, 0.88);
+        font-size: 1rem;
+        line-height: 1.4;
+        white-space: nowrap;
+    }
+    .details {
+        display: flex;
+        flex-direction: column;
+        gap: 0.35rem;
+    }
+    .activity {
+        margin: 0;
+        color: white;
+        line-height: 1.3;
+    }
+    .activity-title {
+        font-size: 1.25rem;
+        font-weight: 600;
+        color: white;
+    }
+    .activity-meta {
+        font-size: 0.875rem;
+        color: white;
+        opacity: 0.7;
+    }
+    .activity-meta::before {
+        content: "◉";
+        display: inline-block;
+        margin-right: 0.35rem;
+        font-size: 0.75em;
+        vertical-align: middle;
+    }
+    @media (min-width: 769px) {
+        .schedule {
+            padding: 6rem 2rem;
+        }
+        .section-heading {
+            font-size: 4rem;
+        }
+        .item {
+            display: grid;
+            grid-template-columns: 220px 1fr;
+            align-items: start;
+            gap: 1.5rem;
+            padding: 1.2rem 1.2rem;
+        }
+        .time {
+            font-size: 1.125rem;
+            font-weight: 500;
+        }
+        .activity-title {
+            font-size: 1.25rem;
+        }
+        .activity-meta {
+            font-size: 0.875rem;
+        }
     }
-    .activities {
-        list-style-type: none;
+    @media (max-width: 768px) {
+        .activity-title {
+            font-size: 1.25rem;
+        }
     }
 </style>