fixed header sizes for mobile

src/app/layout.js

@@ -45,7 +45,8 @@ export default function RootLayout({children}) {
             disableTransitionOnChange
         >
             <header
-                className={"fixed dark:bg-black bg-gray-200 w-full flex text-3xl md:text-5xl p-3 justify-between border-b-2 border-emerald-800 dark:border-emerald-300 content-center"}>
+                className={"fixed dark:bg-black bg-gray-200 w-full flex text-4xl md:text-5xl p-3 justify-between " +
+                    "border-b-2 border-emerald-800 dark:border-emerald-300 content-center flex items-center"}>
                 <Burger/>
                 <div className={""}>{getTitle()}</div>
                 <ModeToggle/>

src/components/burger.jsx

@@ -7,7 +7,7 @@ export default function Burger() {
 
     return (
         <div>
-            <button className={"text-5xl"} onClick={() => setIsOpen(!isOpen)}>&#9776;</button>
+            <button className={"text-4xl md:text-5xl"} onClick={() => setIsOpen(!isOpen)}>&#9776;</button>
             <div
                     className={`absolute top-19 left-0 md:w-1/4 w-3/4 h-screen dark:bg-emerald-950 dark:border-t-emerald-400 
                 dark:border-r-emerald-400 border-2 bg-gray-200 flex flex-col