feat: fix header and footer colours

martapanc · Jul 25, 2023 · 32385eb · 32385eb
1 parent 5aab00e
commit 32385eb
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 20 deletions.
diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
@@ -1,4 +1,3 @@
-import { useTheme } from 'next-themes';
 import { IconType } from 'react-icons';
 import { FiMail } from 'react-icons/fi';
 import {
@@ -14,16 +13,8 @@ import {
 import UnstyledLink from '@/components/links/UnstyledLink';
 
 export default function Footer() {
-  const { theme } = useTheme();
-
   return (
-    <footer
-      className={`${
-        theme === 'dark'
-          ? 'to-dark bg-gradient-to-r from-sky-950'
-          : 'bg-gradient-to-r from-blue-300 to-sky-100'
-      }`}
-    >
+    <footer className='dark:to-dark bg-gradient-to-r from-blue-300 to-sky-100 dark:from-sky-950'>
       <main className='layout flex flex-col items-center py-6'>
         <div className='flex flex-wrap justify-center gap-x-8 gap-y-4'>
           <FooterLinks />

diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx
@@ -4,7 +4,6 @@ import { MenuItem } from '@mui/material';
 import { Menu } from '@mui/material';
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
-import { useTheme } from 'next-themes';
 import * as React from 'react';
 import { useEffect, useState } from 'react';
 import Headroom from 'react-headroom';
@@ -25,7 +24,6 @@ export const links = [
 ];
 
 export default function Header() {
-  const { theme } = useTheme();
   const [isOpen, setIsOpen] = useState(false);
 
   const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
@@ -57,15 +55,9 @@ export default function Header() {
 
   return (
     <Headroom style={{ zIndex: 50 }}>
-      <header
-        className={`sticky top-0 z-50 py-6 ${
-          theme === 'dark'
-            ? 'bg-gradient-to-r from-sky-900 to-blue-950'
-            : 'bg-gradient-to-r from-sky-300 to-blue-400'
-        }`}
-      >
+      <header className='sticky top-0 z-50 bg-gradient-to-r from-sky-300 to-blue-400 py-6 dark:from-sky-900 dark:to-blue-950'>
         <div className='layout flex h-12 w-full items-center justify-between'>
-          <nav className='m-4 flex w-full items-center justify-between'>
+          <nav className='m-4 flex w-full items-center justify-between text-xl'>
             <UnstyledLink
               href='/'
               className='font-bold text-slate-900 hover:text-slate-700 dark:text-blue-50 dark:hover:text-blue-200'