Update index.html

Author: CodingwithAnkit-tech

index1.html

@@ -11,78 +11,6 @@
         .scroll::-webkit-scrollbar{
             display: none;
         }
-
-        .custom-search-bar {
-          width: 600px;
-          
-          border-radius: 50px;
-          border: 1px solid #ccc;
-          display: flex;
-          align-items: center;
-          background-color: #fff;
-          overflow: hidden;
-      }
-
-      .custom-search-bar input {
-          border: none;
-          flex-grow: 1;
-          padding: 10px 15px;
-          border-top-left-radius: 50px;
-          border-bottom-left-radius: 50px;
-          outline: none;
-      }
-
-      .custom-search-bar input::placeholder {
-          color: #999;
-      }
-
-      .custom-search-bar .search-icon {
-          background-color: transparent;
-          border: none;
-          padding: 0 15px;
-          display: flex;
-          align-items: center;
-      }
-
-      .custom-search-bar .search-icon i {
-          font-size: 1.4rem;
-          color: #333;
-      }
-
-      .custom-search-bar .search-icon:hover {
-          cursor: pointer;
-          color: #000;
-      }
-
-      /* Separate Mic Icon Positioned Outside */
-      .mic-container {
-          margin-left: 1px;
-      }
-
-      .mic-container .mic-icon {
-          background-color: #f1f1f1;
-          border-radius: 50%;
-          padding: 10px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          width: 45px;
-          height: 45px;
-      }
-
-      .mic-container .mic-icon i {
-          font-size: 1.4rem;
-          color: #333;
-      }
-
-      .mic-container .mic-icon:hover {
-          cursor: pointer;
-          background-color: #e1e1e1;
-      }
-      .im:hover{
-        background-color: #333;
-        color: #e1e1e1;
-      }
     </style>
 
   </head>
@@ -96,43 +24,11 @@
                 <i class="fa-solid fa-bars"></i> <i class="fa-brands fa-youtube ps-3" style="color: #e40707;"></i> <b>YouTube </b> <sup>IN</sup>
             </div>
             <div class="col-sm-6  mx-auto ">
-                <div class="container my-2">
-                    <div class="d-flex justify-content-center align-items-center">
-                        <!-- Search Bar -->
-                        <div class="custom-search-bar">
-                            <input type="text" placeholder="Search">
-                            <span class="search-icon">
-                                <img src="./img/search.png" alt="">
-                            </span>
-                        </div>
-                        <!-- Mic Icon Outside -->
-                        <div class="mic-container">
-                            <div class="mic-icon">
-                                <img src="./img/mic.png" alt="">
-                            </div>
-                        </div>
-                    </div>
-                </div>
+                <form class="d-flex w-60 mx-auto">
+                <input class="form-control my-2 me-3  rounded-5" type="search" placeholder="Search" aria-label="Search">
+                <button class="btn btn-outline-secondary my-2 rounded-5">Search</button>
+                </form>
             </div>
-
-
-            
-
-
-
-
-
-
-
-
-            
-
-
-
-
-
-
-
             <div class="col-sm-2 "><button class="btn btn-outline-secondary my-2 ms-5 rounded-5 text-primary"><b>Sign in</b></button></div>
         </div>
         <!-- top row end -->
@@ -257,7 +153,7 @@ <h4>More from YouTube</h4>
             <div class="col-10 bg-light text-light h-100">
             <div class="d-flex p-2 bg-light py-2 mt-2 " style="overflow: auto;">
             <p class="px-2 bg-white text-black mx-1 my-auto">ALL</p>
-            <p class="px-2 bg-white text-black my-auto">Tamil </p>
+            <p class="px-2 bg-white text-black my-auto">Bhojpuri</p>
             <p class="px-2 bg-white text-black my-auto">Mixes</p>
             <p class="px-2 bg-white text-black mx-1 my-auto">Live</p>
             <p class="px-2 bg-white text-black mx-1 my-auto">Developmebt</p>
@@ -533,4 +429,4 @@ <h5 class="card-title">HALDIGHATI RAP 2</h5>
 
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
   </body>
-</html>
+</html>