Save local changes before cherry-pick

Ctoic · Oct 14, 2024 · 42c09fc · 42c09fc
1 parent 435f2ac
commit 42c09fc
Show file tree

Hide file tree

Showing 4 changed files with 114 additions and 34 deletions.
diff --git a/adventures.html b/adventures.html
@@ -177,15 +177,6 @@ <h1 class="modal-title fs-5" id="exampleModalToggleLabel">
               </a>
             </div>
           </div>
-          <!-- <div class="modal-footer">
-            <button
-              class="btn btn-primary"
-              data-bs-target="#exampleModalToggle2"
-              data-bs-toggle="modal"
-            >
-              Open second modal
-            </button>
-          </div> -->
         </div>
       </div>
     </div>

diff --git a/faq.html b/faq.html
@@ -17,20 +17,16 @@
     />
     <title>My Favorite Books Music App</title>
   </head>
-
   <body
     class="dark-theme bg-gray-900 text-gray-300 d-flex flex-column min-vh-100"
   >
     <!-- Navbar -->
     <div id="header-placeholder" class="sticky top-0 z-20"></div>
-
     <main>
       <h1>FAQs</h1>
     </main>
-
     <!-- Footer -->
     <div id="footer-placeholder" class="mt-auto"></div>
-
     <!-- JavaScript -->
     <script src="./script.js"></script>
     <script

diff --git a/pages/footer.html b/pages/footer.html
@@ -1,4 +1,97 @@
 <!-- Footer -->
-<footer class="bg-gray-900 p-4 text-center mt-10">
+
+<div class="container border-top" style="margin-top: 80px">
+  <footer
+    class="row row-cols-1 row-cols-sm-2 row-cols-md-4 justify-between py-3 mt-5 pb-5 g-4"
+  >
+    <div class="col mb-3">
+      <div class="d-inline-flex align-items-center">
+        <a
+          href="./index.html"
+          class="mb-3 link-body-emphasis text-decoration-none"
+        >
+          <img
+            src="./Images/lisbook-logo-1.png"
+            alt="Lisbook Logo"
+            srcset=""
+            class="me-0"
+            width="100"
+          />
+        </a>
+        <p class="footer-logo-text h1 fw-bold ms-3">Lisbook</p>
+      </div>
+      <p>
+        LisBook is a straightforward audiobook player designed for simplicity
+        and ease of use.
+      </p>
+    </div>
+
+    <div class="col mb-3">
+      <h5 class="fw-bold h5 mb-3 text-uppercase footer-col-title">
+        Important Link
+      </h5>
+      <ul class="nav flex-column ms-2">
+        <li class="nav-item mb-2">
+          <a href="index.html" class="p-0">Home</a>
+        </li>
+        <li class="nav-item mb-2">
+          <a href="about.html" class="p-0">About</a>
+        </li>
+        <li class="nav-item mb-2">
+          <a href="contact.html" class="p-0">Contact</a>
+        </li>
+        <li class="nav-item mb-2">
+          <a href="faq.html" class="p-0">FAQs</a>
+        </li>
+      </ul>
+    </div>
+
+    <div class="col mb-3">
+      <h5 class="fw-bold h5 mb-3 text-uppercase footer-col-title">Features</h5>
+      <ul class="nav flex-column ms-2">
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0">Play/Pause</a>
+        </li>
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0">Skip Chapters</a>
+        </li>
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0">Change Speed</a>
+        </li>
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0">Change Volume</a>
+        </li>
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0">Change Theme</a>
+        </li>
+      </ul>
+    </div>
+
+    <div class="col mb-3">
+      <h5 class="fw-bold h5 mb-3 text-uppercase footer-col-title">Follow Us</h5>
+      <ul class="nav flex-column ms-2">
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0"
+            ><i class="bi bi-facebook me-2"></i> Facebook</a
+          >
+        </li>
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0"
+            ><i class="bi bi-twitter-x me-2"></i> Twitter-X</a
+          >
+        </li>
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0"
+            ><i class="bi bi-linkedin me-2"></i> LinkedIn</a
+          >
+        </li>
+        <li class="nav-item mb-2">
+          <a href="#" class="p-0"><i class="bi bi-github me-2"></i> GitHub</a>
+        </li>
+      </ul>
+    </div>
+  </footer>
+</div>
+<div class="bg-gray-900 p-4 text-center">
   <div class="text-gray-500">&copy; 2024 Lisbook | All Rights Reserved</div>
-</footer>
+</div>
diff --git a/script.js b/script.js
@@ -267,24 +267,24 @@ document.addEventListener("DOMContentLoaded", function () {
       menu.classList.remove("scale-100");
     });
   }
-});
 
-// Function to load an HTML file into an element
-function loadHTML(file, elementId) {
-  fetch(file)
-    .then((response) => {
-      if (!response.ok)
-        throw new Error("Erreur lors du chargement du fichier " + file);
-      return response.text();
-    })
-    .then((data) => {
-      document.getElementById(elementId).innerHTML = data;
-    })
-    .catch((error) => console.error(error));
-}
-
-// Load header and footer
-document.addEventListener("DOMContentLoaded", function () {
-  loadHTML("./pages/header.html", "header-placeholder");
-  loadHTML("./pages/footer.html", "footer-placeholder");
+  // Function to load an HTML file into an element
+  function loadHTML(file, elementId) {
+    fetch(file)
+      .then((response) => {
+        if (!response.ok)
+          throw new Error("Erreur lors du chargement du fichier " + file);
+        return response.text();
+      })
+      .then((data) => {
+        document.getElementById(elementId).innerHTML = data;
+      })
+      .catch((error) => console.error(error));
+  }
+
+  // Load header and footer
+  document.addEventListener("DOMContentLoaded", function () {
+    loadHTML("./pages/header.html", "header-placeholder");
+    loadHTML("./pages/footer.html", "footer-placeholder");
+  });
 });