fix: change colour on hover for links

frontend/components/BlueLink.tsx

@@ -7,8 +7,10 @@ export type Props = {
 
 export default function BlueLink({ to, children }: Props) {
   return (
-    <Link href={to} className="hover:underline text-sky-500 dark:text-sky-400">
-      {children}
+    <Link href={to}>
+      <a className="hover:underline text-sky-500 dark:text-sky-400">
+        {children}
+      </a>
     </Link>
   );
 }

frontend/components/NavItem.tsx

@@ -9,11 +9,10 @@ export interface Props {
 
 export default function NavItem(props: Props) {
   const ret = (
-    <Link
-      className="hover:text-sky-500 dark:hover:text-sky-400"
-      href={props.href}
-    >
-      {props.children}
+    <Link href={props.href}>
+      <a className="hover:text-sky-500 dark:hover:text-sky-400">
+        {props.children}
+      </a>
     </Link>
   );
 

frontend/components/Navigation.tsx

@@ -56,9 +56,7 @@ export default function Navigation() {
 
   const nav = user ? (
     <>
-      <NavItem href={`/u/${user.username}`}>
-        <a>@{user.username}</a>
-      </NavItem>
+      <NavItem href={`/u/${user.username}`}>@{user.username}</NavItem>
       <NavItem href="/settings">Settings</NavItem>
       <NavItem href="/logout">Log out</NavItem>
     </>