fixed footer styling

agarwalbhargavi · Oct 10, 2024 · d649f8b · d649f8b
1 parent d954a34
commit d649f8b
Show file tree

Hide file tree

Showing 8 changed files with 175 additions and 99 deletions.
diff --git a/about.html b/about.html
@@ -12,7 +12,7 @@
     <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css" />
 
     <!--css-->
-    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
+    <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"> -->
     <link rel="stylesheet" href="style.css">
 
     <style>
@@ -87,19 +87,19 @@ <h2>WordWise</h2>
         <a href="contact_us.html">Give Feedback</a>
     </div>
 
-              
-              <div class="dropdown">
-                <!-- Profile Icon -->
-                <a href="#" class="d-flex align-items-center text-decoration-none" id="profileDropdown" data-bs-toggle="dropdown" aria-expanded="false" style="margin-bottom: 7px;">
-                  <i class="fas fa-user-circle" style="font-size: 30px; color: #333;"></i>
-                </a>
-            
-                <!-- Dropdown Menu -->
-                <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="profileDropdown">
-                  <li><a class="dropdown-item" href="#login" onclick="openForm('login')">Login</a></li>
-                  <li><a class="dropdown-item" href="#signup" onclick="openForm('signup')">Signup</a></li>
-                </ul>
-              </div>
+    <div class="dropdown">
+        <!-- Profile Icon -->
+        <a href="#" class="profile-icon" id="profileDropdown" onclick="toggleDropdown()">
+            <i class="fas fa-user-circle"></i>
+        </a>
+
+        <!-- Dropdown Menu -->
+        <ul class="dropdown-menu" id="dropdownMenu">
+            <li><a href="#login" onclick="openForm('login')">Login</a></li>
+            <li><a href="#signup" onclick="openForm('signup')">Signup</a></li>
+        </ul>
+    </div>
+
     <!-- Login Form -->
 <div class="form-popup" id="loginForm">
     <form class="form-container" onsubmit="return validateLoginForm()">
