Skip to content

Commit

Permalink
added same styling in index.html
Browse files Browse the repository at this point in the history
  • Loading branch information
@Mehak-Mattoo
Mehak-Mattoo committed Jun 27, 2024
1 parent 5aedfa2 commit 64cf6e1
Show file tree
Hide file tree
Showing 4 changed files with 645 additions and 503 deletions.
72 changes: 35 additions & 37 deletions Home.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,14 +24,14 @@ <h1>FoodDsy</h1>
<li><a href="contactus.html">CONTACT US</a></li>
</ul>

<button class="b"><a href="index.html" class="login-btn">Logout</a></button>
<button class="b"><a href="index.html" class="login-btn">Log Out</a></button>
<!-- End of login button -->
<div class="icons">
<!-- <i class="fa-solid fa-user"></i> -->
<!-- <i class="fa-solid fa-person"></i>
-->
<i class="fa-regular fa-user"></i>
<i class="fa-solid fa-bag-shopping">
<i class="fa-regular fa-user" style="color: white;"></i>
<i class="fa-solid fa-bag-shopping" style="color: white;">
<!-- <i id="bar" class="fa-solid fa-cart-shopping"></i> -->
<span>0</span>
</i>
Expand Down Expand Up @@ -67,6 +67,8 @@ <h1>FoodDsy </h1>
<div id="food">
<div class="head">
<h1>What we offer</h1>
<p>Our culinary artisans craft each meal with passion and precision, sourcing only the freshest, locally-sourced ingredients to tantalize your taste buds. </p>

</div>


Expand Down Expand Up @@ -165,56 +167,51 @@ <h1>Our Gallery</h1>
</div> -->

<h1>Our Gallery</h1>
<div id="carouselExampleCaptions" class="carousel slide">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="3" aria-label="Slide 4"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="4" aria-label="Slide 5"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="./assets/images/alex-haney-CAhjZmVk5H4-unsplash.jpg" class="d-block w-100" alt="...">
<div class="carousel-caption d-none d-md-block">

<div class="carousel-item active">
<img src="./assets/images/alex-haney-CAhjZmVk5H4-unsplash.jpg" class="d-block w-100 carousel-img" alt="...">
<div class="carousel-caption d-none d-md-block"></div>
</div>
</div>
<div class="carousel-item">
<img src="./assets/images/dewi-ika-putri-ZDD7O-grjBo-unsplash.jpg" class="d-block w-100" alt="...">
<div class="carousel-caption d-none d-md-block">

<div class="carousel-item">
<img src="./assets/images/dewi-ika-putri-ZDD7O-grjBo-unsplash.jpg" class="d-block w-100 carousel-img" alt="...">
<div class="carousel-caption d-none d-md-block"></div>
</div>
</div>
<div class="carousel-item">
<img src="./assets/images/piotr-szulawski-DCmUhk54F6M-unsplash.jpg" class="d-block w-100" alt="...">
<div class="carousel-caption d-none d-md-block">

<div class="carousel-item">
<img src="./assets/images/piotr-szulawski-DCmUhk54F6M-unsplash.jpg" class="d-block w-100 carousel-img" alt="...">
<div class="carousel-caption d-none d-md-block"></div>
</div>
</div>
<div class="carousel-item">
<img src="./assets/images/caglar-araz-n_tX6yYBVjc-unsplash.jpg" class="d-block w-100" alt="...">
<div class="carousel-caption d-none d-md-block">

<div class="carousel-item">
<img src="./assets/images/caglar-araz-n_tX6yYBVjc-unsplash.jpg" class="d-block w-100 carousel-img" alt="...">
<div class="carousel-caption d-none d-md-block"></div>
</div>
</div>
<div class="carousel-item">
<img src="./assets/images/dave-photoz-Ksrmm0EHdgw-unsplash.jpg" class="d-block w-100" alt="...">
<div class="carousel-caption d-none d-md-block">

<div class="carousel-item">
<img src="./assets/images/dave-photoz-Ksrmm0EHdgw-unsplash.jpg" class="d-block w-100 carousel-img" alt="...">
<div class="carousel-caption d-none d-md-block"></div>
</div>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>

</div>

<div class="map">

<section id="contact-detail" class="section-p1">
<div class="detail">
<i class="far fa-clock"></i>
Expand Down Expand Up @@ -242,6 +239,7 @@ <h3>Open till 2.00 am on weekends</h3>
</div>

</section>
</div>

<footer>
<div class="container1">
Expand Down
71 changes: 57 additions & 14 deletions assets/css/Home.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,12 +29,9 @@ body {

.main {
display: flex;
/* justify-content: space-around; */
background: var(--beige);
color: white;
height: 95vh;
/* clip-path: polygon(0 0, 100% 0, 100% 99%, 27% 78%, 47% 78%, 0 100%, 0 66%); */
/* clip-path: polygon(0 0, 100% 0, 100% 68%, 27% 78%, 27% 78%, 0 100%, 0 66%); */
height: fit-content;
}

.mainText {
Expand Down Expand Up @@ -71,6 +68,7 @@ nav {
position: relative;
justify-content: space-around;
align-items: center;

/* position: fixed; */
top: 0%;
width: 100%;
Expand All @@ -80,6 +78,37 @@ nav {
/* box-shadow: 1px 3px 3px 3px rgb(216, 216, 216); */
}

.b {
font-size: 0.5rem;
padding: 0.3rem 0.7rem;
border-radius: 1rem;
}

#gallery h1 {
text-align: center;
background: var(--beige);
color: var(--brown);
}

#gallery {
background: var(--beige);
padding: 4rem;
}

.carousel-inner {
height: 500px; /* Adjust this value as needed */
}

.carousel-item {
height: 100%;
}

.carousel-img {
height: 100%;
width: 100%;
object-fit: cover; /* Ensures the image covers the entire area */
}

.head h1 {
color: var(--beige);
background: var(--brown);
Expand All @@ -88,15 +117,30 @@ nav {
font-style: normal;
}

.head p {
color: var(--beige);
letter-spacing: 1px;
}

.foodCard,
#food {
background: var(--brown);
padding-bottom: 2rem;
}

nav ul li a {
color: white;
font-size: 1rem;
}

.carousel-inner .carousel-item img {
width: 10rem;
}

.map {
background: var(--brown);
padding-bottom: 3rem;
}
/* mehak end */

.mainLode {
Expand Down Expand Up @@ -190,9 +234,9 @@ ul li a {
background-color: #f19a16;
color: white;
border: none;
padding: 10px;
margin-bottom: 1rem;

width: fit-content;
/* padding: 10px; */
/* margin-bottom: 1rem; */
cursor: pointer;
transition: background-color 0.3s, transform 0.3s;
}
Expand Down Expand Up @@ -229,6 +273,7 @@ ul li a {
.gallery {
display: flex;
flex-wrap: wrap;
background: var(--beige);
justify-content: center;
flex-wrap: wrap;
}
Expand Down Expand Up @@ -277,7 +322,6 @@ footer {
/* border-top-left-radius: 100px; */
position: relative;
width: 100%;
margin-top: 100px;
}

footer * {
Expand Down Expand Up @@ -586,15 +630,14 @@ body.showCart .carTab {
}

#contact-detail {
background-color: #e9d6d6;
border: 2px solid black;
margin-left: 120px;
/* background-color: #e9d6d6; */

color: white;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 100px;
width: 1200px;
padding: 20px;

padding: 4rem;
}
#contact-detail .detail {
width: 40%;
Expand Down
Loading

0 comments on commit 64cf6e1

Please sign in to comment.