From a9f2d8bcae493ee5be387f6b303f90f274ccec87 Mon Sep 17 00:00:00 2001
From: Anshuman Tiwari <tanshuman145@gmail.com>
Date: Fri, 12 Jul 2024 11:09:26 +0000
Subject: [PATCH] header new style fixed

---
 css/homeHeader.css |  4 +--
 header/header.html | 87 +++++++++++++++++++++++-----------------------
 2 files changed, 45 insertions(+), 46 deletions(-)

diff --git a/css/homeHeader.css b/css/homeHeader.css
index 2955cde8..43e4da67 100644
--- a/css/homeHeader.css
+++ b/css/homeHeader.css
@@ -34,11 +34,11 @@
   width: 100%;
 }
 .navbar{
-  padding: 12px 28px;
+  padding: 2px 18px;
   display: inline;
 }
 a.navbar-brand{
-  padding-right: 20px;
+  padding-right: 5px;
 }
 .homeHeader .navtab {
   display: flex;
diff --git a/header/header.html b/header/header.html
index c46afe79..355f95a7 100644
--- a/header/header.html
+++ b/header/header.html
@@ -11,26 +11,30 @@
   <link rel="stylesheet" type="text/css" href="../css/header.css">
   <style>
     .navbar-brand img {
-      width: 100%;
+      width: 120px;
     }
 
     .searchBar_h {
       display: flex;
       align-items: center;
+      flex: 1;
+      margin-left: 20px;
+      margin-right: 20px;
     }
 
     .searchBar_h input {
-      width: 100%;
+      flex: 1;
       padding: 5px 10px;
-      border-radius: 5px;
+      border-radius: 5px 0 0 5px;
       border: 1px solid #ccc;
     }
 
     .searchBar_h i {
-      padding: 3px 10px;
+      padding: 5px 10px;
       border-radius: 0 5px 5px 0;
       background-color: #fff;
-      /* border: 1px solid #ccc; */
+      border: 1px solid #ccc;
+      border-left: 0;
       cursor: pointer;
     }
 
@@ -40,17 +44,17 @@
     }
 
     .b_a_s, #more_h, .cartLogoandname {
-      margin-left: 15px;
+      margin-left: 10px;
     }
 
     .cartLogoandname img {
-      width: 24px;
+      width: 20px;
     }
 
     .secondNav .nav-link {
       display: flex;
       align-items: center;
-      padding: 8px 15px;
+      padding: 5px 10px;
       color: #000;
     }
 
@@ -61,14 +65,16 @@
     .navbar-toggler-icon {
       background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%28155,155,155,1%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
     }
+
     #more_h {
       cursor: pointer;
       position: relative;
       display: inline-block;
-      padding: 10px;
+      padding: 5px 10px;
       color: #fff;
-  }
-  #more-options {
+    }
+
+    #more-options {
       display: none;
       background-color: #050505;
       box-shadow: 0 2px 2px rgba(0,0,0,0.15);
@@ -79,20 +85,23 @@
       left: 0;
       min-width: 150px;
       border: 1px solid #e0e0e0;
-  }
-  #more_h:hover #more-options {
+    }
+
+    #more_h:hover #more-options {
       display: block;
-  }
-  .option-item {
+    }
+
+    .option-item {
       color: #f4c3c3;
-      padding: 0px 0px;
+      padding: 5px 0;
       text-decoration: none;
       display: block;
       font-size: 13px;
-  }
-  .option-item:hover {
+    }
+
+    .option-item:hover {
       text-decoration: none;
-  }
+    }
   </style>
 </head>
 
@@ -118,13 +127,13 @@
               <a href="../sell-online/">Become a Seller</a>
             </div>
             <div class="text-white" id="more_h">
-              More <i class="bi bi-chevron-down"></i><i class="bi bi-chevron-up" style="display: none;"></i>
+              More <i class="bi bi-chevron-down"></i>
               <div id="more-options">
-                  <a class="option-item" href="../gift-cards/index.html">Gift-Cards</a>
-                  <a class="option-item" href="../plus/index.html">Flipkart+</a>
-                  <a class="option-item" href="../account/contact.html">Contact Us</a>
+                <a class="option-item" href="../gift-cards/index.html">Gift-Cards</a>
+                <a class="option-item" href="../plus/index.html">Flipkart+</a>
+                <a class="option-item" href="../account/contact.html">Contact Us</a>
               </div>
-          </div>
+            </div>
             <div class="text-white cartLogoandname">
               <a href="../viewcart/">
                 <img src="../img/svg/cart_h.svg" alt="Cart"><span class="cart_h">Cart</span><span id="cartItems"></span>
@@ -144,44 +153,34 @@
         <div class="collapse navbar-collapse" id="navbarNav">
           <ul class="navbar-nav">
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=electronics">Electronics <i class="bi bi-chevron-down"></i><i
-                  class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=electronics">Electronics <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=appliances">TVs & Appliances <i
-                  class="bi bi-chevron-down"></i><i class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=appliances">TVs & Appliances <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=men">Men <i class="bi bi-chevron-down"></i><i
-                  class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=men">Men <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=women">Women <i class="bi bi-chevron-down"></i><i
-                  class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=women">Women <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=kids">Baby & Kids <i class="bi bi-chevron-down"></i><i
-                  class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=kids">Baby & Kids <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=home">Home & Furniture <i class="bi bi-chevron-down"></i><i
-                  class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=home">Home & Furniture <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=books">Sports, Books & More <i
-                  class="bi bi-chevron-down"></i><i class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=books">Sports, Books & More <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=flights">Flights <i class="bi bi-chevron-down"></i><i
-                  class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=flights">Flights <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../offerpage/offerportal.html">Offer Zone <i class="bi bi-chevron-down"></i><i
-                  class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../offerpage/offerportal.html">Offer Zone <i class="bi bi-chevron-down"></i></a>
             </li>
             <li class="nav-item">
-              <a class="nav-link" href="../search/?query=grocery">Grocery <i class="bi bi-chevron-down"></i><i
-                  class="bi bi-chevron-up"></i></a>
+              <a class="nav-link" href="../search/?query=grocery">Grocery <i class="bi bi-chevron-down"></i></a>
             </li>
           </ul>
         </div>