Skip to content

Commit

Permalink
Merge pull request #28 from Anshikapal05/main
Browse files Browse the repository at this point in the history 
Added Restaurant Subscription Plans for Regular Users
  • Loading branch information
@Yorichiiii22
Yorichiiii22 authored Oct 29, 2024
2 parents 607037e + 1a9b1c6 commit e89add0
Show file tree
Hide file tree
Showing 2 changed files with 204 additions and 0 deletions.
66 changes: 66 additions & 0 deletions Project Food Menu/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@
<li><a href="#about block">About</a></li>
<li><a href="#food">Category</a></li>
<li><a href="#food-menu">Menu</a></li>
<li><a href="#subscriptions">Subscription</a></li>
<li><a href="#testimonials">Testimonial</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
Expand Down Expand Up @@ -199,6 +200,71 @@ <h2 class="food-titile">Pav Bhaji</h2>
</div>
</div>
</section>



<section id="subscriptions" >
<div class="subscriptions-container container ">
<div class="subscriptions-item">
<h1 class="subscriptions-heading" >Retaurant Subscription Plans</h1>
<p class="subscriptions-para"><b>Exclusive Perks for True Food Enthusiasts!</b><br> "Join our culinary community and enjoy access to chef’s specials, members-only discounts, and priority reservations for new menu tastings. Don’t miss out on exclusive, delectable dishes crafted just for you, delivered fresh to your table each month! Choose the perfect dining plan to satisfy your cravings and elevate your dining experience!"
</p>

<div class="plans-container">
<img src="https://images.unsplash.com/photo-1623855244069-3594654e5e42?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="Food" class="foods-img" />
<!-- Basic Plan -->
<div class="plan">
<h3 class="basic">Basic Plan</h3>
<p>Rs 500/Month</p>
<ul>
<li>2 Exclusive Meals Per Month</li>
<li>10% Discount on All Menu Items</li>
<li>Complimentary Drink with Each Visit</li>
<li>Priority Reservations</li>
</ul>
<!-- <button class="btn-style" onclick="subscribe('Basic')">Subscribe Now</button> -->
<a
class="btn btn-primary"
target="blank"
>Subscribe!</a>
</div>

<!-- Premium Plan -->
<div class="plan">
<h3 class="premium">Premium Plan</h3>
<p>Rs 1000 / Month</p>
<ul>
<li>5 Exclusive Meals Per Month</li>
<li>20% Discount on All Menu Items</li>
<li>Complimentary Dessert with Each Meal</li>
<li>VIP Priority Reservations & Early Access to Special Events</li>
</ul>
<a
class="btn btn-primary"
target="blank"
>Subscribe!</a>
</div>
<!-- Elite Plan -->
<div class="plan">
<h3 class="elite">Elite Plan</h3>
<p>Rs 1500 / Month</p>
<ul>
<li>Unlimited Monthly Meals</li>
<li>30% Discount on All Menu Items</li>
<li>Access to Seasonal Menus & Exclusive Dishes</li>
<li>VIP Reservations Anytime + Exclusive Event Invitations</li>
</ul>
<a
class="btn btn-primary"
target="blank"
>Subscribe!</a>
</div>
<img src="https://images.unsplash.com/photo-1659603748049-b9f873682834?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="Food" class="foods-img" />
</div>
</div>
</div>
</section>

<section id="testimonials" class="block">
<h2 class="testimonial-title">What Our Customers Say</h2>
<div class="testimonial-container container swiper">
Expand Down
138 changes: 138 additions & 0 deletions Project Food Menu/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -335,6 +335,144 @@ body {
font-weight: 700;
}

/*......./Subscriptions/........*/

#subscriptions{
margin: 0;
padding: 0;
text-align: center;
background-color: #ffffff;
}
.subscriptions-heading{
margin-top: 50px;
text-align: center;
font-size: 2.2rem;
font-weight: bold;
}
.subscriptions-para{
margin: 10px;
text-align: center;
font-size: 1rem;
}
.plans-container {
display: flex;
justify-content: center;
gap: 10px;
margin-top: 30px;
/* flex-wrap: wrap; */
}
.foods-img {
width: 200px;
height: auto;
border-radius: 15px;
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.foods-img:hover {
transform: scale(1.1);
}
.plan {
background-color: #fff;
border-radius: 10px;
/* padding: 10px; */
height: 380px;
width: 700px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}
.plan:hover {
transform: translateY(-10px);
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.plan h3.basic {
font-size: 1.8rem;
font-weight: bold;
margin: 10px;
color: #444;
}

.plan h3.premium {
font-size: 1.8rem;
font-weight: bold;
margin: 10px;
color: #8f8f8f;
}

.plan h3.elite {
font-size: 1.8rem;
font-weight: bold;
margin: 10px;
color: #cfaa59;
}

.plan p {
font-size: 1.2rem;
margin: 10px;
margin-bottom: 20px;
}

.plan ul {
list-style: none;
font-size: 1rem;
padding: 0;
}

.plan ul li {
margin-bottom: 10px;
font-size: 0.9rem;
}
/* Responsive Styles */
@media (max-width: 768px) {
.plans-container {
flex-direction: column; /* Stack plans vertically */
align-items: center;
}

.plan {
width: 80%;
margin: 15px 0;
}

.subscriptions-heading {
font-size: 1.8rem;
}

.subscriptions-para {
font-size: 0.9rem;
}

.plan h3 {
font-size: 1.5rem;
}

.plan p {
font-size: 1rem;
}

.plan ul li {
font-size: 0.85rem;
}
}

@media (max-width: 480px) {
.subscriptions-heading {
font-size: 1.5rem;
}

.plan h3 {
font-size: 1.3rem;
}

.plan p {
font-size: 0.9rem;
}

.plan ul li {
font-size: 0.8rem;
}
}

/* ........./ Testimonial /.......... */

#testimonials {
Expand Down

0 comments on commit e89add0

Please sign in to comment.