Make consistent with other pages

pages/events/[year]/index.tsx

@@ -1,51 +1,19 @@
+import { ParsedUrlQuery } from "querystring";
+
+import { GetStaticPaths, GetStaticProps } from "next";
 import React from "react";
 
-import { Link } from "../../../components/Link";
+import { Link } from "@/components/Link";
-import { getEventYears, getEventTermsByYear } from "../../../lib/events";
+import { getEventYears, getEventTermsByYear } from "@/lib/events";
 
 import styles from "./year.module.css";
 
-export async function getStaticPaths(): Promise<{
-  paths: {
-    params: {
-      year: string;
-    };
-  }[];
-  fallback: boolean;
-}> {
-  const years = await getEventYears();
-  const paths = years.map((curYear) => ({
-    params: { year: curYear },
-  }));
-  return {
-    paths: paths,
-    fallback: false,
-  };
-}
-
-interface Context {
-  params: {
-    year: string;
-  };
-}
-
 interface Props {
   year: string;
   terms: string[];
 }
 
-export async function getStaticProps(context: Context): Promise<{
+export default function Year(props: Props) {
-  props: Props;
-}> {
-  return {
-    props: {
-      year: context.params.year,
-      terms: await getEventTermsByYear(context.params.year),
-    },
-  };
-}
-
-const Year = (props: Props) => {
   return (
     <div className={styles.main}>
       <h2 className={styles.heading2}>
@@ -61,6 +29,32 @@ const Year = (props: Props) => {
       </div>
     </div>
   );
+}
+
+interface Params extends ParsedUrlQuery {
+  year: string;
+}
+
+export const getStaticProps: GetStaticProps<Props, Params> = async (
+  context
+) => {
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const { year } = context.params!;
+  return {
+    props: {
+      year: year,
+      terms: await getEventTermsByYear(year),
+    },
+  };
 };
 
-export default Year;
+export const getStaticPaths: GetStaticPaths<Params> = async () => {
+  const years = await getEventYears();
+  const paths = years.map((curYear) => ({
+    params: { year: curYear },
+  }));
+  return {
+    paths: paths,
+    fallback: false,
+  };
+};

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

@@ -1,13 +1,12 @@
 .main {
   margin: auto;
-  margin-top: 7rem;
+  margin-top: calc(112rem / 16);
-  margin-bottom: 14rem;
+  margin-bottom: calc(224rem / 16);
-  width: 50rem;
+  width: calc(800rem / 16);
 }
 
 .heading2 {
   font-weight: 700;
-  font-size: 2.25rem;
   color: var(--primary-heading);
 }
 
@@ -23,5 +22,5 @@
 .links > * {
   font-weight: 400;
   font-size: 16px;
-  margin-top: 30px;
+  margin-top: calc(30rem/16);
 }