Skip to content

Commit

Permalink
Merge pull request #1 from aryad14/minor-fixes
Browse files Browse the repository at this point in the history 
[Refactor] change in links and styling
  • Loading branch information
@aryad14
aryad14 authored Sep 29, 2023
2 parents 8b327c9 + b638ca1 commit e094668
Show file tree
Hide file tree
Showing 5 changed files with 159 additions and 155 deletions.
241 changes: 119 additions & 122 deletions css/index.css
View file
Original file line number Diff line number Diff line change
@@ -1,123 +1,120 @@
* {
margin: 0;
padding: 0;
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

nav {
background-color: #aa5040;
padding: 10px;
}

#navbar {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20px;
}

#navbar h2 {
margin: 0;
}

#navbar ul {
list-style-type: none;
display: flex;
margin-left: auto;
}

#navbar ul li {
margin-left: 10px;
}

#navbar ul li a {
text-decoration: none;
color: #333;
}

.welcome {
background-color: #ffffff;
padding: 20px;
text-align: center;
}

.search {
text-align: center;
padding: 20px;
}

.search input[type="text"] {
padding: 10px;
width: 190px;
border-radius: 10px;
}

.search button[type="submit"] {
padding: 10px 20px;
background-color: #333;
color: #fff;
border: none;
cursor: pointer;
border-radius: 10px;
}

/* Featured books section styles */
.featured-books {
padding: 20px;
overflow: hidden;
}

.featured-books h2 {
margin-bottom: 10px;
padding: 10px;
}

.img1 {
width: 150px;
display: flex;
}

.img1 img {
width: 100%;
padding: 10px;
float: left;
box-sizing: border-box;
}

/* Footer styles */
footer {
background-color: #aa5040;
padding: 10px;
text-align: center;
}

.contact-info p {
margin-bottom: 10px;
}

.static-pages ul {
list-style-type: none;
}

.static-pages ul li {
display: inline;
margin-right: 10px;
}

.static-pages ul li a {
text-decoration: none;
color: #333;
}

.i1 {
float: left;
}

.i2 {
float: left;
}

.i3 {
float: left;
}

margin: 0;
padding: 0;
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

:root {
--primary-color: #aa5040;
--text-color-light: #ededed;
}

header {
background-color: var(--primary-color);
padding: 10px;
}

#navbar {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20px;
}

#navbar h2 {
margin: 0;
}

#navbar ul {
list-style-type: none;
display: flex;
margin-left: auto;
}

#navbar ul li {
margin-left: 16px;
}

#navbar ul li a {
text-decoration: none;
color: var(--text-color-light);
}

.welcome {
background-color: var(--text-color-light);
padding: 20px;
text-align: center;
}

.search {
text-align: center;
padding: 20px;
}

.search input[type="text"] {
padding: 10px;
width: 190px;
border-radius: 10px;
}

.search button[type="submit"] {
padding: 10px 20px;
background-color: #333;
color: var(--text-color-light);
border: none;
cursor: pointer;
border-radius: 10px;
}

/* Featured books section styles */
.featured-books {
padding: 20px;
overflow: hidden;
}

.featured-books h2 {
margin-bottom: 10px;
padding: 10px;
}

.img1 {
width: 150px;
display: flex;
}

.img1 img {
width: 100%;
padding: 10px;
float: left;
box-sizing: border-box;
}

/* Footer styles */
footer {
background-color: var(--primary-color);
padding: 10px;
text-align: center;
}

.contact-info p {
margin-bottom: 10px;
color: var(--text-color-light);
}

.static-pages ul {
list-style-type: none;
}

.static-pages ul li {
display: inline;
margin-right: 10px;
}

.static-pages ul li a {
text-decoration: none;
color: var(--text-color-light);
}

.book-img {
float: left;
}
61 changes: 34 additions & 27 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,54 +1,61 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>E-Library</title>
<link rel="stylesheet" type="text/css" href="./css/index.css">
<link rel="stylesheet" href="./css/index.css">
</head>

<body>
<nav>
<header>
<div id="navbar">
<h2>E-Library</h2>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="books.html">Books</a></li>
<li><a href="./html/login.html">Log In</a></li>
<li><a href="./html/about-us.html">About Us</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="pages/books.html">Books</a></li>
<li><a href="pages/login.html">Log In</a></li>
<li><a href="pages/about-us.html">About Us</a></li>
<li><a href="pages/contact.html">Contact</a></li>
</ul>
</div>
</nav>
</header>

<div class="welcome">
<h1>Welcome to the E-Library</h1>
<p>A brief introduction to the e-library.</p>
</div>
<main>
<div class="welcome">
<h1>Welcome to the E-Library</h1>
<p>A brief introduction to the e-library.</p>
</div>

<div class="search">
<input type="text" placeholder="Search for books">
<div class="search">
<input type="text" placeholder="Search for books">
<button type="submit">Search</button>
</div>

<section class="featured-books">
<h2>Featured Books</h2>
<div class="img1">
<img class="i1" src="./static/book1.jpeg" >
<img class="i2" src="./static/book2.jpeg" >
<img class="i3" src="./static/book3.jpeg" >
</div>
</section>

<section class="featured-books">
<h2>Featured Books</h2>
<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>

<footer>
<div class="contact-info">
<p>Contact information</p>
</div>
<div class="static-pages">
<ul>
<li><a href="about.html">About Us</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="privacy.html">Privacy Policy</a></li>
<li><a href="terms.html">Terms of Service</a></li>
<li><a href="pages/about.html">About Us</a></li>
<li><a href="pages/contact.html">Contact</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>
12 changes: 6 additions & 6 deletions js/navbar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,27 +2,27 @@ window.addEventListener('DOMContentLoaded', () => {
const navbarDiv = document.getElementById('navbar');
const nav = document.createElement('nav');
nav.style.backgroundColor = '#aa5040';
nav.style.padding = '10px';
nav.style.padding = '10px';

nav.innerHTML = `
<ul style="display: flex; justify-content: space-between; align-items: center;">
<li>
<strong style="font-weight: bold;">E-library</strong>
</li>
<li style="display: inline; margin-left: auto;">
<a href="../index.html" style="text-decoration: none; color: #333;">Home</a>
<a href="../index.html" class="nav-link">Home</a>
</li>
<li style="display: inline; margin-left: 10px;">
<a href="books.html" style="text-decoration: none; color: #333;">Books</a>
<a href="books.html" class="nav-link">Books</a>
</li>
<li style="display: inline; margin-left: 10px;">
<a href="login.html" style="text-decoration: none; color: #333;">Log In</a>
<a href="about-us.html" class="nav-link">About Us</a>
</li>
<li style="display: inline; margin-left: 10px;">
<a href="about-us.html" style="text-decoration: none; color: #333;">About Us</a>
<a href="contact.html" class="nav-link">Contact</a>
</li>
<li style="display: inline; margin-left: 10px;">
<a href="contact.html" style="text-decoration: none; color: #333;">Contact</a>
<a href="login.html" class="nav-link">Log In</a>
</li>
</ul>
`;
Expand Down
0 html/about-us.html → pages/about-us.html
View file
File renamed without changes.
0 html/login.html → pages/login.html
View file
File renamed without changes.

0 comments on commit e094668

Please sign in to comment.