diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 0000000..dfe0770 --- /dev/null +++ b/.gitattributes @@ -0,0 +1,2 @@ +# Auto detect text files and perform LF normalization +* text=auto diff --git a/beverages-butterscotch-milkshake.jfif b/beverages-butterscotch-milkshake.jfif new file mode 100644 index 0000000..e09db91 Binary files /dev/null and b/beverages-butterscotch-milkshake.jfif differ diff --git a/beverages-chocolate-milkshake.jfif b/beverages-chocolate-milkshake.jfif new file mode 100644 index 0000000..96b3eaf Binary files /dev/null and b/beverages-chocolate-milkshake.jfif differ diff --git a/beverages-cold-coffee.jfif b/beverages-cold-coffee.jfif new file mode 100644 index 0000000..c40ab45 Binary files /dev/null and b/beverages-cold-coffee.jfif differ diff --git a/beverages-iced-tea.jfif b/beverages-iced-tea.jfif new file mode 100644 index 0000000..95f0e13 Binary files /dev/null and b/beverages-iced-tea.jfif differ diff --git a/beverages-lemonade.jfif b/beverages-lemonade.jfif new file mode 100644 index 0000000..6994261 Binary files /dev/null and b/beverages-lemonade.jfif differ diff --git a/beverages-mojito.jfif b/beverages-mojito.jfif new file mode 100644 index 0000000..76434ee Binary files /dev/null and b/beverages-mojito.jfif differ diff --git a/beverages-oreo-milkshake.jfif b/beverages-oreo-milkshake.jfif new file mode 100644 index 0000000..65e4155 Binary files /dev/null and b/beverages-oreo-milkshake.jfif differ diff --git a/beverages-strawberry-milkshake.jfif b/beverages-strawberry-milkshake.jfif new file mode 100644 index 0000000..a0689db Binary files /dev/null and b/beverages-strawberry-milkshake.jfif differ diff --git a/beverages.jfif b/beverages.jfif new file mode 100644 index 0000000..8aadee5 Binary files /dev/null and b/beverages.jfif differ diff --git a/bg-img1.jpg b/bg-img1.jpg new file mode 100644 index 0000000..ba0fe4a Binary files /dev/null and b/bg-img1.jpg differ diff --git a/bg-img2.jpg b/bg-img2.jpg new file mode 100644 index 0000000..b4de1c0 Binary files /dev/null and b/bg-img2.jpg differ diff --git a/build-a-product-landing-page (2).txt b/build-a-product-landing-page (2).txt new file mode 100644 index 0000000..d5f792b --- /dev/null +++ b/build-a-product-landing-page (2).txt @@ -0,0 +1,1119 @@ +** start of undefined ** + + + + + + + + Quick Bite - Get your favorite meals delivered + + + + + + +
+
+
+
Delicious Meals Delivered to Your Doorstep in Minutes!
+
Be the fastest in delivering your healthy food and with us order your best food + anytime and anywhere.
+ +
+ + +
+
+
+ +
+
+ burger +
+

Burger

+
+
    +
  • + Crispy Veg Burger +
    +

    Crispy Veg Burger

    +

    ₹55

    +
    +
    • +
  • + Crispy Veg Burger with Double Patty +
    +

    Crispy Veg Burger with Double Patty

    +

    ₹85

    +
    +
    • +
  • + Crispy Veg Burger with Cheese +
    +

    Crispy Veg Burger with Cheese

    +

    ₹95

    +
    +
    • +
  • + Crispy Chicken Burger +
    +

    Crispy Chicken Burger

    +

    ₹75

    +
    +
    • +
  • + Crispy Chicken Burger with Double Patty +
    +

    Crispy Chicken Burger with Double Patty

    +

    ₹115

    +
    +
    • +
  • + Crispy Chicken Burger with Cheese +
    +

    Crispy Chicken Burger with Cheese

    +

    ₹135

    +
    +
    • +
+
+
+

Pizza

+
+
    +
  • + Margherita +
    +

    Margherita

    +

    ₹109

    +
    +
    • +
  • + Farmhouse +
    +

    Farmhouse

    +

    ₹259

    +
    +
    • +
  • + Peppy Paneer +
    +

    Peppy Paneer

    +

    ₹269

    +
    +
    • +
  • + Pepper Barbecue Chicken +
    +

    Pepper Barbecue Chicken

    +

    ₹249

    +
    +
    • +
  • + Indi Chicken Tikka +
    +

    Indi Chicken Tikka

    +

    ₹389

    +
    +
    • +
+
+ pizza + pasta +
+

Pasta

+
+
    +
  • + Americano White Sauce Pasta Veg +
    +

    Americano White Sauce Pasta Veg

    +

    ₹189

    +
    +
    • +
  • + Mexicana Red Sauce Pasta Veg +
    +

    Mexicana Red Sauce Pasta Veg

    +

    ₹189

    +
    +
    • +
  • + Indiana Pasta Veg +
    +

    Indiana Pasta Veg

    +

    ₹189

    +
    +
    • +
  • + Americano White Sauce Pasta Non-Veg +
    +

    Americano White Sauce Pasta Non-Veg

    +

    ₹212

    +
    +
    • +
  • + Indiana Pasta Non-Veg +
    +

    Indiana Pasta Non-Veg

    +

    ₹212

    +
    +
    • +
+
+
+

Fries

+
+
    +
  • + Classic French Fries +
    +

    Classic French Fries

    +

    ₹99

    +
    +
    • +
  • + Peri-Peri Fries +
    +

    Peri-Peri Fries

    +

    ₹129

    +
    +
    • +
  • + Cheese Fries +
    +

    Cheese Fries

    +

    ₹149

    +
    +
    • +
  • + Garlic Butter Fries +
    +

    Garlic Butter Fries

    +

    ₹169

    +
    +
    • +
