done

abta.html

@@ -8,6 +8,7 @@
 
     <link rel="stylesheet" href="footer.css"> 
     <link rel="stylesheet" href="styles.css" />
+    <link rel="stylesheet" href="navbar.css">
 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
     <style>
@@ -18,7 +19,7 @@
       padding: 0;
       box-sizing: border-box;
   }
-
+ 
   /* Body styling */
   body {
       font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
@@ -219,63 +220,33 @@
   <header>
     <div class="container3">
 
-        <nav class="navbar">
-            <a href="./index.html" id="logo-href">
-              <div class="logo-container">
-                <img
-                  src="images/4.jpeg"
-                  alt="Ticket Booking Logo"
-                  class="logo-image"
-                />
-                <div class="logo">Ticket Booking</div>
-              </div>
-            </a>
-
-            <div class="nav-container">
-              <div class="menu-toggle">
-                <span class="bar"></span>
-                <span class="bar"></span>
-                <span class="bar"></span>
-              </div>
-
-              <ul class="nav-links">
-                <li>
-                  <a href="index.html" class="home-button"
-                    ><i class="fas fa-home"></i>HOME</a
-                  >
-                </li>
-                <li>
-                  <a href="buy.html"><i class="fas fa-shopping-cart"></i> Buy</a>
-                </li>
-                <li>
-                  <a href="sell.html"><i class="fas fa-tag"></i> Sell</a>
-                </li>
-                <li>
-                  <a href="#contact"><i class="fas fa-envelope"></i> Contact</a>
-                </li>
-                <li>
-                  <a href="contributors.html"
-                    ><i class="fas fa-users"></i> Our Contributors</a
-                  >
-                </li>
-
-                <li>
-                  <a href="/client/register.html" class="login-btn"
-                    ><i class="fas fa-user"></i
-                  ></a>
-                </li>
-              </ul>
-
-              <button class="mode-toggle" id="modeToggle" style="width: 40px; height: 40px">
-                🌙
-            </button>
-
-            </div>
-
-
-
 
-      </nav>
+
+  <nav class="navbar">
+    <!-- <img src="https://ticket-booking-blue.vercel.app/images/4.jpeg" alt="" style="border-radius: 50%; height: 35px; width: 35px;"> -->
+    <!-- <div class="logo" style="font-size: 20px;">Ticket Marketplace</div> -->
+
+    <!-- Toggle Button (Visible on Small Screens) -->
+    <button id="navToggle">☰</button>
+
+    <!-- Navbar Links -->
+    <!-- <div id="navLinks"> -->
+    <!-- <a href="index.html" style="display: flex; align-items: center; text-decoration: none; white-space: nowrap; margin-right: -250px;"> -->
+      <img src="https://ticket-booking-blue.vercel.app/images/4.jpeg" alt="" style="border-radius: 50%; height: 35px; width: 35px;">
+      <div class="logo" style="font-size: 20px; margin-left: 8px;">Ticket Marketplace</div>
+  </a><div>
+        <a href="index.html"><i class="fas fa-home"></i> Home</a>
+        <a href="about.html" class="active"><i class="fas fa-info-circle"></i> About</a>
+        <a href="buy.html"><i class="fas fa-ticket-alt"></i> Buy Ticket</a>
+        <a href="sell.html"><i class="fas fa-tags"></i> Sell</a>
+        <a href="contactus.html"><i class="fas fa-envelope"></i> Contact</a>
+        <a href="contributor.html"><i class="fas fa-users"></i> Contributors</a>
+        <a href="client/login.html"><i class="fas fa-sign-in-alt"></i> Login</a>
+    </div>
+
+    <!-- Dark Mode Button -->
+    <button id="darkModeToggle" style="width: 40px; height: 40px;">🌙</button>
+</nav>
     </div>
   </header>