From 29d6bc484bbd34f7e69e532a669c15b56986d714 Mon Sep 17 00:00:00 2001
From: Jon Andre Briones <jonbrsoftware@gmail.com>
Date: Fri, 12 Dec 2025 17:06:14 -0800
Subject: [PATCH 1/6] wip(routes): updated routes to events archive and
 elections

---
 src/app/app.routes.ts | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 9412a8f..a15a48b 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -66,7 +66,7 @@ export const routes: Routes = [
     }
   },
   {
-    path: 'event-archives',
+    path: 'events/archive',
     loadComponent: () =>
       import('pages/event-archives/event-archives.component').then(m => m.EventArchivesComponent),
     title: makeTitle('Event Archives'),
@@ -84,6 +84,24 @@ export const routes: Routes = [
       description: 'Learn about the responsibilities of our executives and how you can become one.'
     }
   },
+  {
+    path: 'elections/upcoming',
+    loadComponent: () =>
+      import('./pages/elections/elections.component').then(m => m.ElectionsComponent),
+    title: makeTitle('Elections'),
+    data: {
+      description: 'Learn about the responsibilities of our executives and how you can become one.'
+    }
+  },
+  {
+    path: 'elections/speeches',
+    loadComponent: () =>
+      import('./pages/elections/elections.component').then(m => m.ElectionsComponent),
+    title: makeTitle('Elections'),
+    data: {
+      description: 'Learn about the responsibilities of our executives and how you can become one.'
+    }
+  },
   { path: '', component: HomeComponent, title: 'Computing Science Student Society' },
   // 404 will go down there
   {

From 7e723c15341172bdd3a60e282ef622a86b072a32 Mon Sep 17 00:00:00 2001
From: Jon Andre Briones <jonbrsoftware@gmail.com>
Date: Fri, 12 Dec 2025 17:52:35 -0800
Subject: [PATCH 2/6] wip(elections): route updates to elections and events
 archives

* updated the route to Events Archives from 'event-archive' to
  'events/archives'
* enabled the 'upcoming' and 'speeches' navbar entries
---
 src/app/app.routes.ts                         | 15 ++++++-
 .../components/nav-bar/nav-bar.component.html |  3 +-
 src/app/components/nav-bar/nav-entries.ts     | 28 ++++++------
 src/app/services/application/applications.ts  | 44 ++++++++++++++-----
 4 files changed, 62 insertions(+), 28 deletions(-)

diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index a15a48b..244cafa 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -1,6 +1,19 @@
 import { Routes } from '@angular/router';
 import { HomeComponent } from 'pages/home/home.component';
 
+export enum SiteRoute {
+  ReadMe = '/readme',
+  Officers = '/officers',
+  Committees = '/committees',
+  Affiliates = '/affiliates',
+  CommonRoom = '/common-room',
+  Events = '/events',
+  EventsArchives = '/events/archives',
+  Elections = '/elections',
+  ElectionsUpcoming = '/elections/upcoming',
+  ElectionsSpeeches = '/elections/speeches'
+}
+
 /**
  * Formats the title on the web browser's tab/window.
  * @param pageTitle - Title of the page
@@ -66,7 +79,7 @@ export const routes: Routes = [
     }
   },
   {
-    path: 'events/archive',
+    path: 'events/archives',
     loadComponent: () =>
       import('pages/event-archives/event-archives.component').then(m => m.EventArchivesComponent),
     title: makeTitle('Event Archives'),
diff --git a/src/app/components/nav-bar/nav-bar.component.html b/src/app/components/nav-bar/nav-bar.component.html
index dcda267..0ef4451 100644
--- a/src/app/components/nav-bar/nav-bar.component.html
+++ b/src/app/components/nav-bar/nav-bar.component.html
@@ -37,17 +37,18 @@ <h1 class="navbar__heading">SFU CSSS</h1>
                 [routerLinkActiveOptions]="{ exact: true }"
               >
                 @if (subItem.route) {
+                  <!-- For routes on the site -->
                   <a
                     class="nav-entry"
                     (click)="navigate(subItem)"
                     [routerLink]="subItem.route"
                     [class.clickable]="!subItem.isDisabled"
-                    routerLinkActive="active"
                   >
                     <fa-icon class="nav-entry__icon" [icon]="subItem.icon" [fixedWidth]="true" />
                     <span>{{ subItem.label }}</span>
                   </a>
                 } @else {
+                  <!-- For external links -->
                   <a class="nav-entry clickable" [href]="subItem.href" target="_blank">
                     <fa-icon class="nav-entry__icon" [icon]="subItem.icon" [fixedWidth]="true" />
                     <span>{{ subItem.label }}</span>
diff --git a/src/app/components/nav-bar/nav-entries.ts b/src/app/components/nav-bar/nav-entries.ts
index ae93027..b0933aa 100644
--- a/src/app/components/nav-bar/nav-entries.ts
+++ b/src/app/components/nav-bar/nav-entries.ts
@@ -4,9 +4,9 @@ import {
   faBook,
   faChevronRight,
   faFile,
-  faRoadBarrier,
   faUpRightFromSquare
 } from '@fortawesome/free-solid-svg-icons';
+import { SiteRoute } from 'app/app.routes';
 import { EXTERNAL_LINKS } from 'components/url/links.data';
 
 export interface NavItem extends CodeListItem<NavItem> {
@@ -27,31 +27,31 @@ export const NAVBAR_ENTRIES: NavItem[] = [
         key: 'readme',
         label: 'README',
         icon: faFile,
-        route: '/readme'
+        route: SiteRoute.ReadMe
       },
       {
         key: 'officers',
         label: 'Officers',
         icon: faFile,
-        route: '/officers'
+        route: SiteRoute.Officers
       },
       {
         key: 'committees',
         label: 'Committees',
         icon: faFile,
-        route: '/committees'
+        route: SiteRoute.Committees
       },
       {
         key: 'common-room',
         label: 'Common Room',
         icon: faFile,
-        route: '/common-room'
+        route: SiteRoute.CommonRoom
       },
       {
         key: 'affiliates',
         label: 'Affiliates',
         icon: faFile,
-        route: '/affiliates'
+        route: SiteRoute.Affiliates
       }
     ]
   },
@@ -65,7 +65,7 @@ export const NAVBAR_ENTRIES: NavItem[] = [
         key: 'events.about',
         label: 'About',
         icon: faFile,
-        route: '/events'
+        route: SiteRoute.Events
       },
       {
         key: 'events.tech-fair',
@@ -95,7 +95,7 @@ export const NAVBAR_ENTRIES: NavItem[] = [
         key: 'events.archives',
         label: 'Archives',
         icon: faBook,
-        route: '/event-archives'
+        route: SiteRoute.EventsArchives
       }
     ]
   },
@@ -109,21 +109,19 @@ export const NAVBAR_ENTRIES: NavItem[] = [
         key: 'elections.about',
         label: 'About',
         icon: faFile,
-        route: '/elections'
+        route: SiteRoute.Elections
       },
       {
         key: 'elections.upcoming',
         label: 'Upcoming',
-        icon: faRoadBarrier,
-        route: '/upcoming-elections',
-        isDisabled: true
+        icon: faFile,
+        route: SiteRoute.ElectionsUpcoming
       },
       {
         key: 'elections.speeches',
         label: 'Speeches',
-        icon: faRoadBarrier,
-        route: '/speeches',
-        isDisabled: true
+        icon: faFile,
+        route: SiteRoute.ElectionsSpeeches
       }
     ]
   },
diff --git a/src/app/services/application/applications.ts b/src/app/services/application/applications.ts
index ece7f86..5ed50a9 100644
--- a/src/app/services/application/applications.ts
+++ b/src/app/services/application/applications.ts
@@ -1,3 +1,5 @@
+import { SiteRoute } from 'app/app.routes';
+
 /**
  * Interface representing an Application that is registered to run.
  * Each application will be run in an activity.
@@ -23,14 +25,14 @@ export interface AppInfo {
   /**
    * The key of the application.
    * This should be unique to each activity.
-   * Routes should be in the form `/<activity>/<application>` or `/<application>` to successfully launch apps.
    */
   key: string;
 
   /**
    * Route to access the application.
+   * Routes should be in the form `/<activity>/<application>` or `/<application>` to successfully launch apps.
    */
-  route: string;
+  route: SiteRoute;
 }
 
 /**
@@ -44,7 +46,7 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
       label: 'README',
       activityKey: '',
       key: 'readme',
-      route: '/readme'
+      route: SiteRoute.ReadMe
     }
   ],
   [
@@ -54,7 +56,7 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
       label: 'Officers',
       activityKey: '',
       key: 'officers',
-      route: '/officers'
+      route: SiteRoute.Officers
     }
   ],
   [
@@ -64,7 +66,7 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
       label: 'Committees',
       activityKey: '',
       key: 'committees',
-      route: '/committees'
+      route: SiteRoute.Committees
     }
   ],
   [
@@ -74,7 +76,7 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
       label: 'Affiliates',
       activityKey: '',
       key: 'affiliates',
-      route: '/affiliates'
+      route: SiteRoute.Affiliates
     }
   ],
   [
@@ -84,7 +86,7 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
       label: 'Common Room',
       activityKey: '',
       key: 'common-room',
-      route: '/common-room'
+      route: SiteRoute.CommonRoom
     }
   ],
   [
@@ -94,17 +96,17 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
       label: 'Events',
       activityKey: '',
       key: 'events',
-      route: '/events'
+      route: SiteRoute.Events
     }
   ],
   [
     6,
     {
       id: 6,
-      label: 'Event Archives',
+      label: 'Events Archives',
       activityKey: '',
       key: 'event-archives',
-      route: '/event-archives'
+      route: SiteRoute.EventsArchives
     }
   ],
   [
@@ -114,7 +116,27 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
       label: 'Elections',
       activityKey: '',
       key: 'elections',
-      route: '/elections'
+      route: SiteRoute.Elections
+    }
+  ],
+  [
+    8,
+    {
+      id: 8,
+      label: 'Upcoming',
+      activityKey: '',
+      key: 'elections-upcoming',
+      route: SiteRoute.ElectionsUpcoming
+    }
+  ],
+  [
+    9,
+    {
+      id: 9,
+      label: 'Speeches',
+      activityKey: '',
+      key: 'elections-speeches',
+      route: SiteRoute.ElectionsSpeeches
     }
   ]
 ]);

From a4523ba27d775334d8159c852ba1dfb6a5e9db1c Mon Sep 17 00:00:00 2001
From: Jon Andre Briones <jonbrsoftware@gmail.com>
Date: Fri, 12 Dec 2025 18:16:38 -0800
Subject: [PATCH 3/6] wip(elections/upcoming): added the route and components

---
 src/app/app.routes.ts                         |  2 +-
 .../upcoming/upcoming.component.html          |  1 +
 .../upcoming/upcoming.component.scss          |  0
 .../upcoming/upcoming.component.spec.ts       | 23 +++++++++++++++++++
 .../elections/upcoming/upcoming.component.ts  | 12 ++++++++++
 5 files changed, 37 insertions(+), 1 deletion(-)
 create mode 100644 src/app/pages/elections/upcoming/upcoming.component.html
 create mode 100644 src/app/pages/elections/upcoming/upcoming.component.scss
 create mode 100644 src/app/pages/elections/upcoming/upcoming.component.spec.ts
 create mode 100644 src/app/pages/elections/upcoming/upcoming.component.ts

diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 244cafa..137d101 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -100,7 +100,7 @@ export const routes: Routes = [
   {
     path: 'elections/upcoming',
     loadComponent: () =>
-      import('./pages/elections/elections.component').then(m => m.ElectionsComponent),
+      import('./pages/elections/upcoming/upcoming.component').then(m => m.UpcomingComponent),
     title: makeTitle('Elections'),
     data: {
       description: 'Learn about the responsibilities of our executives and how you can become one.'
diff --git a/src/app/pages/elections/upcoming/upcoming.component.html b/src/app/pages/elections/upcoming/upcoming.component.html
new file mode 100644
index 0000000..9822571
--- /dev/null
+++ b/src/app/pages/elections/upcoming/upcoming.component.html
@@ -0,0 +1 @@
+<p>upcoming works!</p>
diff --git a/src/app/pages/elections/upcoming/upcoming.component.scss b/src/app/pages/elections/upcoming/upcoming.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/elections/upcoming/upcoming.component.spec.ts b/src/app/pages/elections/upcoming/upcoming.component.spec.ts
new file mode 100644
index 0000000..e5956e6
--- /dev/null
+++ b/src/app/pages/elections/upcoming/upcoming.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UpcomingComponent } from './upcoming.component';
+
+describe('UpcomingComponent', () => {
+  let component: UpcomingComponent;
+  let fixture: ComponentFixture<UpcomingComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [UpcomingComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(UpcomingComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/pages/elections/upcoming/upcoming.component.ts b/src/app/pages/elections/upcoming/upcoming.component.ts
new file mode 100644
index 0000000..ae06f6b
--- /dev/null
+++ b/src/app/pages/elections/upcoming/upcoming.component.ts
@@ -0,0 +1,12 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'cs-upcoming',
+  imports: [],
+  templateUrl: './upcoming.component.html',
+  styleUrl: './upcoming.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class UpcomingComponent {
+
+}

From 2e5ef74cb48b7a5bdbd7ad4c2982d05bafcd2cdb Mon Sep 17 00:00:00 2001
From: Jon Andre Briones <jonbrsoftware@gmail.com>
Date: Fri, 12 Dec 2025 18:56:06 -0800
Subject: [PATCH 4/6] refactor(elections): changed upcoming to schedule

---
 src/app/app.routes.ts                               |  8 +++++---
 src/app/components/nav-bar/nav-entries.ts           |  6 +++---
 .../upcoming/elections-schedule.component.html      | 13 +++++++++++++
 .../upcoming/elections-schedule.component.scss      |  9 +++++++++
 ...spec.ts => elections-schedule.component.spec.ts} | 10 +++++-----
 .../upcoming/elections-schedule.component.ts        | 12 ++++++++++++
 .../elections/upcoming/upcoming.component.html      |  1 -
 .../elections/upcoming/upcoming.component.scss      |  0
 .../pages/elections/upcoming/upcoming.component.ts  | 12 ------------
 src/app/services/application/applications.ts        |  2 +-
 10 files changed, 48 insertions(+), 25 deletions(-)
 create mode 100644 src/app/pages/elections/upcoming/elections-schedule.component.html
 create mode 100644 src/app/pages/elections/upcoming/elections-schedule.component.scss
 rename src/app/pages/elections/upcoming/{upcoming.component.spec.ts => elections-schedule.component.spec.ts} (55%)
 create mode 100644 src/app/pages/elections/upcoming/elections-schedule.component.ts
 delete mode 100644 src/app/pages/elections/upcoming/upcoming.component.html
 delete mode 100644 src/app/pages/elections/upcoming/upcoming.component.scss
 delete mode 100644 src/app/pages/elections/upcoming/upcoming.component.ts

diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 137d101..a28ef33 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -10,7 +10,7 @@ export enum SiteRoute {
   Events = '/events',
   EventsArchives = '/events/archives',
   Elections = '/elections',
-  ElectionsUpcoming = '/elections/upcoming',
+  ElectionsSchedule = '/elections/schedule',
   ElectionsSpeeches = '/elections/speeches'
 }
 
@@ -98,9 +98,11 @@ export const routes: Routes = [
     }
   },
   {
-    path: 'elections/upcoming',
+    path: 'elections/schedule',
     loadComponent: () =>
-      import('./pages/elections/upcoming/upcoming.component').then(m => m.UpcomingComponent),
+      import('pages/elections/upcoming/elections-schedule.component').then(
+        m => m.ElectionsScheduleComponent
+      ),
     title: makeTitle('Elections'),
     data: {
       description: 'Learn about the responsibilities of our executives and how you can become one.'
diff --git a/src/app/components/nav-bar/nav-entries.ts b/src/app/components/nav-bar/nav-entries.ts
index b0933aa..80be0d0 100644
--- a/src/app/components/nav-bar/nav-entries.ts
+++ b/src/app/components/nav-bar/nav-entries.ts
@@ -112,10 +112,10 @@ export const NAVBAR_ENTRIES: NavItem[] = [
         route: SiteRoute.Elections
       },
       {
-        key: 'elections.upcoming',
-        label: 'Upcoming',
+        key: 'elections.schedule',
+        label: 'Schedule',
         icon: faFile,
-        route: SiteRoute.ElectionsUpcoming
+        route: SiteRoute.ElectionsSchedule
       },
       {
         key: 'elections.speeches',
diff --git a/src/app/pages/elections/upcoming/elections-schedule.component.html b/src/app/pages/elections/upcoming/elections-schedule.component.html
new file mode 100644
index 0000000..562d5ac
--- /dev/null
+++ b/src/app/pages/elections/upcoming/elections-schedule.component.html
@@ -0,0 +1,13 @@
+<code-article>
+  <header>
+    <h1>Schedule</h1>
+    <p>Tune in here to see upcoming or past elections (Soon &trade;)</p>
+    <section>
+      <h2>Elections Schedule</h2>
+      <div class="post">
+        <h3 class="post__title">Director of Multi-Media</h3>
+        <p></p>
+      </div>
+    </section>
+  </header>
+</code-article>
diff --git a/src/app/pages/elections/upcoming/elections-schedule.component.scss b/src/app/pages/elections/upcoming/elections-schedule.component.scss
new file mode 100644
index 0000000..72bafa0
--- /dev/null
+++ b/src/app/pages/elections/upcoming/elections-schedule.component.scss
@@ -0,0 +1,9 @@
+.post {
+  border: 1px black solid;
+  padding: 0.5rem;
+  box-shadow: 10px 10px 5px black;
+
+  &__title {
+    margin: 0;
+  }
+}
diff --git a/src/app/pages/elections/upcoming/upcoming.component.spec.ts b/src/app/pages/elections/upcoming/elections-schedule.component.spec.ts
similarity index 55%
rename from src/app/pages/elections/upcoming/upcoming.component.spec.ts
rename to src/app/pages/elections/upcoming/elections-schedule.component.spec.ts
index e5956e6..35825e1 100644
--- a/src/app/pages/elections/upcoming/upcoming.component.spec.ts
+++ b/src/app/pages/elections/upcoming/elections-schedule.component.spec.ts
@@ -1,18 +1,18 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { UpcomingComponent } from './upcoming.component';
+import { ElectionsScheduleComponent } from './elections-schedule.component';
 
 describe('UpcomingComponent', () => {
-  let component: UpcomingComponent;
-  let fixture: ComponentFixture<UpcomingComponent>;
+  let component: ElectionsScheduleComponent;
+  let fixture: ComponentFixture<ElectionsScheduleComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [UpcomingComponent]
+      imports: [ElectionsScheduleComponent]
     })
     .compileComponents();
 
-    fixture = TestBed.createComponent(UpcomingComponent);
+    fixture = TestBed.createComponent(ElectionsScheduleComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });
diff --git a/src/app/pages/elections/upcoming/elections-schedule.component.ts b/src/app/pages/elections/upcoming/elections-schedule.component.ts
new file mode 100644
index 0000000..6e01fd8
--- /dev/null
+++ b/src/app/pages/elections/upcoming/elections-schedule.component.ts
@@ -0,0 +1,12 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { ArticleComponent } from '@csss-code/article/article.component';
+
+@Component({
+  selector: 'cs-upcoming',
+  imports: [ArticleComponent],
+  templateUrl: './elections-schedule.component.html',
+  styleUrl: './elections-schedule.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+// eslint-disable-next-line @typescript-eslint/no-extraneous-class
+export class ElectionsScheduleComponent {}
diff --git a/src/app/pages/elections/upcoming/upcoming.component.html b/src/app/pages/elections/upcoming/upcoming.component.html
deleted file mode 100644
index 9822571..0000000
--- a/src/app/pages/elections/upcoming/upcoming.component.html
+++ /dev/null
@@ -1 +0,0 @@
-<p>upcoming works!</p>
diff --git a/src/app/pages/elections/upcoming/upcoming.component.scss b/src/app/pages/elections/upcoming/upcoming.component.scss
deleted file mode 100644
index e69de29..0000000
diff --git a/src/app/pages/elections/upcoming/upcoming.component.ts b/src/app/pages/elections/upcoming/upcoming.component.ts
deleted file mode 100644
index ae06f6b..0000000
--- a/src/app/pages/elections/upcoming/upcoming.component.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { ChangeDetectionStrategy, Component } from '@angular/core';
-
-@Component({
-  selector: 'cs-upcoming',
-  imports: [],
-  templateUrl: './upcoming.component.html',
-  styleUrl: './upcoming.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class UpcomingComponent {
-
-}
diff --git a/src/app/services/application/applications.ts b/src/app/services/application/applications.ts
index 5ed50a9..9106c10 100644
--- a/src/app/services/application/applications.ts
+++ b/src/app/services/application/applications.ts
@@ -126,7 +126,7 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
       label: 'Upcoming',
       activityKey: '',
       key: 'elections-upcoming',
-      route: SiteRoute.ElectionsUpcoming
+      route: SiteRoute.ElectionsSchedule
     }
   ],
   [

From 5b4d9a694defe10b9c30ee7ea40ec5761e7e0283 Mon Sep 17 00:00:00 2001
From: Jon Andre Briones <jonbrsoftware@gmail.com>
Date: Fri, 12 Dec 2025 19:19:10 -0800
Subject: [PATCH 5/6] wip(elections/schedule): finished the styling

---
 .../elections-schedule.component.html         | 23 +++++++++++++++----
 .../elections-schedule.component.scss         |  5 ++++
 2 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/src/app/pages/elections/upcoming/elections-schedule.component.html b/src/app/pages/elections/upcoming/elections-schedule.component.html
index 562d5ac..7c684f6 100644
--- a/src/app/pages/elections/upcoming/elections-schedule.component.html
+++ b/src/app/pages/elections/upcoming/elections-schedule.component.html
@@ -1,12 +1,25 @@
 <code-article>
   <header>
-    <h1>Schedule</h1>
-    <p>Tune in here to see upcoming or past elections (Soon &trade;)</p>
+    <h1>Elections Schedule</h1>
+    <p>
+      Tune in here to see upcoming or past elections (Soon &trade;) <br />
+      <small>* each date shown has a deadline of 11:59PM PT, unless otherwise stated</small>
+    </p>
     <section>
-      <h2>Elections Schedule</h2>
+      <h2>Scheduled</h2>
       <div class="post">
-        <h3 class="post__title">Director of Multi-Media</h3>
-        <p></p>
+        <h2 class="post__title">Director of Multi-Media</h2>
+        <br />
+        <p><strong>Nominations End: </strong>December 7th, 2025</p>
+        <p><strong>Election Day: </strong>December 13th, 2025</p>
+        <h3 class="post__title">Duties</h3>
+        <ul class="post__list">
+          <li>
+            Create and procure media such as advertisements, promotional material, artwork,
+            photographs, etc., at the request of the Executive.
+          </li>
+          <li>Sit on committees as necessary, or upon request.</li>
+        </ul>
       </div>
     </section>
   </header>
diff --git a/src/app/pages/elections/upcoming/elections-schedule.component.scss b/src/app/pages/elections/upcoming/elections-schedule.component.scss
index 72bafa0..fec1421 100644
--- a/src/app/pages/elections/upcoming/elections-schedule.component.scss
+++ b/src/app/pages/elections/upcoming/elections-schedule.component.scss
@@ -6,4 +6,9 @@
   &__title {
     margin: 0;
   }
+
+  &__list {
+    list-style-position: inside;
+    list-style-type: circle;
+  }
 }

From 5dc29de16de16e3d3faa10b67a2aad7831502d0d Mon Sep 17 00:00:00 2001
From: Jon Andre Briones <jonbrsoftware@gmail.com>
Date: Fri, 12 Dec 2025 19:54:31 -0800
Subject: [PATCH 6/6] feat(speeches): added Director of Multi-Media speeches

---
 src/app/app.routes.ts                         |  8 ++--
 .../election-speeches.component.html          | 15 ++++++
 .../election-speeches.component.scss          | 22 +++++++++
 .../election-speeches.component.spec.ts       | 23 ++++++++++
 .../election-speeches.component.ts            | 46 +++++++++++++++++++
 .../elections-schedule.component.scss         |  2 +-
 .../upcoming/elections-schedule.component.ts  |  1 +
 7 files changed, 113 insertions(+), 4 deletions(-)
 create mode 100644 src/app/pages/elections/election-speeches/election-speeches.component.html
 create mode 100644 src/app/pages/elections/election-speeches/election-speeches.component.scss
 create mode 100644 src/app/pages/elections/election-speeches/election-speeches.component.spec.ts
 create mode 100644 src/app/pages/elections/election-speeches/election-speeches.component.ts

diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index a28ef33..dac2f32 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -105,16 +105,18 @@ export const routes: Routes = [
       ),
     title: makeTitle('Elections'),
     data: {
-      description: 'Learn about the responsibilities of our executives and how you can become one.'
+      description: 'View upcoming, current, and past elections.'
     }
   },
   {
     path: 'elections/speeches',
     loadComponent: () =>
-      import('./pages/elections/elections.component').then(m => m.ElectionsComponent),
+      import('./pages/elections/election-speeches/election-speeches.component').then(
+        m => m.ElectionSpeechesComponent
+      ),
     title: makeTitle('Elections'),
     data: {
-      description: 'Learn about the responsibilities of our executives and how you can become one.'
+      description: 'Learn more about the candidates who want to make our society a better place.'
     }
   },
   { path: '', component: HomeComponent, title: 'Computing Science Student Society' },
diff --git a/src/app/pages/elections/election-speeches/election-speeches.component.html b/src/app/pages/elections/election-speeches/election-speeches.component.html
new file mode 100644
index 0000000..95d8c9d
--- /dev/null
+++ b/src/app/pages/elections/election-speeches/election-speeches.component.html
@@ -0,0 +1,15 @@
+<code-article>
+  <header>
+    <h1>Nominees</h1>
+    <p>Learn more about our candidates and what they will do for our society.<br /></p>
+    <section class="nominees">
+      <h2>Director of Multi-Media</h2>
+      @for (nominee of nominees; track $index) {
+        <div class="nominee">
+          <h2 class="nominee__name">> {{ nominee.name }}</h2>
+          <p class="nominee__speech">{{ nominee.speech }}</p>
+        </div>
+      }
+    </section>
+  </header>
+</code-article>
diff --git a/src/app/pages/elections/election-speeches/election-speeches.component.scss b/src/app/pages/elections/election-speeches/election-speeches.component.scss
new file mode 100644
index 0000000..0c45809
--- /dev/null
+++ b/src/app/pages/elections/election-speeches/election-speeches.component.scss
@@ -0,0 +1,22 @@
+@use 'globals' as g;
+
+.nominees {
+  display: flex;
+  flex-direction: column;
+  gap: 2rem;
+}
+
+.nominee {
+  border: 1px black solid;
+  padding: 1rem;
+  box-shadow: 10px 10px 5px black;
+
+  &__name {
+    margin: 0;
+    color: g.$accent2;
+  }
+
+  &__speech {
+    white-space: pre-line;
+  }
+}
diff --git a/src/app/pages/elections/election-speeches/election-speeches.component.spec.ts b/src/app/pages/elections/election-speeches/election-speeches.component.spec.ts
new file mode 100644
index 0000000..534b56d
--- /dev/null
+++ b/src/app/pages/elections/election-speeches/election-speeches.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ElectionSpeechesComponent } from './election-speeches.component';
+
+describe('ElectionSpeechesComponent', () => {
+  let component: ElectionSpeechesComponent;
+  let fixture: ComponentFixture<ElectionSpeechesComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ElectionSpeechesComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(ElectionSpeechesComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/pages/elections/election-speeches/election-speeches.component.ts b/src/app/pages/elections/election-speeches/election-speeches.component.ts
new file mode 100644
index 0000000..28b67d0
--- /dev/null
+++ b/src/app/pages/elections/election-speeches/election-speeches.component.ts
@@ -0,0 +1,46 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { ArticleComponent } from '@csss-code/article/article.component';
+
+interface Nominee {
+  name: string;
+  speech: string;
+}
+
+@Component({
+  selector: 'cs-election-speeches',
+  imports: [ArticleComponent],
+  templateUrl: './election-speeches.component.html',
+  styleUrl: './election-speeches.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class ElectionSpeechesComponent {
+  // FIXME: This was hardcoded because Jon had to get this page up ASAP
+  nominees: Nominee[] = [
+    {
+      name: 'Sia Garg',
+      speech: `I’ve already been helping out with CSSS this term — I made two of our Instagram posts for past events, I’ve sat in on multiple meetings, and I’ve been happy to jump in whenever help was needed. Doing that has shown me how much work goes on behind the scenes, and it made me want to be even more involved.
+
+I’m running because I care about making our events look good, feel inviting, and reach more people. Good visuals and clear posts really do make a difference, and I want to help us be more consistent and creative with the way we present the CSSS.
+
+If I get this role, I’ll keep doing what I’ve been doing: showing up, helping out, and making content that they're happy to put out there. Thanks for considering me!`
+    },
+    {
+      name: 'Heather Nguyen',
+      speech: `Hello all! My name is Heather and I'm a 3rd year majoring in Interactive Arts and Technology. My interests lie in the creation of fun and exciting, colorful designs in everyday life tech products, hence my concentration of Visual, UX/UI and Product Design.
+
+In SIAT, we value the significance of creativity and innovation through our thoughtfully crafted designs. I think I similarly share these objectives with the CS student community, and I want to become part of our creation process for new ideas and projects. I have strong experience in creating posters/graphic assets or illustration from multiple design coordinator/director positions in the past, so I'm confident I would make a unique contribution to the community.
+
+To tell a little more about myself: I watch anime, am proficient in drawing cute girls and have a newfound passion for getting myself stuck in the mines (in Minecraft) :D`
+    },
+    {
+      name: 'Amelia Shen',
+      speech: `Hi, : D My name is Amelia Shen, and I am a second-year student in the SFU-ZJU DDP for Computing Science and Finance. I can create designs and drawings using tools such as Procreate, Figma, Canva, Affinity Design, and PixelStudio.
+
+I was a part of the Visual Design team for Try/CATCH 2025, a tech conference for high school girls and non-binary students by WiCS. I designed a sponsorship package, logos, merchandise (tote bags, mugs, and pens), as well as Instagram and LinkedIn posts using Figma, Procreate, and PixelStudio. I also help the Developers and Systems Club as an Assistant Director of Multimedia by designing Instagram posts for events such as the CMPT 125 Final Exam Review Session and the Recruiter Rewind.
+
+I have a lot of experience creating media for clubs, as I was the Marketing Director for three clubs in high school: a science demonstration club, the student press club, and the business club. I would manage the Instagram accounts by uploading designed posts for events, writing captions, and posting stories. As the Marketing Director of the science demo club, I would also use a camera to film and take pictures. For the student press club, I would work with editors and authors to make posts that introduced short stories, editorials, articles, etc. For the business club, I made posts for events like case competitions and infographics on business topics.
+
+In the past, I had a lot of fun designing posts for these clubs. My position as Marketing Director allowed me to take a break from schoolwork and spend time drawing and designing media. There was always a new theme to plan and work on. I could add my unique style and creativity to the CSSS Instagram. Drawing has also been a favourite hobby of mine since middle school.`
+    }
+  ];
+}
diff --git a/src/app/pages/elections/upcoming/elections-schedule.component.scss b/src/app/pages/elections/upcoming/elections-schedule.component.scss
index fec1421..78ecf25 100644
--- a/src/app/pages/elections/upcoming/elections-schedule.component.scss
+++ b/src/app/pages/elections/upcoming/elections-schedule.component.scss
@@ -1,6 +1,6 @@
 .post {
   border: 1px black solid;
-  padding: 0.5rem;
+  padding: 1rem;
   box-shadow: 10px 10px 5px black;
 
   &__title {
diff --git a/src/app/pages/elections/upcoming/elections-schedule.component.ts b/src/app/pages/elections/upcoming/elections-schedule.component.ts
index 6e01fd8..611ce46 100644
--- a/src/app/pages/elections/upcoming/elections-schedule.component.ts
+++ b/src/app/pages/elections/upcoming/elections-schedule.component.ts
@@ -8,5 +8,6 @@ import { ArticleComponent } from '@csss-code/article/article.component';
   styleUrl: './elections-schedule.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush
 })
+// FIXME: Make this dynamic
 // eslint-disable-next-line @typescript-eslint/no-extraneous-class
 export class ElectionsScheduleComponent {}