Merge pull request #20 from wethmiranasinghe/main

Update Header and Footer
cepdnaclk · Jun 15, 2024 · e21e272 · e21e272
2 parents f33a462 + 6009af7
commit e21e272
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 8 deletions.
diff --git a/front-end/src/components/Footer.jsx b/front-end/src/components/Footer.jsx
@@ -21,8 +21,8 @@ function Footer() {
 
                     <ul>
                         <li><Link to = '/'>Home</Link></li>
-                        <li><Link to = '/project overview'>Log in</Link></li>
-                        <li><Link to = '/project overview'>Project Overview</Link></li>
+                        <li><Link to = '/project overview/overview'>Log in</Link></li>
+                        <li><Link to = '/project overview/overview'>Overview</Link></li>
                         <li><Link to = '/contact'>Contact</Link></li>
                     </ul>
                 </nav>

diff --git a/front-end/src/components/Header.css b/front-end/src/components/Header.css
@@ -77,7 +77,7 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  background-color: #0f172a;
+  background-color: #172953;
   position: sticky;
   top: 0;
   z-index: 1000;
@@ -105,7 +105,8 @@
 }
 
 .headerNavBar ul li a:hover {
-  background-color: #172554;
+  background-color: #203a90;
+  border-radius: 3em;
 } 
 
 .headerNavBar .menu{
@@ -130,14 +131,15 @@
   display: none;
   position: absolute;
   left: 0;
-  background-color: #0f172a;
+  background-color: #172953;
   min-width: 100%;
   box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
   z-index: 1;
 }
 
 .headerNavBar .headerDropDown:hover .dropdown-content {
   display: block;
+  border-radius: 0.5em;
 }
 
 .headerNavBar .headerDropDown .dropdown-content a {
@@ -146,10 +148,11 @@
   text-decoration: none;
   display: block;
   text-align: left;
+  border-radius: 3em;
 }
 
 .headerNavBar .headerDropDown .dropdown-content a:hover {
-  background-color: #172554;
+  background-color: #203a90;
 }
 
   /* Media queries for responsiveness */
@@ -253,14 +256,14 @@
     position: absolute; /* Position the dropdown absolutely */
     top: 2rem; /* Adjust the top position to be below the hamburger icon */
     left: 0; /* Align with the left edge */
-    background-color: #0f172a; /* Background color to match the navbar */
+    background-color: #172953; /* Background color to match the navbar */
     z-index: 999;
   }
 
   .headerNavBar ul.open{
     display: flex;
     width: 100%;
-    background-color: #0f172a;
+    background-color: #172953;
   }
 
   .headerNavBar ul li {