simplified colouring current advice subheading

pages/resources/advice/academic.tsx

@@ -1,5 +1,4 @@
 import Link from "next/link";
-import { useRouter } from "next/router";
 import React, { ReactNode } from "react";
 
 import { Image } from "@/components/Image";
@@ -17,8 +16,6 @@ export default function CoopAdvice() {
 }
 
 export function Advice(props: { children: ReactNode }) {
-  const router = useRouter();
-  const path = router.pathname;
   return (
     <>
       <div className={styles.titleContainer}>
@@ -30,13 +27,7 @@ export function Advice(props: { children: ReactNode }) {
           <a>Coop Advice</a>
         </Link>
         <Link href="/resources/advice/academic">
-          <a
-            className={
-              path == "/resources/advice/academic" ? styles.currentAdvice : ""
-            }
-          >
-            Academic Advice
-          </a>
+          <a className={styles.currentAdvice}>Academic Advice</a>
         </Link>
         <Link href="/resources/advice/misc">
           <a>Additional Resources</a>

pages/resources/advice/coop.tsx

@@ -1,5 +1,4 @@
 import Link from "next/link";
-import { useRouter } from "next/router";
 import React, { ReactNode } from "react";
 
 import { Image } from "@/components/Image";
@@ -17,8 +16,6 @@ export default function CoopAdvice() {
 }
 
 export function Advice(props: { children: ReactNode }) {
-  const router = useRouter();
-  const path = router.pathname;
   return (
     <>
       <div className={styles.titleContainer}>
@@ -27,13 +24,7 @@ export function Advice(props: { children: ReactNode }) {
       </div>
       <div className={styles.adviceBarContainer}>
         <Link href="/resources/advice/coop">
-          <a
-            className={
-              path == "/resources/advice/coop" ? styles.currentAdvice : ""
-            }
-          >
-            Coop Advice
-          </a>
+          <a className={styles.currentAdvice}>Coop Advice</a>
         </Link>
         <Link href="/resources/advice/academic">
           <a>Academic Advice</a>

pages/resources/advice/misc.tsx

@@ -1,5 +1,4 @@
 import Link from "next/link";
-import { useRouter } from "next/router";
 import React, { ReactNode } from "react";
 
 import { Image } from "@/components/Image";
@@ -17,8 +16,6 @@ export default function CoopAdvice() {
 }
 
 export function Advice(props: { children: ReactNode }) {
-  const router = useRouter();
-  const path = router.pathname;
   return (
     <>
       <div className={styles.titleContainer}>
@@ -33,13 +30,7 @@ export function Advice(props: { children: ReactNode }) {
           <a>Academic Advice</a>
         </Link>
         <Link href="/resources/advice/misc">
-          <a
-            className={
-              path == "/resources/advice/misc" ? styles.currentAdvice : ""
-            }
-          >
-            Additional Resources
-          </a>
+          <a className={styles.currentAdvice}>Additional Resources</a>
         </Link>
       </div>
       <div className={styles.content}>{props.children}</div>