Skip to content

Commit e0c2e62

Browse files
jbriones1jbriones1
authored
Feature: Archive page (#188)
closes #182 Description: Added an Events Archive page that contains links to all the old event sites. Features: * Page contains links to the sites for Frosh, Fall Hacks, Tech Fair and Mountain Madness * Each button opens a new tab to the chosen site * Once the subdomain migration is complete, all the sites will be accessible and pointed to the proper subdomain
1 parent 424a722 commit e0c2e62

17 files changed

+306
-4
lines changed

‎public/static/icons/logos/fall-hacks-code_bg.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎src/app/app.routes.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,12 @@ export const routes: Routes = [
4747
loadComponent: () => import('./pages/events/events.component').then(m => m.EventsComponent),
4848
title: makeTitle('Events')
4949
},
50+
{
51+
path: 'event-archives',
52+
loadComponent: () =>
53+
import('pages/event-archives/event-archives.component').then(m => m.EventArchivesComponent),
54+
title: makeTitle('Event Archives')
55+
},
5056
// Elections
5157
{
5258
path: 'elections',

‎src/app/components/nav-bar/nav-entries.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { CodeListItem } from '@csss-code/list/list-item/list-item.component';
22
import { IconDefinition } from '@fortawesome/angular-fontawesome';
33
import {
4+
faBook,
45
faChevronRight,
56
faFile,
67
faRoadBarrier,
@@ -89,6 +90,12 @@ export const NAVBAR_ENTRIES: NavItem[] = [
8990
label: 'Mountain Madness',
9091
icon: faUpRightFromSquare,
9192
href: 'https://new.sfucsss.org/mountain_madness/2024/index.html'
93+
},
94+
{
95+
key: 'events.archives',
96+
label: 'Archives',
97+
icon: faBook,
98+
route: '/event-archives'
9299
}
93100
]
94101
},

‎src/app/pages/event-archives/event-archives.component.html‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<code-article>
2+
<hgroup>
3+
<h1>Event Archives</h1>
4+
<p>Here's a list of all the past pages the CSSS used to promote their events.</p>
5+
<p>
6+
<strong>
7+
Note: The links and the functionality of some of these pages were slightly altered, but
8+
please be cautious clicking links within these sites.
9+
</strong>
10+
</p>
11+
</hgroup>
12+
<section class="events">
13+
<section class="event">
14+
<section>
15+
<h2><span>Frosh</span></h2>
16+
<ul class="event__list">
17+
@for (year of froshYears; track year) {
18+
<li class="event__link">
19+
<a [href]="makeHref('frosh', year)" target="_blank">{{ year }}</a>
20+
</li>
21+
}
22+
</ul>
23+
</section>
24+
<section>
25+
<h2><span>Tech Fair</span></h2>
26+
<ul class="event__list">
27+
@for (year of techFairYears; track year) {
28+
<li class="event__link">
29+
<a [href]="makeHref('tech-fair', year)" target="_blank">{{ year }}</a>
30+
</li>
31+
}
32+
</ul>
33+
</section>
34+
<section>
35+
<h2><span>Fall Hacks</span></h2>
36+
<ul class="event__list">
37+
@for (year of fallHacksYears; track year) {
38+
<li class="event__link">
39+
<a [href]="makeHref('fall-hacks', year)" target="_blank">{{ year }}</a>
40+
</li>
41+
}
42+
</ul>
43+
</section>
44+
<section>
45+
<h2><span>Mountain Madness</span></h2>
46+
<ul class="event__list">
47+
@for (year of mountainMadnessYears; track year) {
48+
<li class="event__link">
49+
<a [href]="makeHref('madness', year)" target="_blank">{{ year }}</a>
50+
</li>
51+
}
52+
</ul>
53+
</section>
54+
</section>
55+
</section>
56+
</code-article>

‎src/app/pages/event-archives/event-archives.component.scss‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
@use 'globals';
2+
3+
h2 {
4+
display: flex;
5+
align-items: center;
6+
gap: 1rem;
7+
}
8+
9+
.events {
10+
display: grid;
11+
gap: 1rem;
12+
}
13+
14+
.event__list {
15+
display: grid;
16+
grid-template-columns: repeat(auto-fill, minmax(6rem, 1fr));
17+
gap: 1rem;
18+
}
19+
20+
.event__link {
21+
text-align: center;
22+
border: 1px black solid;
23+
border-radius: 5px;
24+
background-color: globals.$accent;
25+
26+
&:hover {
27+
background-color: globals.$accent1;
28+
}
29+
30+
> a {
31+
display: block;
32+
padding: 1rem;
33+
}
34+
}
35+
36+
@media (prefers-reduced-motion: no-preference) {
37+
.event__link {
38+
transition: background-color 0.5s ease;
39+
40+
&:active {
41+
transform: scale(0.95);
42+
}
43+
}
44+
}

‎src/app/pages/event-archives/event-archives.component.spec.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { EventArchivesComponent } from './event-archives.component';
4+
5+
describe('EventsArchiveComponent', () => {
6+
let component: EventArchivesComponent;
7+
let fixture: ComponentFixture<EventArchivesComponent>;
8+
9+
beforeEach(async () => {
10+
await TestBed.configureTestingModule({
11+
imports: [EventArchivesComponent]
12+
})
13+
.compileComponents();
14+
15+
fixture = TestBed.createComponent(EventArchivesComponent);
16+
component = fixture.componentInstance;
17+
fixture.detectChanges();
18+
});
19+
20+
it('should create', () => {
21+
expect(component).toBeTruthy();
22+
});
23+
});

‎src/app/pages/event-archives/event-archives.component.ts‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import { ChangeDetectionStrategy, Component } from '@angular/core';
2+
import { ArticleComponent } from '@csss-code/article/article.component';
3+
import {
4+
FALL_HACKS_YEARS,
5+
FROSH_YEARS,
6+
MOUNTAIN_MADNESS_YEARS,
7+
TECH_FAIR_YEARS
8+
} from './events-archive.data';
9+
10+
@Component({
11+
selector: 'cs-event-archives',
12+
imports: [ArticleComponent],
13+
templateUrl: './event-archives.component.html',
14+
styleUrl: './event-archives.component.scss',
15+
changeDetection: ChangeDetectionStrategy.OnPush
16+
})
17+
export class EventArchivesComponent {
18+
protected froshYears = FROSH_YEARS;
19+
protected fallHacksYears = FALL_HACKS_YEARS;
20+
protected techFairYears = TECH_FAIR_YEARS;
21+
protected mountainMadnessYears = MOUNTAIN_MADNESS_YEARS;
22+
23+
makeHref(event: string, year: number): string {
24+
return `https://${event}.sfucsss.org/${year}`;
25+
}
26+
}

‎src/app/pages/event-archives/events-archive.data.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export const FROSH_YEARS = [
2+
2024, 2023, 2022, 2021, 2020, 2019, 2018, 2017, 2016, 2015, 2014, 2013, 2012
3+
] as const;
4+
5+
export const FALL_HACKS_YEARS = [2024, 2020] as const;
6+
7+
export const TECH_FAIR_YEARS = [2024, 2023, 2022] as const;
8+
9+
export const MOUNTAIN_MADNESS_YEARS = [2024, 2023, 2022, 2021, 2020, 2019] as const;

‎src/app/services/application/applications.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,16 @@ export const routeApplicationMap: Map<number, AppInfo> = new Map([
101101
6,
102102
{
103103
id: 6,
104+
label: 'Event Archives',
105+
activityKey: '',
106+
key: 'event-archives',
107+
route: '/event-archives'
108+
}
109+
],
110+
[
111+
7,
112+
{
113+
id: 7,
104114
label: 'Elections',
105115
activityKey: '',
106116
key: 'elections',

‎src/assets/icons/README.md‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
For some reason the Angular FontAwesome package doesn't document what an `IconDefinition`'s type
2+
are, so I'm typing it out here. [ Angular FontAwesome Documentation ](https://github.com/FortAwesome/angular-fontawesome/blob/main/docs/guide/custom-icons.md)
3+
4+
```typescript
5+
export interface {
6+
prefix: string; // The package the icon resides in (just use `csss` if you're not sure)
7+
iconName: string; // The name of the icon to use when importing it
8+
icon: [
9+
number, // viewBox width
10+
number, // viewBox height
11+
string[], // litgatures (not used in Angular FontAwesome, so just pass in an empty array)
12+
string, // unicode (not used in Angular FontAwesome, so just pass in an empty string)
13+
string | string[] // paths of the SVG
14+
]
15+
}
16+
```

0 commit comments

Comments
 (0)