move header/footer to RootLayout

src/components/HeaderItem.tsx

@@ -12,7 +12,7 @@ export default function HeaderItem({
 }: HeaderItemProps) {
     return (
         <Link
-            className="inline text-green-500 hover:underline font-bold text-3xl pr-2" 
+            className="inline text-green-500 hover:underline font-bold text-3xl text-center" 
             href={linkTo} 
             target={newWindow ? "_blank" : "_self"}
         >

src/components/RootLayout.tsx

@@ -1,21 +1,33 @@
 // component imports
 import Head from "./Head"
+import Header from "./header";
+import Footer from "./footer";
 
 // react imports
 import React from 'react';
 
 type LayoutProps = {
     children: React.ReactNode
-    protectedPage?: boolean
+    protectedPage?: boolean,
+    showHeader: boolean,
+    isHomePage: boolean
 }
 
-export default function RootLayout({ children }: LayoutProps) {
+export default function RootLayout({ 
+    children,
+    showHeader = true,
+    isHomePage = true
+}: LayoutProps) {
     return (
         <main className="bg-black h-screen flex flex-col justify-center items-center overflow-y-hidden">
+            { showHeader && <Header isHomePage={isHomePage} />}
+
             <Head />
             <div className="flicker">
                 {children}
             </div>
+
+            <Footer />
         </main>
     )
 }

src/components/header.tsx

@@ -1,18 +1,18 @@
 import HeaderItem from "./HeaderItem";
 
 type HeaderProps = {
-    isNotHomePage: boolean
+    isHomePage: boolean
 }
 
 export default function Header({
-    isNotHomePage = false
+    isHomePage = false
 }: HeaderProps) {
     return (
         <>
-            <div className="text-white max-w-md mx-auto pt-2 pb-4 text-center">
-                <div className="inline-block pb-2 space-x-6">
+            <div className="text-white mx-auto my-4 lg:max-w-md">
+                <div className="inline-block pb-2 space-x-2">
                     <HeaderItem content="HOME" linkTo={
-                        isNotHomePage ? "/?noAnimation"
+                        !isHomePage ? "/?noAnimation"
                         : "/"
                     } />
                     <HeaderItem content="LINKS" linkTo="/links" />