Merge pull request #27 from mlscgescoe/revert-26-main

Revert "made some changes in HTML and CSS"

css/index.css

@@ -16,42 +16,38 @@
 
 .search input[type="text"] {
   padding: 10px;
-  width: 250px; 
+  width: 190px;
   border-radius: 10px;
-  border: 1px solid var(--primary-color); 
 }
 
 .search button[type="submit"] {
   padding: 10px 20px;
-  background-color: var(--primary-color); 
+  background-color: #333;
   color: var(--text-color-light);
   border: none;
   cursor: pointer;
   border-radius: 10px;
-  margin-left: 10px; 
 }
 
-
+/* Featured books section styles */
 .featured-books {
   padding: 20px;
   overflow: hidden;
-  text-align: center;
 }
 
 .featured-books h2 {
   margin-bottom: 10px;
   padding: 10px;
 }
 
-.img-container {
-  display: flex; 
-  justify-content: space-around; 
+.img1 {
+  width: 150px;
+  display: flex;
 }
 
-.img-container img {
-  width: 100px; 
+.img1 img {
+  width: 100%;
   padding: 10px;
+  float: left;
   box-sizing: border-box;
-  border: 1px solid #ddd; 
-  border-radius: 5px;
 }

index.html

@@ -14,11 +14,11 @@
     <div id="navbar">
       <h2 class="site-name">E-Library</h2>
       <ul class="navbar-links">
-        <li class="nav-links"><a href="/">Home</a></li>
-        <li class="nav-links"><a href="./pages/books.html">Books</a></li>
-        <li class="nav-links"><a href="./pages/login.html">Log In</a></li>
-        <li class="nav-links"><a href="./pages/about-us.html">About Us</a></li>
-        <li class="nav-links"><a href="./pages/contact.html">Contact Us</a></li>
+      <li class="nav-links"><a href="/">Home</a></li>
+      <li class="nav-links"><a href="./pages/books.html">Books</a></li>
+      <li class="nav-links"><a href="./pages/login.html">Log In</a></li>
+      <li class="nav-links"><a href="./pages/about-us.html">About Us</a></li>
+      <li class="nav-links"><a href="./pages/contact.html">Contact Us</a></li>
       </ul>
     </div>
   </header>
@@ -31,15 +31,15 @@ <h1>Welcome to the E-Library</h1>
 
     <div class="search">
       <input type="text" placeholder="Search for books">
-      <button type="submit">Search</button>
+    <button type="submit">Search</button>
     </div>
 
     <section class="featured-books">
       <h2>Featured Books</h2>
-      <div class="img-container">
-        <img class="book-img" src="./static/book1.jpeg" alt="Book 1">
-        <img class="book-img" src="./static/book2.jpeg" alt="Book 2">
-        <img class="book-img" src="./static/book3.jpeg" alt="Book 3">
+      <div class="img1">
+        <img class="book-img" src="static/book1.jpeg">
+        <img class="book-img" src="static/book2.jpeg">
+        <img class="book-img" src="static/book3.jpeg">
       </div>
     </section>
   </main>
@@ -50,13 +50,13 @@ <h2>Featured Books</h2>
     </div>
     <div class="static-pages">
       <ul>
-        <li><a href="./pages/about-us.html">About Us</a></li>
-        <li><a href="./pages/contact.html">Contact Us</a></li>
-        <li><a href="./pages/privacy.html">Privacy Policy</a></li>
-        <li><a href="./pages/terms.html">Terms of Service</a></li>
+        <li><a href="pages/about-us.html">About Us</a></li>
+        <li><a href="pages/contact.html">Contact Us</a></li>
+        <li><a href="pages/privacy.html">Privacy Policy</a></li>
+        <li><a href="pages/terms.html">Terms of Service</a></li>
       </ul>
     </div>
   </footer>
 </body>
 
-</html>
+</html>