Issue with Menu bar

Html-files/menu.html

@@ -74,6 +74,12 @@
   padding-top: 0;
 }
 
+.dark-mode {
+    background-color: #121212;
+    color: #ffffff;
+}
+
+
 .center-links .nav-item .dropdown-menu {
   background-color: #ffffff;
   color: white;
@@ -116,7 +122,7 @@
 <nav class="navbar navbar-expand-lg fixed-top">
     <div class="container-fluid">
         <a href="../index.html" class="navbar-brand opacity-75 flex-fill">
-            <img src="../Images/logo/Foodielogo.png" height="40">
+            <img src="../Images/logo/Logo-Light.png" height="70" width="80">
         </a>
         <button class="navbar-toggler order-1" type="button" data-bs-toggle="collapse"
             data-bs-target=".hamburgeritems" aria-controls="navbarNav" aria-expanded="false"
@@ -166,8 +172,9 @@
             </ul>
         </div>
         <div class="order-0 ml-auto p-2">
-            <img class="nav-link" src="../Images/navbar/sun.png" id="theme-toggle-icon" alt="theme toggler button">
+            <img class="nav-link" src="../Images/navbar/moon.png" id="theme-toggle-icon" alt="theme toggler button">
         </div>
+
         <div class="collapse navbar-collapse hamburgeritems enddiv order-3">
             <ul class="navbar-nav end-links">
                 <li class="nav-item">

index.html

@@ -225,7 +225,22 @@
     </nav>
 
 
-
+    <!-- Menu Theme Change-->
+     <!-- Theme Toggle Button -->
+<button id="theme-toggle-icon">
+    <img id="theme-toggle-icon" src="path/to/dark-mode-icon.png" alt="Toggle Theme">
+</button>
+
+<!-- Cart Icon with Subscript -->
+<div class="cart-icon">
+    <img src="path/to/cart-icon.png" alt="Cart">
+    <span class="cart-subscript">0</span>
+</div>
+
+<!-- Include your menu-container -->
+<div class="menu-container"></div>
+
+ <!-- Menu Theme Change-->
 
     <section id="homeSlider" class="carousel slide carousel-fade bg-black" data-bs-ride="carousel" data-bs-interval="5000">
         <!-- Indicators -->