From d37961697b9791664106bc3e3c5d5e01897cd4df Mon Sep 17 00:00:00 2001
From: Mansi yadav <yadavmansi0111207@gmail.com>
Date: Tue, 9 Sep 2025 11:36:50 +0530
Subject: [PATCH] just added an hover effect and made the button to the navbar

---
 index.html | 47 ++++++++++++++++++++++++++++++++++++++++++++---
 1 file changed, 44 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index 6b3d4a3a..34a513fc 100644
--- a/index.html
+++ b/index.html
@@ -102,7 +102,7 @@
             aria-label="Toggle navigation">
             <span class="navbar-toggler-icon"></span>
           </button>
-           <div class="collapse navbar-collapse" id="navbarSupportedContent">
+           <!-- <div class="collapse navbar-collapse" id="navbarSupportedContent">
               <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
                 <li class="nav-item">
                     <a class="nav-link active" aria-current="page" href="#top">Home</a>
@@ -119,8 +119,49 @@
                         <li class="nav-item">
                     <a class="nav-link" href="#contactFooter">Contact</a>
                   </li>
-                </ul>
-          </div>
+                </ul> 
+          </div>-->
+          <div class="collapse navbar-collapse" id="navbarSupportedContent">
+  <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
+    <li class="nav-item">
+      <a class="nav-link btn-nav" aria-current="page" href="#top">Home</a>
+    </li>
+    <li class="nav-item">
+      <a class="nav-link btn-nav" href="#challengeSection">Challenges</a>
+    </li>
+    <li class="nav-item">
+      <a class="nav-link btn-nav" href="#leaderboardSection">Leaderboard</a>
+    </li>
+    <li class="nav-item">
+      <a class="nav-link btn-nav" href="#aboutSection">About</a>
+    </li>
+    <li class="nav-item">
+      <a class="nav-link btn-nav" href="#contactFooter">Contact</a>
+    </li>
+  </ul>
+</div>
+
+          <style>
+            
+
+              
+            .btn-nav {
+  padding: 8px 16px;
+  margin: 0 6px;
+  border-radius: 8px;
+  background-color: transparent;
+  transition: all 0.3s ease;
+}
+
+.btn-nav:hover {
+  background-color: #0d6efd; /* Bootstrap primary color */
+  color: white !important;
+  text-decoration: none;
+}
+
+
+            
+          </style>
         </div>
       </nav>
     </header>