@@ -183,7 +183,7 @@ <h2>Signup</h2>
 </div>
 
 <!-- Bootstrap Icons and Script for Eye Icon Functionality -->
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
+<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css"> -->
 <script>
     function togglePasswordVisibility(passwordFieldId, iconId) {
         const passwordField = document.getElementById(passwordFieldId);
@@ -299,7 +299,7 @@ <h2>Signup</h2>
                                     <a href="blog.html"  class="text-title display-1 text-dark">
                                         Roaming Routes
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Wed 01,2020 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 13</span>
                                     </p>
@@ -326,7 +326,7 @@ <h2>Signup</h2>
 
 
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Mon 13,2023 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 12</span>
                                     </p>
@@ -354,7 +354,7 @@ <h2>Signup</h2>
 
 
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Wed 09,2023 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 19</span>
                                     </p>
@@ -382,7 +382,7 @@ <h2>Signup</h2>
 
 
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Tue 07,2019 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 6</span>
                                     </p>
@@ -410,7 +410,7 @@ <h2>Signup</h2>
 
 
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Tue 02,2021 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 10</span>
                                     </p>
@@ -440,7 +440,7 @@ <h2>Signup</h2>
 
 
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 12</span>
                                     </p>
@@ -468,7 +468,7 @@ <h2>Signup</h2>
 
 
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 12</span>
                                     </p>
@@ -496,7 +496,7 @@ <h2>Signup</h2>
 
 
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 12</span>
                                     </p>
@@ -524,7 +524,7 @@ <h2>Signup</h2>
 
 
                                     </a>
-                                    <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                    <p class="secondary-title display-3" style="margin-top:3px;">
                                         <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                                         <span><i class="bi bi-chat-fill"></i> 12</span>
                                     </p>
@@ -552,7 +552,7 @@ <h2>Signup</h2>
 
 
                                   </a>
-                                  <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                  <p class="secondary-title display-3" style="margin-top:3px;">
                                       <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                                       <span><i class="bi bi-chat-fill"></i> 12</span>
                                   </p>
@@ -580,7 +580,7 @@ <h2>Signup</h2>
 
 
                                 </a>
-                                <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                <p class="secondary-title display-3" style="margin-top:3px;">
                                     <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                                     <span><i class="bi bi-chat-fill"></i> 12</span>
                                 </p>
@@ -609,7 +609,7 @@ <h2>Signup</h2>
 
 
                               </a>
-                              <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                              <p class="secondary-title display-3" style="margin-top:3px;">
                                   <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                                   <span><i class="bi bi-chat-fill"></i> 12</span>
                               </p>
@@ -635,7 +635,7 @@ <h2>Signup</h2>
 
 
                             </a>
-                            <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                            <p class="secondary-title display-3" style="margin-top:3px;">
                                 <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                                 <span><i class="bi bi-chat-fill"></i> 12</span>
                             </p>
@@ -663,7 +663,7 @@ <h2>Signup</h2>
 
 
                           </a>
-                          <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                          <p class="secondary-title display-3" style="margin-top:3px;">
                               <span><i class="fa-regular fa-calendar"></i> Wed 02,2023 &nbsp;</span>
                               <span><i class="bi bi-chat-fill"></i> 12</span>
                           </p>
@@ -844,13 +844,13 @@ <h2>Subscribe to Our Newsletter</h2>
                  <div id = "about-us">
                   <h2 class="footer-title secondary-title">About Us</h2>
 
-                    <div class="secondary-title text-secondary">
+                    <div class="secondary-title">
                        <p class="mt-2 ">
                         We are a close-knit team of passionate storytellers dedicated to sharing captivating content with the world.
                        </p>
 
-                       <address>
-                           <i class="fas fa-map-marker-alt text-primary"></i>
+                       <address style="margin-bottom: 0;">
+                           <i class="fas fa-map-marker-alt" ></i>
                            5 South Main Street Los Angeles, ZZ-9611 USA
                        </address>
 
@@ -885,7 +885,7 @@ <h2 class="footer-title secondary-title">Feature Post</h2>
                                           <a href="#" class="text-title display-2 text-dark">
                                             Embrace the beauty of nature through our enchanting blog, where we celebrate the wonders of the natural world
                                           </a>
-                                          <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                          <p class="secondary-title display-3" style="margin-top:3px;">
                                                <span><i class="far fa-clock text-primary"></i> Wed 02, 2022 </span>
                                           </p>
                                       </div>
@@ -902,7 +902,7 @@ <h2 class="footer-title secondary-title">Feature Post</h2>
                                        <a href="#" class="text-title display-2 text-dark">
                                         Embark on unforgettable journeys through our travel blog, where wanderlust meets inspiration
                                        </a>
-                                       <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                       <p class="secondary-title display-3" style="margin-top:3px;">
                                             <span><i class="far fa-clock text-primary"></i> Wed 05, 2020 </span>
                                        </p>
                                    </div>
@@ -919,7 +919,7 @@ <h2 class="footer-title secondary-title">Feature Post</h2>
                                            <a href="#" class="text-title display-2 text-dark">
                                             Gaming Adventures Unleashed
                                            </a>
-                                           <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                           <p class="secondary-title display-3" style="margin-top:3px;">
                                                 <span><i class="far fa-clock text-primary"></i> Wed 02, 2021 </span>
                                            </p>
                                        </div>
@@ -1015,5 +1015,6 @@ <h4>Share this post:</h4>
     <script src="progress_bar.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
+    <script src="profiledropdown.js"></script>
 </body>
 </html>
diff --git a/blog.html b/blog.html
@@ -11,7 +11,7 @@
     <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css" />
 
     <!--css-->
-    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
+    <!-- <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> -->
     <link rel="stylesheet" href="style.css">
     <link rel="stylesheet" href="Scroll_and_progressbar.css">
 
@@ -45,18 +45,19 @@ <h2>WordWise</h2>
     </div>
 
 
-              <div class="dropdown">
-                <!-- Profile Icon -->
-                <a href="#" class="d-flex align-items-center text-decoration-none" id="profileDropdown" data-bs-toggle="dropdown" aria-expanded="false" style="margin-bottom: 7px;">
-                  <i class="fas fa-user-circle" style="font-size: 30px; color: #333;"></i>
-                </a>
-
-                <!-- Dropdown Menu -->
-                <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="profileDropdown">
-                  <li><a class="dropdown-item" href="#login" onclick="openForm('login')">Login</a></li>
-                  <li><a class="dropdown-item" href="#signup" onclick="openForm('signup')">Signup</a></li>
-                </ul>
-              </div>
+    <div class="dropdown">
+      <!-- Profile Icon -->
+      <a href="#" class="profile-icon" id="profileDropdown" onclick="toggleDropdown()">
+          <i class="fas fa-user-circle"></i>
+      </a>
+
+      <!-- Dropdown Menu -->
+      <ul class="dropdown-menu" id="dropdownMenu">
+          <li><a href="#login" onclick="openForm('login')">Login</a></li>
+          <li><a href="#signup" onclick="openForm('signup')">Signup</a></li>
+      </ul>
+  </div>
+
 
       <!-- Login Form -->
 <div class="form-popup" id="loginForm">
@@ -786,5 +787,6 @@ <h2 class="footer-title secondary-title mt-2">Connect with us</h2>
       </script>
  <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
+ <script src="profiledropdown.js"></script>
 </body>
 </html>
diff --git a/category.html b/category.html
@@ -14,7 +14,7 @@
     <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css" />
 
     <!--css-->
-    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
+    <!-- <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> -->
     <link rel="stylesheet" href="style.css">
     <link rel="stylesheet" href="category.css">
     <link rel="stylesheet" href="Scroll_and_progressbar.css">
@@ -62,18 +62,19 @@ <h2>WordWise</h2>
             <a href="contact_us.html">Give Feedback</a>
         </div>
 
-                  <div class="dropdown">
-                    <!-- Profile Icon -->
-                    <a href="#" class="d-flex align-items-center text-decoration-none" id="profileDropdown" data-bs-toggle="dropdown" aria-expanded="false" style="margin-bottom: 7px;">
-                      <i class="fas fa-user-circle" style="font-size: 30px; color: #333;"></i>
-                    </a>
-
-                    <!-- Dropdown Menu -->
-                    <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="profileDropdown">
-                      <li><a class="dropdown-item" href="#login" onclick="openForm('login')">Login</a></li>
-                      <li><a class="dropdown-item" href="#signup" onclick="openForm('signup')">Signup</a></li>
-                    </ul>
-                  </div>
+        <div class="dropdown">
+            <!-- Profile Icon -->
+            <a href="#" class="profile-icon" id="profileDropdown" onclick="toggleDropdown()">
+                <i class="fas fa-user-circle"></i>
+            </a>
+
+            <!-- Dropdown Menu -->
+            <ul class="dropdown-menu" id="dropdownMenu">
+                <li><a href="#login" onclick="openForm('login')">Login</a></li>
+                <li><a href="#signup" onclick="openForm('signup')">Signup</a></li>
+            </ul>
+        </div>
+
 
             <!-- Login Form -->
         <div class="form-popup" id="loginForm">
@@ -472,6 +473,7 @@ <h2 class="footer-title secondary-title mt-2">Connect with us</h2>
     <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
+    <script src="profiledropdown.js"></script>
 </body>
 
 </html>