Added search bar in nav bar

jaysomani · Jan 21, 2024 · b94e977 · b94e977
1 parent 65dcca7
commit b94e977
Show file tree

Hide file tree

Showing 2 changed files with 67 additions and 3 deletions.
diff --git a/css/style.css b/css/style.css
@@ -123,6 +123,44 @@ body.offcanvas-menu:before {
     background-color: #99b9da;
 }
 
+.search{
+    display: flex;
+    align-items: center;
+    margin-right: 0;
+}
+
+.search form{
+    display: flex;
+    margin: 0;
+
+}
+
+.search input{
+    padding: 10px;
+    border: 1px solid #ddd;
+    outline: none;
+    border-right: 5px;
+    margin-right: 10px;
+    font-size: 16px;
+
+}
+.search input:hover{
+    border: 1px solid #72a0d4;
+
+}
+.search button{
+    padding: 10px;
+    background-color: #fff;
+    border: none;
+    border-radius: 5px;
+    color: #333;
+    font-size: 16px;
+    cursor: pointer;
+}
+.search button:hover{
+    background-color: #ccc;
+}
+
 .btn-primary {
     text-align: center;
     font-size: 21px;

diff --git a/pageTemplate.html b/pageTemplate.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
 
 <head>
   <meta charset="UTF-8">
@@ -13,6 +14,9 @@
   <link rel="stylesheet" href="./css/style.css">
   <link rel="stylesheet" href="./css/bootstrap.css">
   <link rel="stylesheet" href="./css/fonts.css">
+
+
+
 
 </head>
 
@@ -54,17 +58,39 @@
               <ul class="rd-navbar-nav">
 
                 <li class="rd-nav-item ">
-                  <a class="rd-nav-link" href="../../index.html">Home</a>
+                  <a class="rd-nav-link" href="../../index.html">Call</a>
                 </li>
                 <li class="rd-nav-item active">
                   <a class="rd-nav-link" style="cursor: pointer;">Explore</a>
                 </li>
                 <li class="rd-nav-item">
                   <a class="rd-nav-link" href="../Profile/profile.html">Guide</a>
                 </li>
-
+          
               </ul>
-            </div>
+
+
+
+
+            <div class="search" >
+                  <form>
+                     <input type="text" placeholder="Search...">
+                    <button type="submit">
+                      <a href="https://google.com" target="_blank">Go
+                      </a>
+                    </button>
+
+                  </form>
+            </div> 
+
+
+
+
+
+
+
+
+
           </div>
         </div>
       </nav>