diff --git a/Food Order Website/images/OIP.jpeg b/Food Order Website/images/OIP.jpeg new file mode 100644 index 0000000..28a531b Binary files /dev/null and b/Food Order Website/images/OIP.jpeg differ diff --git a/Food Order Website/index.html b/Food Order Website/index.html new file mode 100644 index 0000000..e6d08ad --- /dev/null +++ b/Food Order Website/index.html @@ -0,0 +1,59 @@ + + + + + + Foodie + + + + + +
+
Welcome to Foodie !
+
You Order, We Serve
+
+
+ +
+ +

Foodie is a prominent restaurant in your locality and is renowned for its excellence in quality, flavor, service, and atmosphere. We take pride in bringing you the authentic flavors of India, with a diverse menu that spans from Chinese to Continental, North Indian to South Indian, and Punjabi to Gujarati cuisines.We also offer home delivery within 10 Kms distance

+
+ +
Explore Different Cusines
+
+ + + + + + +
+ +
Best Seller Food Items
+ +
+

Veg Farmhouse Pizza

+ +

Cheese Burger

+ +

Paneer Dosa

+ + +
+
Best Deals on Food Orders
+
+

Get Flat 20% Cashback on orders above Rs 999

+

Exclusive 10% off on Special Veg Thaali

+
+
+ + \ No newline at end of file diff --git a/Food Order Website/styles.css b/Food Order Website/styles.css new file mode 100644 index 0000000..be25f61 --- /dev/null +++ b/Food Order Website/styles.css @@ -0,0 +1,253 @@ +body{ + height:100%; + background: linear-gradient(white,lightyellow); + height:100vh; +} +nav li{ + padding: 0 15px; + display: flex; + list-style: none; + align-items: center; +} + +nav{ + display: flex; + background-color: #FA7C7C; + border-radius: 30px; +} + +.navbar li, a{ + float:left; + margin:0px 10px; + text-decoration: none; + color: white; + font-size: 20px; +} + +nav ul li a:hover{ + color:lightyellow; + text-decoration: underline; + font-weight: bolder; + text-align: center; + justify-content: center; + padding: 5px; +} + +#search{ + float: right; + border: 2px solid #FA7C7C; + color: black; + font-size: large; + padding: 10px solid black; +} + +.heading{ + font-size: 3.5rem; + font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; + font-family: 'Lucida Handwriting', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; + display: flex; + color: #FA7C7C; + text-align: center; + justify-content: center; + flex-direction: column; + text-transform: uppercase; +} + +#sub{ + color:#00FF66; +} + +#main{ + width: 60%; + +} + +.container{ + display: flex; + justify-content: flex-start; + align-items:center; + padding:100px; + gap:40px; + scroll-behavior: smooth; +} + +.text{ + font-size: xx-large; + font-family: garamond; + color: orange; +} + +.food-images{ + display:flex; + flex-direction: row; + gap:10px; + flex-wrap: wrap; + align-items: center; + margin-top: 40px; + margin-left: 0%; +} + +#pizza,#burger,#chinese,#indian-street-food,#south-indian{ + width:17%; + height:40vh; + border-radius:50%; +} +#pizza:hover,#burger:hover,#chinese:hover,#indian-street-food:hover,#south-indian:hover{ + transform: scale(1.1); +} + +#arrow{ + width:10%; + height:30px; +} +#arrow:hover{ + transform: scale(1.1); +} + +#best-seller-heading, #food-items-heading,#offers-heading{ + margin-top:40px; + padding:10px; + background-color: #00FF66; +} + +.best-seller-items{ + display: flex; + flex-direction: row; + gap:3%; + align-items: center; + justify-content: center; + margin-top: 20px; + + + +} + +#BSI1,#BSI2,#BSI3{ + padding: 20px; + background-color: #D9D9D9; + width: 25%; + height: 450px; +} + +.BSI-images{ + width:100%; + height: 300px; +} +.BSI-text{ + text-align: center; + font-size: 2rem; + font-weight: bold; + color:#FA7C7C; +} + +.Order-Now{ + display: flex; + align-items:center; + justify-content: center; + width: 80%; + font-size: 2rem; + margin-left: 10%; +} +.Order-Now:hover{ + background-color: lightyellow; + color: #FA7C7C; +} + +.offers{ + display: flex; + flex-direction: row; + gap:40px; + justify-content: space-around; + margin:40px; +} + +.offers-text{ + font-size: 2rem; + text-align: center; + font-weight: bold; + color:#FA7C7C; +} + +#offer1,#offer2{ + width:40%; + height:20vh; + padding:50px; + background-color: #D9D9D9; +} + +.offer-btn{ + display: flex; + text-align: center; + font-size: 2rem; + align-items:center; + flex-direction: row; + margin-left: 35%; +} + +.offer-btn:hover{ + background-color: lightyellow; + color: #FA7C7C; +} + + +/* Responsiveness Code */ +@media only screen and (max-width:600px){ + .heading{ + font-size: 2rem; + } + + .container{ + flex-direction: column; + gap:10px; + padding:0px; + justify-content: flex-start; + align-items: flex-start; + + } + .text{ + font-size: x-large; + } + #main{ + width:100%; + } + + #pizza,#burger,#chinese,#indian-street-food,#south-indian{ + width:15%; + height:20vh; + border-radius:50%; + } + /* .best-seller-items{ + height: 20vh; + } */ + #BSI1,#BSI2,#BSI3{ + height:100%; + + } + .BSI-images{ + height:30vh; + width: 100%; + } + .BSI-text{ + font-size: x-large; + } + .Order-Now{ + font-size: large; + } + .offers{ + flex-direction: column; + } + #offer1,#offer2{ + width:80%; + margin-left: 0; + height:20vh; + padding:20px; + background-color: #D9D9D9; + } + .offers-text{ + font-size: x-large; + } + .offer-btn{ + font-size: x-large; + margin-left: 25%; + } +} \ No newline at end of file diff --git a/index.html b/index.html index 3fd85e0..815dc3c 100644 --- a/index.html +++ b/index.html @@ -260,6 +260,28 @@

+ +
+
+

Foodie

+

+ + Anirudh Garg +

+
+ +
+
+
+

Headphones Website

@@ -381,6 +403,7 @@

+>>>>>>> upstream/main