+
+ fries + icecream +
+

Ice Cream

+
+
    +
  • + Vanilla +
    +

    Vanilla

    +

    ₹79

    +
    +
    • +
  • + Chocolate +
    +

    Chocolate

    +

    ₹89

    +
    +
    • +
  • + Strawberry +
    +

    Strawberry

    +

    ₹89

    +
    +
    • +
  • + Mango +
    +

    Mango

    +

    ₹99

    +
    +
    • +
  • + Butterscotch +
    +

    Butterscotch

    +

    ₹99

    +
    +
    • +
+
+
+

Beverages

+
+
    +
  • + Cold Coffee +
    +

    Cold Coffee

    +

    ₹99

    +
    +
    • +
  • + Chocolate Milkshake +
    +

    Chocolate Milkshake

    +

    ₹129

    +
    +
    • +
  • + Butterscotch Milkshake +
    +

    Butterscotch Milkshake

    +

    ₹139

    +
    +
    • +
  • + Oreo Milkshake +
    +

    Oreo Milkshake

    +

    ₹149

    +
    +
    • +
  • + Strawberry Milkshake +
    +

    Strawberry Milkshake

    +

    ₹129

    +
    +
    • +
+
+ beverages +
+
+
+ +
+
+ + + + + +** end of undefined ** + +** start of undefined ** + +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + scroll-behavior: smooth; +} + +html{ + font-size: 10px; +} + +body{ + font-family: 'Roboto', sans-serif; + color: #333; + line-height: 1.6; +} + +#header{ + width: 100vw; + height: 90px; + display: flex; + justify-content: space-between; + align-items: center; + position: fixed; + top: 0; + background-color: lightgray; + z-index: 10; +} + +.logo{ + width: 60%; +} + +#header-img{ + width: 100%; + height: 100%; + max-width: 150px; + padding-top: 5px; +} + +.flex{ + display: flex; +} + +.logo #product-name{ + font-size: 3.6rem; + font-family: 'Poppins', sans-serif; + font-weight: bold; + color: #333; + text-align: center; + display: flex; + align-items: center; + position: relative; + right: 25px; +} + +#nav-bar{ + width: 40%; +} + +#nav-bar ul{ + display: flex; + justify-content: space-around; + list-style: none; + padding-right: 30px; +} + +li a{ + font-size: 2.4rem; + font-family: 'Poppins', sans-serif; + color: rgba(0, 0, 0, 0.6); + text-decoration: none; + text-align: center; +} + +li a:hover{ + color: black; +} + +main{ + padding-top: 90px; + z-index: 1; +} + +#home{ + height: 85vh; + background-image: url(https://i.imgur.com/aW9JtnC.jpg); + background-size: 100% 85vh; + background-repeat: no-repeat; + position: relative; + display: flex; + justify-content: flex-start; + align-items: center; +} + +.home-wrapper{ + width: 30%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin-left: 100px; + text-align: center; + gap: 20px; +} + +.tagline{ + color: white; + font-family: 'Poppins', sans-serif; + font-size: 3rem; +} + +.sub-heading{ + font-family: 'Open Sans', sans-serif; + font-size: 1.6rem; + color: yellow; +} + +.signup-login{ + font-size: 2.4rem; + color: white; +} + +form{ + display: flex; + align-items: center; + justify-content: center; + gap: 15px; +} + +#email{ + width: 200%; + padding: 10px; + font-size: 1.6rem; + color: black; + text-align: center; + border-radius: 5px; + border: none; +} + +#submit{ + background-color: orange; + padding: 10px; + width: 100%; + font-size: 1.6rem; + border-radius: 5px; + border: none; + text-align: center; + cursor: pointer; +} + +#submit:hover{ + border: 2px solid black; + color: purple; +} + +#menu{ + padding-top: 90px; +} + +.menu-wrapper .heading{ + font-size: 3rem; + font-family: 'Poppins', sans-serif; + text-align: center; +} + +.food{ + width: 60vw; + margin: 40px auto 0; + display: grid; + grid-template-columns: 1fr 1fr 1fr; + justify-content: center; + justify-items: center; + align-items: start; + gap: 2.4rem; +} + +.food img{ + width: 18.75vw; + height: 31.25vh; + object-fit: cover; + border-radius: 60px; + margin-bottom: 1.6rem; +} + +.food .food-name{ + font-size: 2rem; + font-weight: bolder; +} + +.food .food-options{ + font-size: 1.2rem; + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; +} + +#pricing{ + padding-top: 90px; +} + +.pricing-wrapper{ + width: 80vw; + margin: 10px auto 0; + display: grid; + grid-template-columns: 1fr 1fr; + row-gap: 10rem; + grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr; +} + +.pricing-wrapper .heading{ + font-family: 'Poppins', sans-serif; + font-size: 2.8rem; + font-weight: bolder; +} + +.pricing-wrapper hr{ + margin: 1rem 0; + border: 1px solid rgba(0, 0, 0, 0.7); +} + +.pricing-wrapper p{ + font-size: 1.6rem; +} + +.pricing-wrapper img{ + width: 80%; + height: 100%; + justify-self: center; + align-self: start; +} + +.pricing-list li{ + list-style: none; + display: flex; + align-items: center; +} + +.pricing-list li img{ + width: 6rem; + height: 6rem; + border-radius: 30px; + margin-right: 2rem; +} + +.pricing-list li .name-price{ + display: flex; + justify-content: space-between; + align-items: flex-end; + width: 100%; +} + +.burger-pricing, .pizza-pricing, .pasta-pricing, .fries-pricing, .icecream-pricing, .beverages-pricing{ + width: 80%; +} + +.burger-pricing{ + justify-self: center; +} +.pizza-pricing{ + justify-self: center; +} + +.pricing-wrapper [alt=pizza]{ + justify-self: center; +} + +.pasta-pricing{ + justify-self: center; +} + +.fries-pricing{ + justify-self: center; +} + +.pricing-wrapper [alt=fries]{ + justify-self: center; +} + +.icecream-pricing{ + justify-self: center; +} + +.beverages-pricing{ + justify-self: center; +} + +.pricing-wrapper [alt=beverages]{ + justify-self: center; +} + +.pasta-pricing li{ + margin: 1rem 0; +} + +.pizza-pricing li{ + margin: 1rem 0; +} + +.fries-pricing li{ + margin: 1rem 0; +} + +.icecream-pricing li{ + margin: 1rem 0; +} + +.beverages-pricing li{ + margin: 1rem 0; +} + +#video-quick-bite{ + padding-top: 90px; + display: flex; + justify-content: center; +} + +#video-quick-bite video{ + margin-top: 10px; + width: 50vw; +} + +#footer{ + margin-top: 90px; + background-color: lightgray; + display: flex; + flex-direction: column; + align-items: flex-end; + font-size: 1.6rem; + font-family: 'Roboto', sans-serif; + padding: 2rem; +} + +#footer ul{ + list-style: none; + display: flex; +} + +#footer ul li{ + padding: 0 0.5rem; +} + +#footer li a{ + font-size: 1.6rem; + font-family: 'Roboto', sans-serif; +} + +@media only screen and (max-width:768px){ + .logo #product-name{ + font-size: 2.4rem; + } + + #nav-bar ul li a{ + font-size: 2rem; + } +} + +@media only screen and (max-width:650px){ + .logo #product-name{ + font-size: 2rem; + } + + #nav-bar ul li a{ + font-size: 1.6rem; + } +} + +@media only screen and (max-width:500px){ + .logo #product-name{ + font-size: 1.6rem; + } + + #nav-bar ul li a{ + font-size: 1.6rem; + } +} + +@media only screen and (max-width: 480px){ + .logo{ + width: 50%; + } + + #header{ + height: 60px; + } + + #header-img{ + max-width: 80px; + } + + #nav-bar{ + width: 50%; + } + + .logo #product-name{ + right: 10px; + } + + main{ + padding-top: 60px; + } +} + +@media only screen and (max-width:400px){ + .logo #product-name{ + font-size: 1.4rem; + } + + #nav-bar ul li a{ + font-size: 1.4rem; + } +} + +@media only screen and (max-width:325px){ + .logo #product-name{ + font-size: 1.2rem; + } + + #nav-bar ul li a{ + font-size: 1.2rem; + } +} + +@media only screen and (max-width:1275px){ + .tagline{ + font-size: 2.4rem; + } + + .signup-login{ + font-size: 2rem; + } +} + +@media only screen and (max-width:1165px){ + .tagline{ + font-size: 2rem; + } + + .signup-login{ + font-size: 1.6rem; + } + + form{ + flex-direction: column; + } + + #email{ + width: 100%; + font-size: 1.2rem; + } + + #submit{ + width: 60%; + font-size: 1.2rem; + } +} + +@media only screen and (max-width:960px){ + .tagline{ + font-size: 1.6rem; + } + + .sub-heading{ + font-size: 1.2rem; + } + + .signup-login{ + font-size: 1.2rem; + } + + #email{ + font-size: 1rem; + padding: 5px; + } + + #submit{ + font-size: 1rem; + padding: 5px; + } +} + +@media only screen and (max-width:780px){ + .home-wrapper{ + margin-left: 50px; + } + + .tagline{ + font-size: 1.2rem; + } + + .sub-heading{ + font-size: 1rem; + } +} + +@media only screen and (max-width: 520px){ + .home-wrapper{ + margin-left: 50px; + } + + .tagline{ + font-size: 1.2rem; + } + + .sub-heading{ + font-size: 1rem; + } + + .signup-login{ + font-size: 1rem; + } + + #email{ + font-size: 0.8rem; + } + + #submit{ + font-size: 0.8rem; + } +} + +@media only screen and (max-width: 450px){ + .home-wrapper{ + margin-left: 50px; + } + + .tagline{ + font-size: 1.2rem; + } + + .sub-heading{ + font-size: 1rem; + } + + .signup-login{ + font-size: 1rem; + } + + #email{ + font-size: 0.8rem; + } + + #submit{ + font-size: 0.8rem; + } +} + +@media only screen and (max-width: 360px){ + #email{ + width: 110%; + } + + #submit{ + width: 70%; + } +} + +@media only screen and (max-width:1278px){ + .food{ + grid-template-columns: 240px 240px; + } + + .food img{ + width: 240px; + height: 225px; + } +} + +@media only screen and (max-width:650px){ + .menu-wrapper{ + margin-left: 45px; + } + .menu-wrapper .heading{ + text-align: start; + font-size: 2.4rem; + } + + .food{ + grid-template-columns: 240px; + margin: 40px 0 0; + justify-content: start; + } + + .food img{ + width: 240px; + height: 225px; + } + + .food .food-name{ + font-size: 1.8rem; + } +} + +@media only screen and (max-width: 700px){ + .pricing-wrapper{ + grid-template-columns: 1fr; + grid-template-rows: 200px 1fr 200px 1fr 200px 1fr 200px 1fr 200px 1fr 200px 1fr; + grid-template-areas: "burger-img" + "burger-pricing" + "pizza-img" + "pizza-pricing" + "pasta-img" + "pasta-pricing" + "fries-img" + "fries-pricing" + "icecream-img" + "icecream-pricing" + "beverages-img" + "beverages-pricing" + ; + row-gap: 4rem; + margin-left: 45px; + } + + .pricing-wrapper [alt=burger]{ + grid-area: burger-img; + width: 280px; + height: 200px; + justify-self: start; + } + + .burger-pricing{ + grid-area: burger-pricing; + justify-self: start; + } + + .pricing-wrapper [alt=pizza]{ + grid-area: pizza-img; + width: 280px; + height: 200px; + justify-self: start; + } + + .pizza-pricing{ + grid-area: pizza-pricing; + justify-self: start; + } + + .pricing-wrapper [alt=pasta]{ + grid-area: pasta-img; + width: 280px; + height: 200px; + justify-self: start; + } + + .pasta-pricing{ + grid-area: pasta-pricing; + justify-self: start; + } + + .pricing-wrapper [alt=fries]{ + grid-area: fries-img; + width: 280px; + height: 200px; + justify-self: start; + } + + .fries-pricing{ + grid-area: fries-pricing; + justify-self: start; + } + + .pricing-wrapper [alt=icecream]{ + grid-area: icecream-img; + width: 280px; + height: 200px; + margin-top: -60px; + justify-self: start; + } + + .icecream-pricing{ + grid-area: icecream-pricing; + margin-top: -60px; + justify-self: start; + } + + .pricing-wrapper [alt=beverages]{ + grid-area: beverages-img; + width: 280px; + height: 200px; + margin-top: -60px; + justify-self: start; + } + + .beverages-pricing{ + grid-area: beverages-pricing; + margin-top: -60px; + justify-self: start; + } + + .pricing-wrapper .heading{ + font-size: 1.8rem; + } + + .pricing-wrapper p{ + font-size: 1.2rem; + } + + #video video{ + margin-top: -60px; + } +} + +@media only screen and (max-width:370px){ + .pricing-wrapper [alt=burger]{ + width: 240px; + } + + .pricing-wrapper [alt=pizza]{ + width: 240px; + } + + .pricing-wrapper [alt=pasta]{ + width: 240px; + } + + .pricing-wrapper [alt=fries]{ + width: 240px; + } + + .pricing-wrapper [alt=icecream]{ + width: 240px; + } + + .pricing-wrapper [alt=beverages]{ + width: 240px; + } +} + +@media only screen and (max-width: 550px){ + #video-quick-bite video{ + width: 80vw; + } +} + +@media only screen and (max-width: 450px){ + #footer{ + font-size: 1.4rem; + } + + #footer li a{ + font-size: 1.4rem; + } +} + +@media only screen and (max-width: 325px){ + #footer{ + font-size: 1.2rem; + } + + #footer li a{ + font-size: 1.2rem; + } +} + +** end of undefined ** + diff --git a/burger.jfif b/burger.jfif new file mode 100644 index 0000000..7f04ca8 Binary files /dev/null and b/burger.jfif differ diff --git a/cr-ch-burger-with-cheese.jfif b/cr-ch-burger-with-cheese.jfif new file mode 100644 index 0000000..cf9c88d Binary files /dev/null and b/cr-ch-burger-with-cheese.jfif differ diff --git a/cr-ch-burger-with-dp.jfif b/cr-ch-burger-with-dp.jfif new file mode 100644 index 0000000..a81a06d Binary files /dev/null and b/cr-ch-burger-with-dp.jfif differ diff --git a/cr-ch-burger.jfif b/cr-ch-burger.jfif new file mode 100644 index 0000000..0bb4bde Binary files /dev/null and b/cr-ch-burger.jfif differ diff --git a/cr-veg-burger-with-cheese.jfif b/cr-veg-burger-with-cheese.jfif new file mode 100644 index 0000000..5f21617 Binary files /dev/null and b/cr-veg-burger-with-cheese.jfif differ diff --git a/cr-veg-burger-with-dp.jfif b/cr-veg-burger-with-dp.jfif new file mode 100644 index 0000000..f077deb Binary files /dev/null and b/cr-veg-burger-with-dp.jfif differ diff --git a/cr-veg-burger.jfif b/cr-veg-burger.jfif new file mode 100644 index 0000000..f7669bc Binary files /dev/null and b/cr-veg-burger.jfif differ diff --git a/fries-cheese-fries.jfif b/fries-cheese-fries.jfif new file mode 100644 index 0000000..22a2d94 Binary files /dev/null and b/fries-cheese-fries.jfif differ diff --git a/fries-classic-french-fries.jfif b/fries-classic-french-fries.jfif new file mode 100644 index 0000000..a374fbd Binary files /dev/null and b/fries-classic-french-fries.jfif differ diff --git a/fries-garlic-butter-fries.jfif b/fries-garlic-butter-fries.jfif new file mode 100644 index 0000000..1128bd9 Binary files /dev/null and b/fries-garlic-butter-fries.jfif differ diff --git a/fries-peri-peri-fries.jfif b/fries-peri-peri-fries.jfif new file mode 100644 index 0000000..9e9f20d Binary files /dev/null and b/fries-peri-peri-fries.jfif differ diff --git a/fries.jfif b/fries.jfif new file mode 100644 index 0000000..2e94977 Binary files /dev/null and b/fries.jfif differ diff --git a/icecream-butterscotch.jfif b/icecream-butterscotch.jfif new file mode 100644 index 0000000..db05cbc Binary files /dev/null and b/icecream-butterscotch.jfif differ diff --git a/icecream-chocolate.jfif b/icecream-chocolate.jfif new file mode 100644 index 0000000..6eb26f8 Binary files /dev/null and b/icecream-chocolate.jfif differ diff --git a/icecream-mango.jfif b/icecream-mango.jfif new file mode 100644 index 0000000..cb4abf4 Binary files /dev/null and b/icecream-mango.jfif differ diff --git a/icecream-strawberry.jfif b/icecream-strawberry.jfif new file mode 100644 index 0000000..be20e1d Binary files /dev/null and b/icecream-strawberry.jfif differ diff --git a/icecream-vanilla.jfif b/icecream-vanilla.jfif new file mode 100644 index 0000000..33e62d1 Binary files /dev/null and b/icecream-vanilla.jfif differ diff --git a/icecream.jfif b/icecream.jfif new file mode 100644 index 0000000..12415fb Binary files /dev/null and b/icecream.jfif differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..e7197e5 --- /dev/null +++ b/index.html @@ -0,0 +1,353 @@ + + + + + + + Quick Bite - Get your favorite meals delivered + + + + + + +
+
+
+
Delicious Meals Delivered to Your Doorstep in Minutes!
+
Be the fastest in delivering your healthy food and with us order your best food + anytime and anywhere.
+ +
+ + +
+
+
+ +
+
+ burger +
+

Burger

+
+
    +
  • + Crispy Veg Burger +
    +

    Crispy Veg Burger

    +

    ₹55

    +
    +
    • +
  • + Crispy Veg Burger with Double Patty +
    +

    Crispy Veg Burger with Double Patty

    +

    ₹85

    +
    +
    • +
  • + Crispy Veg Burger with Cheese +
    +

    Crispy Veg Burger with Cheese

    +

    ₹95

    +
    +
    • +
  • + Crispy Chicken Burger +
    +

    Crispy Chicken Burger

    +

    ₹75

    +
    +
    • +
  • + Crispy Chicken Burger with Double Patty +
    +

    Crispy Chicken Burger with Double Patty

    +

    ₹115

    +
    +
    • +
  • + Crispy Chicken Burger with Cheese +
    +

    Crispy Chicken Burger with Cheese

    +

    ₹135

    +
    +
    • +
+
+
+

Pizza

+
+
    +
  • + Margherita +
    +

    Margherita

    +

    ₹109

    +
    +
    • +
  • + Farmhouse +
    +

    Farmhouse

    +

    ₹259

    +
    +
    • +
  • + Peppy Paneer +
    +

    Peppy Paneer

    +

    ₹269

    +
    +
    • +
  • + Pepper Barbecue Chicken +
    +

    Pepper Barbecue Chicken

    +

    ₹249

    +
    +
    • +
  • + Indi Chicken Tikka +
    +

    Indi Chicken Tikka

    +

    ₹389

    +
    +
    • +
+
+ pizza + pasta +
+

Pasta

+
+
    +
  • + Americano White Sauce Pasta Veg +
    +

    Americano White Sauce Pasta Veg

    +

    ₹189

    +
    +
    • +
  • + Mexicana Red Sauce Pasta Veg +
    +

    Mexicana Red Sauce Pasta Veg

    +

    ₹189

    +
    +
    • +
  • + Indiana Pasta Veg +
    +

    Indiana Pasta Veg

    +

    ₹189

    +
    +
    • +
  • + Americano White Sauce Pasta Non-Veg +
    +

    Americano White Sauce Pasta Non-Veg

    +

    ₹212

    +
    +
    • +
  • + Indiana Pasta Non-Veg +
    +

    Indiana Pasta Non-Veg

    +

    ₹212

    +
    +
    • +
+
+
+

Fries

+
+
    +
  • + Classic French Fries +
    +

    Classic French Fries

    +

    ₹99

    +
    +
    • +
  • + Peri-Peri Fries +
    +

    Peri-Peri Fries

    +

    ₹129

    +
    +
    • +
  • + Cheese Fries +
    +

    Cheese Fries

    +

    ₹149

    +
    +
    • +
  • + Garlic Butter Fries +
    +

    Garlic Butter Fries

    +

    ₹169

    +
    +
    • +
+
+ fries + icecream +
+

Ice Cream

+
+
    +
  • + Vanilla +
    +

    Vanilla

    +

    ₹79

    +
    +
    • +
  • + Chocolate +
    +

    Chocolate

    +

    ₹89

    +
    +
    • +
  • + Strawberry +
    +

    Strawberry

    +

    ₹89

    +
    +
    • +
  • + Mango +
    +

    Mango

    +

    ₹99

    +
    +
    • +
  • + Butterscotch +
    +

    Butterscotch

    +

    ₹99

    +
    +
    • +
+
+
+

Beverages

+
+
    +
  • + Cold Coffee +
    +

    Cold Coffee

    +

    ₹99

    +
    +
    • +
  • + Chocolate Milkshake +
    +

    Chocolate Milkshake

    +

    ₹129

    +
    +
    • +
  • + Butterscotch Milkshake +
    +

    Butterscotch Milkshake

    +

    ₹139

    +
    +
    • +
  • + Oreo Milkshake +
    +

    Oreo Milkshake

    +

    ₹149

    +
    +
    • +
  • + Strawberry Milkshake +
    +

    Strawberry Milkshake

    +

    ₹129

    +
    +
    • +
+
+ beverages +
+
+
+ +
+
+ + + + \ No newline at end of file diff --git a/logo.png b/logo.png new file mode 100644 index 0000000..1c0c2f2 Binary files /dev/null and b/logo.png differ diff --git a/logo1.jpg b/logo1.jpg new file mode 100644 index 0000000..30084de Binary files /dev/null and b/logo1.jpg differ diff --git a/logo2.png b/logo2.png new file mode 100644 index 0000000..03d913c Binary files /dev/null and b/logo2.png differ diff --git a/pasta-americano-wh-sauce-non-veg.jfif b/pasta-americano-wh-sauce-non-veg.jfif new file mode 100644 index 0000000..e7bbe43 Binary files /dev/null and b/pasta-americano-wh-sauce-non-veg.jfif differ diff --git a/pasta-americano-wh-sauce-veg.jfif b/pasta-americano-wh-sauce-veg.jfif new file mode 100644 index 0000000..cffcf19 Binary files /dev/null and b/pasta-americano-wh-sauce-veg.jfif differ diff --git a/pasta-indiana-non-veg.jfif b/pasta-indiana-non-veg.jfif new file mode 100644 index 0000000..9963d6f Binary files /dev/null and b/pasta-indiana-non-veg.jfif differ diff --git a/pasta-indiana-veg.jfif b/pasta-indiana-veg.jfif new file mode 100644 index 0000000..45098ea Binary files /dev/null and b/pasta-indiana-veg.jfif differ diff --git a/pasta-italiano-non-veg.jfif b/pasta-italiano-non-veg.jfif new file mode 100644 index 0000000..711eb3f Binary files /dev/null and b/pasta-italiano-non-veg.jfif differ diff --git a/pasta-italiano-veg.jfif b/pasta-italiano-veg.jfif new file mode 100644 index 0000000..039730d Binary files /dev/null and b/pasta-italiano-veg.jfif differ diff --git a/pasta-mexicana-red-sauce-non-veg.jfif b/pasta-mexicana-red-sauce-non-veg.jfif new file mode 100644 index 0000000..f2121f5 Binary files /dev/null and b/pasta-mexicana-red-sauce-non-veg.jfif differ diff --git a/pasta-mexicana-red-sauce-veg.jfif b/pasta-mexicana-red-sauce-veg.jfif new file mode 100644 index 0000000..cad89c2 Binary files /dev/null and b/pasta-mexicana-red-sauce-veg.jfif differ diff --git a/pasta.avif b/pasta.avif new file mode 100644 index 0000000..93fb7c0 Binary files /dev/null and b/pasta.avif differ diff --git a/pizza-ch-dominator.jfif b/pizza-ch-dominator.jfif new file mode 100644 index 0000000..471511a Binary files /dev/null and b/pizza-ch-dominator.jfif differ diff --git a/pizza-farmhouse.jfif b/pizza-farmhouse.jfif new file mode 100644 index 0000000..8378851 Binary files /dev/null and b/pizza-farmhouse.jfif differ diff --git a/pizza-indi-ch-tikka.jfif b/pizza-indi-ch-tikka.jfif new file mode 100644 index 0000000..8ce7ee2 Binary files /dev/null and b/pizza-indi-ch-tikka.jfif differ diff --git a/pizza-margherita.jpg b/pizza-margherita.jpg new file mode 100644 index 0000000..7f546bb Binary files /dev/null and b/pizza-margherita.jpg differ diff --git a/pizza-pepper-barbecue-ch.jfif b/pizza-pepper-barbecue-ch.jfif new file mode 100644 index 0000000..3ec6c1a Binary files /dev/null and b/pizza-pepper-barbecue-ch.jfif differ diff --git a/pizza-peppy-paneer.jfif b/pizza-peppy-paneer.jfif new file mode 100644 index 0000000..7e7a1b1 Binary files /dev/null and b/pizza-peppy-paneer.jfif differ diff --git a/pizza-veg-extravaganza.jfif b/pizza-veg-extravaganza.jfif new file mode 100644 index 0000000..4db5c82 Binary files /dev/null and b/pizza-veg-extravaganza.jfif differ diff --git a/pizza.jfif b/pizza.jfif new file mode 100644 index 0000000..3bc3f75 Binary files /dev/null and b/pizza.jfif differ diff --git a/quick_bite_video.mp4 b/quick_bite_video.mp4 new file mode 100644 index 0000000..0862dad Binary files /dev/null and b/quick_bite_video.mp4 differ diff --git a/style.css b/style.css new file mode 100644 index 0000000..d8a9a82 --- /dev/null +++ b/style.css @@ -0,0 +1,752 @@ +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + scroll-behavior: smooth; +} + +html{ + font-size: 10px; +} + +body{ + font-family: 'Roboto', sans-serif; + color: #333; + line-height: 1.6; +} + +#header{ + width: 100vw; + height: 90px; + display: flex; + justify-content: space-between; + align-items: center; + position: fixed; + top: 0; + background-color: lightgray; + z-index: 10; +} + +.logo{ + width: 60%; +} + +#header-img{ + width: 100%; + height: 100%; + max-width: 150px; + padding-top: 5px; +} + +.flex{ + display: flex; +} + +.logo #product-name{ + font-size: 3.6rem; + font-family: 'Poppins', sans-serif; + font-weight: bold; + color: #333; + text-align: center; + display: flex; + align-items: center; + position: relative; + right: 25px; +} + +#nav-bar{ + width: 40%; +} + +#nav-bar ul{ + display: flex; + justify-content: space-around; + list-style: none; + padding-right: 30px; +} + +li a{ + font-size: 2.4rem; + font-family: 'Poppins', sans-serif; + color: rgba(0, 0, 0, 0.6); + text-decoration: none; + text-align: center; +} + +li a:hover{ + color: black; +} + +main{ + padding-top: 90px; + z-index: 1; +} + +#home{ + height: 85vh; + background-image: url(bg-img1.jpg); + background-size: 100% 85vh; + background-repeat: no-repeat; + position: relative; + display: flex; + justify-content: flex-start; + align-items: center; +} + +.home-wrapper{ + width: 30%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin-left: 100px; + text-align: center; + gap: 20px; +} + +.tagline{ + color: white; + font-family: 'Poppins', sans-serif; + font-size: 3rem; +} + +.sub-heading{ + font-family: 'Open Sans', sans-serif; + font-size: 1.6rem; + color: yellow; +} + +.signup-login{ + font-size: 2.4rem; + color: white; +} + +form{ + display: flex; + align-items: center; + justify-content: center; + gap: 15px; +} + +#email{ + width: 200%; + padding: 10px; + font-size: 1.6rem; + color: black; + text-align: center; + border-radius: 5px; + border: none; +} + +#submit{ + background-color: orange; + padding: 10px; + width: 100%; + font-size: 1.6rem; + border-radius: 5px; + border: none; + text-align: center; + cursor: pointer; +} + +#submit:hover{ + border: 2px solid black; + color: purple; +} + +#menu{ + padding-top: 90px; +} + +.menu-wrapper .heading{ + font-size: 3rem; + font-family: 'Poppins', sans-serif; + text-align: center; +} + +.food{ + width: 60vw; + margin: 40px auto 0; + display: grid; + grid-template-columns: 1fr 1fr 1fr; + justify-content: center; + justify-items: center; + align-items: start; + gap: 2.4rem; +} + +.food img{ + width: 18.75vw; + height: 31.25vh; + object-fit: cover; + border-radius: 60px; + margin-bottom: 1.6rem; +} + +.food .food-name{ + font-size: 2rem; + font-weight: bolder; +} + +.food .food-options{ + font-size: 1.2rem; + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; +} + +#pricing{ + padding-top: 90px; +} + +.pricing-wrapper{ + width: 80vw; + margin: 10px auto 0; + display: grid; + grid-template-columns: 1fr 1fr; + row-gap: 10rem; + grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr; +} + +.pricing-wrapper .heading{ + font-family: 'Poppins', sans-serif; + font-size: 2.8rem; + font-weight: bolder; +} + +.pricing-wrapper hr{ + margin: 1rem 0; + border: 1px solid rgba(0, 0, 0, 0.7); +} + +.pricing-wrapper p{ + font-size: 1.6rem; +} + +.pricing-wrapper img{ + width: 80%; + height: 100%; + justify-self: center; + align-self: start; +} + +.pricing-list li{ + list-style: none; + display: flex; + align-items: center; +} + +.pricing-list li img{ + width: 6rem; + height: 6rem; + border-radius: 30px; + margin-right: 2rem; +} + +.pricing-list li .name-price{ + display: flex; + justify-content: space-between; + align-items: flex-end; + width: 100%; +} + +.burger-pricing, .pizza-pricing, .pasta-pricing, .fries-pricing, .icecream-pricing, .beverages-pricing{ + width: 80%; +} + +.burger-pricing{ + justify-self: center; +} +.pizza-pricing{ + justify-self: center; +} + +.pricing-wrapper [alt=pizza]{ + justify-self: center; +} + +.pasta-pricing{ + justify-self: center; +} + +.fries-pricing{ + justify-self: center; +} + +.pricing-wrapper [alt=fries]{ + justify-self: center; +} + +.icecream-pricing{ + justify-self: center; +} + +.beverages-pricing{ + justify-self: center; +} + +.pricing-wrapper [alt=beverages]{ + justify-self: center; +} + +.pasta-pricing li{ + margin: 1rem 0; +} + +.pizza-pricing li{ + margin: 1rem 0; +} + +.fries-pricing li{ + margin: 1rem 0; +} + +.icecream-pricing li{ + margin: 1rem 0; +} + +.beverages-pricing li{ + margin: 1rem 0; +} + +#video{ + padding-top: 90px; + display: flex; + justify-content: center; +} + +#video video{ + margin-top: 10px; + width: 50vw; +} + +#footer{ + margin-top: 90px; + background-color: lightgray; + display: flex; + flex-direction: column; + align-items: flex-end; + font-size: 1.6rem; + font-family: 'Roboto', sans-serif; + padding: 2rem; +} + +#footer ul{ + list-style: none; + display: flex; +} + +#footer ul li{ + padding: 0 0.5rem; +} + +#footer li a{ + font-size: 1.6rem; + font-family: 'Roboto', sans-serif; +} + +@media only screen and (max-width:768px){ + .logo #product-name{ + font-size: 2.4rem; + } + + #nav-bar ul li a{ + font-size: 2rem; + } +} + +@media only screen and (max-width:650px){ + .logo #product-name{ + font-size: 2rem; + } + + #nav-bar ul li a{ + font-size: 1.6rem; + } +} + +@media only screen and (max-width:500px){ + .logo #product-name{ + font-size: 1.6rem; + } + + #nav-bar ul li a{ + font-size: 1.6rem; + } +} + +@media only screen and (max-width: 480px){ + .logo{ + width: 50%; + } + + #header{ + height: 60px; + } + + #header-img{ + max-width: 80px; + } + + #nav-bar{ + width: 50%; + } + + .logo #product-name{ + right: 10px; + } + + main{ + padding-top: 60px; + } +} + +@media only screen and (max-width:400px){ + .logo #product-name{ + font-size: 1.4rem; + } + + #nav-bar ul li a{ + font-size: 1.4rem; + } +} + +@media only screen and (max-width:325px){ + .logo #product-name{ + font-size: 1.2rem; + } + + #nav-bar ul li a{ + font-size: 1.2rem; + } +} + +@media only screen and (max-width:1275px){ + .tagline{ + font-size: 2.4rem; + } + + .signup-login{ + font-size: 2rem; + } +} + +@media only screen and (max-width:1165px){ + .tagline{ + font-size: 2rem; + } + + .signup-login{ + font-size: 1.6rem; + } + + form{ + flex-direction: column; + } + + #email{ + width: 100%; + font-size: 1.2rem; + } + + #submit{ + width: 60%; + font-size: 1.2rem; + } +} + +@media only screen and (max-width:960px){ + .tagline{ + font-size: 1.6rem; + } + + .sub-heading{ + font-size: 1.2rem; + } + + .signup-login{ + font-size: 1.2rem; + } + + #email{ + font-size: 1rem; + padding: 5px; + } + + #submit{ + font-size: 1rem; + padding: 5px; + } +} + +@media only screen and (max-width:780px){ + .tagline{ + font-size: 1.4rem; + } + + .sub-heading{ + font-size: 1.2rem; + } +} + +@media only screen and (max-width: 520px){ + .home-wrapper{ + margin-left: 50px; + } + + .tagline{ + font-size: 1.2rem; + } + + .sub-heading{ + font-size: 1rem; + } + + .signup-login{ + font-size: 1rem; + } + + #email{ + font-size: 0.8rem; + } + + #submit{ + font-size: 0.8rem; + } +} + +@media only screen and (max-width: 450px){ + .home-wrapper{ + margin-left: 50px; + } + + .tagline{ + font-size: 1.2rem; + } + + .sub-heading{ + font-size: 1rem; + } + + .signup-login{ + font-size: 1rem; + } + + #email{ + font-size: 0.8rem; + } + + #submit{ + font-size: 0.8rem; + } +} + +@media only screen and (max-width: 360px){ + #email{ + width: 110%; + } + + #submit{ + width: 70%; + } +} + +@media only screen and (max-width:1278px){ + .food{ + grid-template-columns: 240px 240px; + } + + .food img{ + width: 240px; + height: 225px; + } +} + +@media only screen and (max-width:650px){ + .menu-wrapper{ + margin-left: 45px; + } + .menu-wrapper .heading{ + text-align: start; + font-size: 2.4rem; + } + + .food{ + grid-template-columns: 240px; + margin: 40px 0 0; + justify-content: start; + } + + .food img{ + width: 240px; + height: 225px; + } + + .food .food-name{ + font-size: 1.8rem; + } +} + +@media only screen and (max-width: 700px){ + .pricing-wrapper{ + grid-template-columns: 1fr; + grid-template-rows: 200px 1fr 200px 1fr 200px 1fr 200px 1fr 200px 1fr 200px 1fr; + grid-template-areas: "burger-img" + "burger-pricing" + "pizza-img" + "pizza-pricing" + "pasta-img" + "pasta-pricing" + "fries-img" + "fries-pricing" + "icecream-img" + "icecream-pricing" + "beverages-img" + "beverages-pricing" + ; + row-gap: 4rem; + margin-left: 45px; + } + + .pricing-wrapper [alt=burger]{ + grid-area: burger-img; + width: 280px; + height: 200px; + justify-self: start; + } + + .burger-pricing{ + grid-area: burger-pricing; + justify-self: start; + } + + .pricing-wrapper [alt=pizza]{ + grid-area: pizza-img; + width: 280px; + height: 200px; + justify-self: start; + } + + .pizza-pricing{ + grid-area: pizza-pricing; + justify-self: start; + } + + .pricing-wrapper [alt=pasta]{ + grid-area: pasta-img; + width: 280px; + height: 200px; + justify-self: start; + } + + .pasta-pricing{ + grid-area: pasta-pricing; + justify-self: start; + } + + .pricing-wrapper [alt=fries]{ + grid-area: fries-img; + width: 280px; + height: 200px; + justify-self: start; + } + + .fries-pricing{ + grid-area: fries-pricing; + justify-self: start; + } + + .pricing-wrapper [alt=icecream]{ + grid-area: icecream-img; + width: 280px; + height: 200px; + margin-top: -60px; + justify-self: start; + } + + .icecream-pricing{ + grid-area: icecream-pricing; + margin-top: -60px; + justify-self: start; + } + + .pricing-wrapper [alt=beverages]{ + grid-area: beverages-img; + width: 280px; + height: 200px; + margin-top: -60px; + justify-self: start; + } + + .beverages-pricing{ + grid-area: beverages-pricing; + margin-top: -60px; + justify-self: start; + } + + .pricing-wrapper .heading{ + font-size: 1.8rem; + } + + .pricing-wrapper p{ + font-size: 1.2rem; + } + + #video video{ + margin-top: -60px; + } +} + +@media only screen and (max-width:370px){ + .pricing-wrapper [alt=burger]{ + width: 240px; + } + + .pricing-wrapper [alt=pizza]{ + width: 240px; + } + + .pricing-wrapper [alt=pasta]{ + width: 240px; + } + + .pricing-wrapper [alt=fries]{ + width: 240px; + } + + .pricing-wrapper [alt=icecream]{ + width: 240px; + } + + .pricing-wrapper [alt=beverages]{ + width: 240px; + } +} + +@media only screen and (max-width: 550px){ + #video video{ + width: 80vw; + } +} + +@media only screen and (max-width: 450px){ + #footer{ + font-size: 1.4rem; + } + + #footer li a{ + font-size: 1.4rem; + } +} + +@media only screen and (max-width: 325px){ + #footer{ + font-size: 1.2rem; + } + + #footer li a{ + font-size: 1.2rem; + } +} \ No newline at end of file