Fixed navbar

daily-thought-frontend/src/components/navigation/NavBar.tsx

@@ -33,8 +33,8 @@ const NavBar: FC<PropsWithChildren<NavBarProps>> = ({
 }) =>  {
   return (
     <>
-      <div className="min-h-full">
-        <Disclosure as="nav" className="bg-white border-b border-gray-200">
+      <div className="min-h-full min-w-full">
+        <Disclosure as="nav" className="bg-c-pink">
           {({ open }) => (
             <>
               <div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
@@ -64,12 +64,12 @@ const NavBar: FC<PropsWithChildren<NavBarProps>> = ({
                     </div>
                   }
                   <div>
-                    <h1 className="text-2xl font-bold tracking-tight text-gray-900">Daily</h1>
+                    <h1 className="text-2xl font-bold tracking-tight text-c-green">Daily</h1>
                   </div>
                   
                   {user !== null && 
                     <div className="hidden md:block">
-                      <div className="ml-4 flex items-center md:ml-6">
+                      <div className="flex items-center">
                         <button
                           type="button"
                           className="rounded-full bg-c-pink p-1 text-white hover:text-white focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-c-pink"
@@ -135,14 +135,14 @@ const NavBar: FC<PropsWithChildren<NavBarProps>> = ({
               </div>
 
               <Disclosure.Panel className="md:hidden">
-                <div className="space-y-1 px-2 pt-2 pb-3 sm:px-3">
+                <div className="space-y-1 px-2 pt-2 pb-3 sm:px-3 bg-white">
                   {navigation.map((item) => (
                     <Disclosure.Button
                       key={item.name}
                       as="a"
                       href={item.href}
                       className={classNames(
-                        item.current ? 'bg-c-pink text-white' : 'text-gray-300 hover:bg-gray-700 hover:text-white',
+                        item.current ? 'bg-white text-c-pink' : 'text-gray-300 hover:bg-gray-700 hover:text-white',
                         'block rounded-md px-3 py-2 text-base font-medium'
                       )}
                       aria-current={item.current ? 'page' : undefined}
@@ -151,7 +151,7 @@ const NavBar: FC<PropsWithChildren<NavBarProps>> = ({
                     </Disclosure.Button>
                   ))}
                 </div>
-                <div className="border-t border-gray-200 pt-4 pb-3">
+                <div className="border-t border-gray-200 pt-4 pb-3 bg-white">
                   <div className="flex items-center px-5">
                     <div className="flex-shrink-0">
                       <img className="h-10 w-10 rounded-full" src={user?.Avatar} alt="" />