store page

This commit is contained in:
presh
2021-10-29 15:05:16 +01:00
parent 95bba35f5a
commit 4fbc0bbcc5
37 changed files with 580 additions and 3 deletions

BIN
assets/img/gallery/1.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 436 KiB

View File

@@ -0,0 +1,14 @@
<svg width="1924" height="268" viewBox="0 0 1924 268" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1924 105.219C3545.69 -248.281 4760 -1692.33 4760 -3420C4760 -5412.64 3144.64 -7028 1152 -7028C-840.643 -7028 -2456 -5412.64 -2456 -3420C-2456 -1830.19 -1427.74 -480.533 0 0.180664V268H1924V105.219ZM1924 105.219V0H0V0.180664C361.762 121.984 749.172 188 1152 188C1416.98 188 1675.28 159.436 1924 105.219Z" fill="url(#paint0_linear)"/>
</g>
<defs>
<linearGradient id="paint0_linear" x1="-38.7901" y1="-3627.74" x2="-3952.78" y2="-3031.27" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFAE00"/>
<stop offset="1" stop-color="#FF8A00"/>
</linearGradient>
<clipPath id="clip0">
<rect width="1924" height="268" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 831 B

BIN
assets/img/gallery/bg1.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 299 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 201 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 74 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 73 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 826 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 960 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 579 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 334 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 167 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 568 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 70 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 242 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 612 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 813 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 856 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

View File

@@ -1,5 +1,11 @@
.bg-orange{
background: #FFB20E;
background: url(../assets/img/gallery/hero-bg.png);
}
.bg-orange2{
background: url(../assets/img/gallery/bg1.jpg)no-repeat;
background-size: cover;
}
.bg-holder{
background: url(../assets/img/gallery/cta-one-bg.png);
@@ -16,5 +22,36 @@
background-size:cover;
}
.text-gradient{
background: linear-gradient(to right #FB3C00 0%,#FFB800 100%);
background: linear-gradient(to right #FB3C00 10%,#FFB800 100%);
}
.input-group-icon
{display:flex;
align-items:center;
padding:.375rem .75rem;
font-size:1rem;
font-weight:400;
line-height:1.5;
color:#212529;
text-align:center;
white-space:nowrap;
background-color:#ffb30e69;
border:none;
border-radius:15px;
}
.form-control{
color:#212529;
background-color:#ffb30e69;
border-radius:15px;
border:none;
outline: none;
}
.bgfilter{
background: linear-gradient(to top, #ffc50a 31%, #ffc60a8a 63%);
}
.bg-resturant{
background: #fcc40f65
}
.bglightorange{
background: #fdc34798;
}

201
food.html Normal file
View File

@@ -0,0 +1,201 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#ffffff">
<title>ChopFood | index</title>
<!-- Favicons-->
<link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/img/favicons/favicon-16x16.png">
<link rel="shortcut icon" type="image/x-icon" href="assets/img/favicons/favicon.ico">
<!-- Stylesheet-->
<link rel="stylesheet" href="./css/style.css">
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200;300;400;600;700;900&amp;display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="stylesheet" href="./css/fontawesome/all.min.js">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<main class="main" id="top">
<!-- navigation bar -->
<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top" data-navbar-on-scroll="data-navbar-on-scroll">
<div class="container">
<a class="navbar-brand d-inline-flex" href="index.html">
<img class="d-inline-block" src="./assets/img/gallery/logo.svg" alt="logo" />
<span class="text-1000 fs-3 fw-bold ms-2 text-gradient">Chopfood</span></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"> </span></button>
<!-- location -->
<div class="collapse navbar-collapse border-top border-lg-0 my-2 mt-lg-0" id="navbarSupportedContent">
<div class="mx-auto pt-5 pt-lg-0 d-block d-lg-none d-xl-block">
<p class="mb-0 fw-bold text-lg-center">Deliver to:
<i class="fa fa-map-marker-alt text-warning"></i>
<span class="fw-normal">Current Location </span><span>Necco Bus Sop, Mando</span>
</p>
</div>
<!-- login button -->
<form class="d-flex mt-4 mt-lg-0 ms-lg-auto ms-xl-0 d-block ">
<button class="btn btn-white shadow-warning text-warning" type="submit"> <i class="fa fa-user me-2"></i>Login</button>
</form>
<!-- toggle button -->
<div>
<span></span>
</div>
</div>
</div>
</nav>
<!-- end of navigation -->
<!-- first section -->
<section class="py-5 overflow-hidden" style="background: url(././assets/img/gallery/cta-one-bg.png) no-repeat; background-size:cover;">
<div class="container pt-5">
<div class="row flex-center">
<div class="col-md-7 col-lg-6 pt-5 text-md-start">
<span class="display-6 fs-md-5 fs-lg-6 fs-xl-8 text-capitalize text-center fw-bolder">
Sub way meal </span>
</div>
</div>
</div>
</section>
<section class="bglightorange">
<div class="container-fluid mx-3">
<div class="row">
<div class="col-md-3 col-lg-5 col-sm-2 mb-3">
<span class="h4 fw-bold text-md-center text-center text-danger pt-5">
Select your preference</span>
<ul>
<li> <a href="#Popular">Popular dishes</a></li>
<li><a href="#Breakfast">Breakfast</a></li>
<li><a href="#Dinner">Dinner</a></li>
<li><a href="#Lunch">Lunch</a></li>
<li> <a href="#Drinks">Drinks</a></li>
<li> <a href="#Snacks">Snacks</a></li>
<li><a href="#Local">Local dishes</a></li>
<li><a href="#Foriegn">Foriegn dishes</a></li>
</ul>
</div>
<div class="col-md-9 col-lg-7 col-sm-10">
<div class="col-lg-7 mx-auto text-center mb-6">
<h5 class="fw-bold fs-3 fs-lg-5 lh-sm mb-3">Featured Restaurants</h5>
</div>
<div class="row gx-2">
<div class="col-sm-6 col-md-4 col-lg-3 h-100 mb-5">
<div class="card card-span h-100 text-white rounded-3"><img class="img-fluid rounded-3 h-100" src="./assets/img/gallery/food-world.png" alt="..." />
<div class="card-img-overlay ps-0"><span class="badge bg-danger p-2 ms-3"><i class="fas fa-tag me-2 fs-0"></i><span class="fs-0">20% off</span></span><span class="badge bg-primary ms-2 me-1 p-2"><i class="fas fa-clock me-1 fs-0"></i><span class="fs-0">Fast</span></span></div>
<div class="card-body ps-0">
<div class="d-flex align-items-center mb-3"><img class="img-fluid" src="./assets/img/gallery/food-world-logo.png" alt="" />
<div class="flex-1 ms-3">
<h5 class="mb-0 fw-bold text-1000">Food world</h5><span class="text-primary fs--1 me-1"><i class="fas fa-star"></i></span><span class="mb-0 text-primary">46</span>
</div>
</div><span class="badge bg-soft-danger p-2"><span class="fw-bold fs-1 text-danger">Opens Tomorrow</span></span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 h-100 mb-5">
<div class="card card-span h-100 text-white rounded-3"><img class="img-fluid rounded-3 h-100" src="./assets/img/gallery/pizza-hub.png" alt="..." />
<div class="card-img-overlay ps-0"><span class="badge bg-danger p-2 ms-3"><i class="fas fa-tag me-2 fs-0"></i><span class="fs-0">10% off</span></span><span class="badge bg-primary ms-2 me-1 p-2"><i class="fas fa-clock me-1 fs-0"></i><span class="fs-0">Fast</span></span></div>
<div class="card-body ps-0">
<div class="d-flex align-items-center mb-3"><img class="img-fluid" src="./assets/img/gallery/pizzahub-logo.png" alt="" />
<div class="flex-1 ms-3">
<h5 class="mb-0 fw-bold text-1000">Pizza hub</h5><span class="text-primary fs--1 me-1"><i class="fas fa-star"></i></span><span class="mb-0 text-primary">40</span>
</div>
</div><span class="badge bg-soft-danger p-2"><span class="fw-bold fs-1 text-danger">Opens Tomorrow</span></span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 h-100 mb-5">
<div class="card card-span h-100 text-white rounded-3"><img class="img-fluid rounded-3 h-100" src="././assets/img/gallery/donuts-hut.png" alt="..." />
<div class="card-img-overlay ps-0"><span class="badge bg-danger p-2 ms-3"><i class="fas fa-tag me-2 fs-0"></i><span class="fs-0">15% off</span></span><span class="badge bg-primary ms-2 me-1 p-2"><i class="fas fa-clock me-1 fs-0"></i><span class="fs-0">Fast</span></span></div>
<div class="card-body ps-0">
<div class="d-flex align-items-center mb-3"><img class="img-fluid" src="././assets/img/gallery/donuts-hut-logo.png" alt="" />
<div class="flex-1 ms-3">
<h5 class="mb-0 fw-bold text-1000">Donuts hut</h5><span class="text-primary fs--1 me-1"><i class="fas fa-star"></i></span><span class="mb-0 text-primary">20</span>
</div>
</div><span class="badge bg-soft-success p-2"><span class="fw-bold fs-1 text-success">Open Now</span></span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 h-100 mb-5">
<div class="card card-span h-100 text-white rounded-3"><img class="img-fluid rounded-3 h-100" src="././assets/img/gallery/donuthut.png" alt="..." />
<div class="card-img-overlay ps-0"><span class="badge bg-danger p-2 ms-3"><i class="fas fa-tag me-2 fs-0"></i><span class="fs-0">15% off</span></span><span class="badge bg-primary ms-2 me-1 p-2"><i class="fas fa-clock me-1 fs-0"></i><span class="fs-0">Fast</span></span></div>
<div class="card-body ps-0">
<div class="d-flex align-items-center mb-3"><img class="img-fluid" src="././assets/img/gallery/donut-hut-logo.png" alt="" />
<div class="flex-1 ms-3">
<h5 class="mb-0 fw-bold text-1000">Donuts hut</h5><span class="text-primary fs--1 me-1"><i class="fas fa-star"></i></span><span class="mb-0 text-primary">50</span>
</div>
</div><span class="badge bg-soft-success p-2"><span class="fw-bold fs-1 text-success">Open Now</span></span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 h-100 mb-5">
<div class="card card-span h-100 text-white rounded-3"><img class="img-fluid rounded-3 h-100" src="././assets/img/gallery/ruby-tuesday.png" alt="..." />
<div class="card-img-overlay ps-0"><span class="badge bg-danger p-2 ms-3"><i class="fas fa-tag me-2 fs-0"></i><span class="fs-0">10% off</span></span><span class="badge bg-primary ms-2 me-1 p-2"><i class="fas fa-clock me-1 fs-0"></i><span class="fs-0">Fast</span></span></div>
<div class="card-body ps-0">
<div class="d-flex align-items-center mb-3"><img class="img-fluid" src="././assets/img/gallery/ruby-tuesday-logo.png" alt="" />
<div class="flex-1 ms-3">
<h5 class="mb-0 fw-bold text-1000">Ruby tuesday</h5><span class="text-primary fs--1 me-1"><i class="fas fa-star"></i></span><span class="mb-0 text-primary">50</span>
</div>
</div><span class="badge bg-soft-success p-2"><span class="fw-bold fs-1 text-success">Open Now</span></span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 h-100 mb-5">
<div class="card card-span h-100 text-white rounded-3"><img class="img-fluid rounded-3 h-100" src="././assets/img/gallery/kuakata.png" alt="..." />
<div class="card-img-overlay ps-0"><span class="badge bg-danger p-2 ms-3"><i class="fas fa-tag me-2 fs-0"></i><span class="fs-0">10% off</span></span><span class="badge bg-primary ms-2 me-1 p-2"><i class="fas fa-clock me-1 fs-0"></i><span class="fs-0">Fast</span></span></div>
<div class="card-body ps-0">
<div class="d-flex align-items-center mb-3"><img class="img-fluid" src="././assets/img/gallery/kuakata-logo.png" alt="" />
<div class="flex-1 ms-3">
<h5 class="mb-0 fw-bold text-1000">Kuakata Fried Chicken</h5><span class="text-primary fs--1 me-1"><i class="fas fa-star"></i></span><span class="mb-0 text-primary">50</span>
</div>
</div><span class="badge bg-soft-success p-2"><span class="fw-bold fs-1 text-success">Open Now</span></span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 h-100 mb-5">
<div class="card card-span h-100 text-white rounded-3"><img class="img-fluid rounded-3 h-100" src="././assets/img/gallery/red-square.png" alt="..." />
<div class="card-img-overlay ps-0"><span class="badge bg-danger p-2 ms-3"><i class="fas fa-tag me-2 fs-0"></i><span class="fs-0">10% off</span></span><span class="badge bg-primary ms-2 me-1 p-2"><i class="fas fa-clock me-1 fs-0"></i><span class="fs-0">Fast</span></span></div>
<div class="card-body ps-0">
<div class="d-flex align-items-center mb-3"><img class="img-fluid" src="././assets/img/gallery/red-square-logo.png" alt="" />
<div class="flex-1 ms-3">
<h5 class="mb-0 fw-bold text-1000">Kuakata Fried Chicken</h5><span class="text-primary fs--1 me-1"><i class="fas fa-star"></i></span><span class="mb-0 text-primary">50</span>
</div>
</div><span class="badge bg-soft-success p-2"><span class="fw-bold fs-1 text-success">Open Now</span></span>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 h-100 mb-5">
<div class="card card-span h-100 text-white rounded-3"><img class="img-fluid rounded-3 h-100" src="././assets/img/gallery/taco-bell.png" alt="..." />
<div class="card-img-overlay ps-0"><span class="badge bg-danger p-2 ms-3"><i class="fas fa-tag me-2 fs-0"></i><span class="fs-0">10% off</span></span><span class="badge bg-primary ms-2 me-1 p-2"><i class="fas fa-clock me-1 fs-0"></i><span class="fs-0">Fast</span></span></div>
<div class="card-body ps-0">
<div class="d-flex align-items-center mb-3"><img class="img-fluid" src="././assets/img/gallery/taco-bell-logo.png" alt="" />
<div class="flex-1 ms-3">
<h5 class="mb-0 fw-bold text-1000">Taco bell</h5><span class="text-primary fs--1 me-1"><i class="fas fa-star"></i></span><span class="mb-0 text-primary">50</span>
</div>
</div><span class="badge bg-soft-success p-2"><span class="fw-bold fs-1 text-success">Open Now</span></span>
</div>
</div>
</div>
<div class="col-12 d-flex justify-content-center mt-5"> <a class="btn btn-lg btn-primary" href="#!">View All <i class="fas fa-chevron-right ms-2"> </i></a></div>
</div>
</div>
</div>
</div>
</section>
</main>
</body>

View File

@@ -19,7 +19,7 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="stylesheet" href="./css/fontawesome/all.min.js">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
</head>
<body>
<main class="main" id="top">

325
store.html Normal file
View File

@@ -0,0 +1,325 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#ffffff">
<title>ChopFood | index</title>
<!-- Favicons-->
<link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/img/favicons/favicon-16x16.png">
<link rel="shortcut icon" type="image/x-icon" href="assets/img/favicons/favicon.ico">
<!-- Stylesheet-->
<link rel="stylesheet" href="./css/style.css">
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200;300;400;600;700;900&amp;display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="stylesheet" href="./css/fontawesome/all.min.js">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<main class="main" id="top">
<!-- navigation bar -->
<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top" data-navbar-on-scroll="data-navbar-on-scroll">
<div class="container">
<a class="navbar-brand d-inline-flex" href="index.html">
<img class="d-inline-block" src="assets/img/gallery/logo.svg" alt="logo" />
<span class="text-1000 fs-3 fw-bold ms-2 text-gradient">Chopfood</span></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"> </span></button>
<!-- location -->
<div class="collapse navbar-collapse border-top border-lg-0 my-2 mt-lg-0" id="navbarSupportedContent">
<div class="mx-auto pt-5 pt-lg-0 d-block d-lg-none d-xl-block">
<p class="mb-0 fw-bold text-lg-center">Deliver to:
<i class="fa fa-map-marker-alt text-warning"></i>
<span class="fw-normal">Current Location </span><span>Necco Bus Sop, Mando</span>
</p>
</div>
<!-- login button -->
<form class="d-flex mt-4 mt-lg-0 ms-lg-auto ms-xl-0 d-block ">
<button class="btn btn-white shadow-warning text-warning" type="submit"> <i class="fa fa-user me-2"></i>Login</button>
</form>
<!-- toggle button -->
<div>
<span></span>
</div>
</div>
</div>
</nav>
<!-- end of navigation -->
<!-- first section -->
<section class="py-5 overflow-hidden bg-orange2" id="home">
<div class="container pt-5">
<div class="row flex-center">
<div class="col-md-7 col-lg-6 pt-5 text-md-start">
<span class="display-6 fs-md-5 fs-lg-6 fs-xl-8 text-light text-center fw-bolder">
Order From Various Restaurants
From Your Location </span>
</div>
</div>
</div>
</section>
<section class="py-3 overflow-hidden">
<div class="container pt-3">
<div class="input-group">
<span class="input-group-icon"><i class="fa fa-search"></i></span>
<input type="text" class="form-control" placeholder="search resturant " aria-label="Username">
</div>
</div>
</section>
<!-- filter section -->
<section class="">
<div class="container-fluid mx-3">
<div class="row">
<div class="col-md-3 col-lg-3 col-sm-3 mb-3 bgfilter">
<span class="h4 fw-bold text-md-center text-center text-danger pt-5">Select your preference</span>
<div class="filter_order pt-3">
<span class="h5">Minimum Order</span>
<div class="text-muted">
<input type="radio" value="1500" name="amount" />
<label for="1500">N1500</label><br>
<input type="radio" value="2000" name="amount" />
<label for="2000">N2000</label><br>
<input type="radio" value="3500" name="amount" />
<label for="3500">N3500</label><br>
<input type="radio" value="4500" name="amount" />
<label for="4500">N4500</label><br>
</div>
</div>
<div class="filter_order py-4">
<span class="h5">Delivery fee</span>
<div class="text-muted">
<input type="radio" value="Free" /> <label for="Free">Free</label><br>
<input type="radio" value="500" /> <label for="500">N500</label><br>
<input type="radio" value="1000" /> <label for="1000">N1000</label><br>
<input type="radio" value="1500" /> <label for="2000">N2000</label><br>
</div>
</div>
<div class="filter_order mb-md-5 mb-sm-5 t">
<span class="h5">Reviews</span><br>
</div>
</div>
<div class="col-md-8 col-lg-8 col-sm-8">
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/donuts-hut-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/donut-hut-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/pizzahub-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/red-square-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/red-square-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/red-square-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/red-square-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/red-square-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
<div class="bg-resturant mb-3">
<div class="row g-0">
<div class="col-md-3 col-sm-4">
<img src="./assets/img/gallery/red-square-logo.png" width="100" height="100" class="img-fluid" alt="...">
</div>
<div class="col-md-8 col-sm-4">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- <footer> begin ============================-->
<section class="mt-3 pt-5 bg-black">
<div class="container">
<div class="row">
<div class="col-6 col-md-4 col-lg-3 col-xxl-2 mb-3">
<h5 class="lh-lg fw-bold text-white">COMPANY</h5>
<ul class="list-unstyled mb-md-4 mb-lg-0">
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">About Us</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Team</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Careers</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">blog</a></li>
</ul>
</div>
<div class="col-6 col-md-4 col-lg-3 col-xxl-2 col-lg-3 mb-3">
<h5 class="lh-lg fw-bold text-white">CONTACT</h5>
<ul class="list-unstyled mb-md-4 mb-lg-0">
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Help &amp; Support</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Partner with us </a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Ride with us</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Ride with us</a></li>
</ul>
</div>
<div class="col-6 col-md-4 col-lg-3 col-xxl-2 mb-3">
<h5 class="lh-lg fw-bold text-white">LEGAL</h5>
<ul class="list-unstyled mb-md-4 mb-lg-0">
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Terms &amp; Conditions</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Refund &amp; Cancellation</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Privacy Policy</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Cookie Policy</a></li>
</ul>
</div>
<div class="col-6 col-md-4 col-lg-3 col-xxl-2 mb-3">
<h5 class="lh-lg fw-bold text-white">OUR TOP CITIES</h5>
<ul class="list-unstyled mb-md-4 mb-lg-0">
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Kaduna</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Abuja</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Lagos</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Calabar</a></li>
<li class="lh-lg"><a class="text-200 text-decoration-none" href="#!">Benin</a></li>
</ul>
</div>
<div class="col-12 col-md-8 col-lg-6 col-xxl-4">
<h5 class="lh-lg fw-bold text-white text-500">FOLLOW US</h5>
<div class="text-start my-3">
<a href="#"> <i class="fa fa-facebook fa-2x"></i> </a>
<a href="#"> <i class="fa fa-twitter fa-2x"></i></a>
<a href="#"> <i class="fa fa-instagram fa-2x"></i></a>
</div>
<h3 class="text-500 my-4 text-white">Receive exclusive offers and <br />discounts in your mailbox</h3>
<div class="input-group flex-nowrap">
<div class="input-group-prepend">
<span class="input-group-text" id="addon-wrapping">
<i class="fa fa-envelope fa-2x"></i>
</span>
</div>
<input type="text" class="form-control" placeholder="Email" aria-label="Email" aria-describedby="addon-wrapping">
<button class="btn btn-primary" type="submit">Subscribe</button>
</div>
<div class="col-auto">
</div>
</div>
</div>
<hr class="border border-800" />
<div class="row flex-center pb-3">
<div class="col-md-6 order-0">
<p class="text-200 text-center text-md-start">All rights Reserved &copy;Chopfood, 2021</p>
</div>
</div>
</div>
</section>
<!-- <footer> end ============================-->
</main>
</body>
</html>