generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
185 lines (178 loc) · 10.2 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Home | Spicy Dhaba! Real Authentic Indian Food</title>
<link rel="icon" href="./assets/images/logo-red.png" type="image/x-icon" />
<!--bootstrap link -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous" />
<!--font aswsome script link -->
<script src="https://kit.fontawesome.com/023e38a18b.js" crossorigin="anonymous"></script>
<!--local css link -->
<link rel="stylesheet" href="./assets/css/style.css"/>
</head>
<body>
<!--Nav bar-->
<nav class="navbar bg-light navbar-expand-lg fixed-top">
<a class="navbar-brand ms-2 ms-md-3 ms-lg-5" href="index.html">
<h1 id="logo">Spicy <img id="logo-img" src="./assets/images/logo-red.png" alt="Logo Image" /> Dhaba</h1>
</a>
<button class="navbar-toggler navbar-light" 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 navbar-toggler-border"></span>
</button>
<div class="collapse navbar-collapse justify-content-end navbar-light me-lg-5" id="navbarSupportedContent">
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link active p-2" href="index.html">Home</a></li>
<li class="nav-item"><a class="nav-link p-2" href="about-us.html">About Us</a></li>
<li class="nav-item"><a class="nav-link p-2" href="menu.html">Menu</a></li>
<li class="nav-item"><a class="nav-link p-2" href="book-table.html">Book Table</a></li>
<li class="nav-item"><a class="nav-link p-2" href="catering.html">Catering</a></li>
<li class="nav-item"><a class="nav-link p-2" href="contact-us.html">Contact Us</a></li>
</ul>
</div>
</nav>
<!--Hero image with main middle text-->
<div class="container-fluid top-container">
<div class="row">
<div class="col">
<section class="text-center background-header p-3 p-md-5">
<h1 class="main-header">Welcome To Spicy <img id="logo-img-header" src="./assets/images/logo-white.png" alt="Logo Image" /> Dhaba</h1>
<h4 class="main-header mb-4">Enjoy Dhaba Taste In Norway</h4>
<a href="book-table.html"><button class="btn btn-success btn-lg">Book Table</button></a>
<h4 class="sub-header mt-3">For take away call us 67 777 878</h4>
</section>
</div>
</div>
</div>
<!--Special dishes-->
<section class="container-fluid">
<div class="row mt-5">
<div class="col d-flex justify-content-center">
<h2 class="h2 sub-heading">Our Special Dishes</h2>
</div>
</div>
<div class="row mt-3 mx-4">
<div class="col-12 col-sm-6 col-lg-3">
<div class="card shadow-lg">
<img src="./assets/images/chicken-tikka.jpg" class="card-img-top speical-dishes-image" alt="chicken tikka image" />
<div class="card-body">
<h5 class="card-title">Chicken Tikka</h5>
<p>Small pieces of boneless chicken marinated in tandoori masala and roasted on skewers</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3">
<div class="card card-xs-margin shadow-lg">
<img src="./assets/images/pav-bhaji.png" class="card-img-top speical-dishes-image" alt="pav bhaji image" />
<div class="card-body">
<h5 class="card-title">Pav Bhaji</h5>
<p>Spicy curry of mixed vegetables cooked in a special spices and served with soft buttered pav</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3">
<div class="card card-sm-margin shadow-lg">
<img src="./assets/images/Achari-Murgha.png" class="card-img-top speical-dishes-image" alt="chicken tikka image" />
<div class="card-body">
<h5 class="card-title">Achari Murgh</h5>
<p>Chicken cooked with special blended hot spices with tomato, chilli and corinder</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3">
<div class="card card-sm-margin shadow-lg">
<img src="./assets/images/biryani.jpg" class="card-img-top speical-dishes-image" alt="Biryani image" />
<div class="card-body">
<h5 class="card-title">Biryani</h5>
<p>Marinated chicken mixed with special blended species cooked with aromatic basmati rice.</p>
</div>
</div>
</div>
</div>
</section>
<!--Review section-->
<section class="container-fluid">
<div class="row mt-5">
<div class="col-12 d-flex justify-content-center">
<h2 class="h2 sub-heading">What customer says about us?</h2>
</div>
</div>
<div class="row mt-3 mx-4">
<div class="col-12 col-lg-6">
<div class="border p-5 shadow-lg mt-2 d-md-flex justify-content-center">
<img class="review-image border border-2 d-block mx-auto" src="./assets/images/camila.jpg" alt="customer photo" />
<div class="ms-md-5 text-center text-md-start">
<h3 class="h3 review-image-heading mt-4">Really authentic Indian food</h3>
<blockquote class="blockquote mt-3">
<p class="fs-6 text-center text-md-start">The food was amazing and very ambient environment. I Will come back for sure and will recommend to my friends.</p>
<p class="blockquote-footer p-1">Camila</p>
</blockquote>
</div>
</div>
</div>
<div class="col-12 col-lg-6">
<div class="border p-5 shadow-lg mt-3 mt-lg-2 d-md-flex justify-content-center">
<img class="review-image border border-2 d-block mx-auto" src="./assets/images/man.jpg" alt="customer photo" />
<div class="ms-md-5 text-center text-md-start">
<h3 class="h3 review-image-heading mt-4">Really authentic Indian food</h3>
<blockquote class="blockquote mt-3">
<p class="fs-6">I am regular customer of the Spicy Dhaba reasturant. Place is very nice and food taste is quite amazing.</p>
<p class="blockquote-footer p-1">Michale</p>
</blockquote>
</div>
</div>
</div>
</div>
</section>
<!-- footer section-->
<footer class="container-fluid footer-bg sticky-bottom">
<div class="row mt-5 mx-3 justify-content-between">
<div class="col-12 col-md-3 text-light pt-3">
<h5 class="h5 mt-3 fw-bold text-center text-md-start">Address</h5>
<p class="text-center text-md-start">Dronning Eufemias gate 42, 0191 Oslo</p>
</div>
<div class="col-12 col-md-3 text-light pt-3">
<h5 class="h5 mt-3 fw-bold text-center text-md-start">Contact</h5>
<p class="text-center text-md-start">
+47 67 777 878 <br />
info@spicydhaba.com
</p>
</div>
<div class="col-12 col-md-3 text-light pt-3">
<h5 class="h5 mt-3 fw-bold text-center text-md-start">Opening Time</h5>
<p class="text-center text-md-start">
Tuesday-Friday: 15:00-22:00<br />
Saturday-Sunday: 15:00-23:00<br />
Monday: Close
</p>
</div>
</div>
<div class="row">
<div class="col">
<ul class="list-inline d-flex justify-content-center">
<li class="list-inline-item">
<a class="nav-link social-icon mx-2 text-white" href="http://www.facebook.com"
target="_blank"><i class="fab fa-facebook fa-2x"></i></a>
</li>
<li class="list-inline-item">
<a class="nav-link social-icon mx-2 text-white" href="http://www.instagram.com"
target="_blank"><i class="fab fa-instagram fa-2x"></i></a>
</li>
<li class="list-inline-item">
<a class="nav-link social-icon mx-2 text-light" href="http://www.tripadvisor.com"
target="_blank"><i class="fab fa-tripadvisor fa-2x"></i></a>
</li>
</ul>
</div>
</div>
<div class="row">
<div class="col">
<p class="text-white text-center">Copyright © 2021 Inspried Group</p>
</div>
</div>
</footer>
<!-- Bootstrap JS link -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
</body>
</html>