Fix title inconsistencies (#229)

Closes #212.

Co-authored-by: Jared He <66887902+jaredjhe@users.noreply.github.com>
Reviewed-on: www/www-new#229
Reviewed-by: Aditya Thakral <a3thakra@csclub.uwaterloo.ca>
Co-authored-by: j285he <j285he@localhost>
Co-committed-by: j285he <j285he@localhost>

pages/events/[year]/[term]/index.module.css

@@ -3,9 +3,9 @@
   margin-bottom: calc(60rem / 16);
 }
 
-.main > h2 {
-  padding-bottom: 1rem;
-  border-bottom: 1px solid var(--primary-heading);
+.main > h1, .main > section > h1 {
+  padding-bottom: calc(16rem / 16);
+  border-bottom: calc(1rem / 16) solid var(--primary-heading);
 }
 
 .header {

pages/events/[year]/[term]/index.tsx

@@ -67,8 +67,8 @@ export default function Term(props: Props) {
         <Link href="/events/archive">Archive</Link>
       </div>
       {hasFutureEvents && (
-        <>
-          <h2>Upcoming Events</h2>
+        <section>
+          <h1>Upcoming Events</h1>
           <div className={styles.miniEventCards}>
             {props.futureEvents.map(({ content, metadata }) => (
               <EventCard
@@ -81,20 +81,34 @@ export default function Term(props: Props) {
               </EventCard>
             ))}
           </div>
-        </>
+        </section>
+      )}
+      {hasPastEvents && props.isCurrentTerm && (
+        <section>
+          <h1>Past Events</h1>
+          <div className={styles.miniEventCards}>
+            {props.pastEvents.map(({ content, metadata }) => (
+              <MiniEventCard
+                {...metadata}
+                date={new Date(metadata.date)}
+                description={<MDXRemote {...content} />}
+                key={metadata.name + metadata.date.toString()}
+              />
+            ))}
+          </div>
+        </section>
       )}
-      {hasPastEvents && props.isCurrentTerm && <h2>Past Events</h2>}
       {hasPastEvents && !props.isCurrentTerm && (
-        <h2>
+        <h1>
           Events Archive:
           <span className={styles.blue}>
             {` ${capitalize(props.term)} ${props.year}`}
           </span>
-        </h2>
+        </h1>
       )}
       {!hasFutureEvents && !hasPastEvents && (
         <>
-          <h2>Events</h2>
+          <h1>Events</h1>
           There are no upcoming or past events for the{" "}
           {`${capitalize(props.term)} ${props.year}`} term. Please check back
           later!

pages/events/[year]/index.module.css

@@ -2,9 +2,9 @@
   margin-top: calc(60rem / 16);
 }
 
-.main > h2 {
-  padding-bottom: calc(1rem / 16);
-  border-bottom: 1px solid var(--primary-heading);
+.main > h1 {
+  padding-bottom: calc(16rem / 16);
+  border-bottom: calc(1rem / 16) solid var(--primary-heading);
 }
 
 .blue {

pages/news/[year]/[term].module.css

@@ -2,6 +2,11 @@
   padding-bottom: calc(30rem / 16);
 }
 
+.page > h1 {
+  padding-bottom: calc(16rem / 16);
+  border-bottom: calc(1rem / 16) solid var(--primary-heading);
+}
+
 .term {
   color: var(--primary-accent);
 }