-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
160 lines (160 loc) · 6.3 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
<!DOCTYPE html>
<html lang="en">
<head>
<title>Pezza - Entelect</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/style.css" />
</head>
<body data-bs-theme="dark" class="text-light" style="background-image: url(images/space-background-dark.jpg)">
<div class="px-4 py-5 my-5 text-center">
<img class="d-block mx-auto mb-4" src="./images/pezza-logo.png" alt="" height="200" />
<h3 class="fw-bold">Pezza has built a strong reputation as a small, family-run restaurant.</h3>
<div class="col-lg-6 mx-auto">
<p class="lead mb-4">
<em>Established in 1940</em>
</p>
<img class="col-12 col-lg-6 img-fluid" src="images/p17.png" alt="pizza" />
</div>
</div>
<form id="pezza-form">
<section class="ftco-section">
<div class="container">
<div class="row justify-content-center mb-5 pb-3">
<div class="col-md-7 heading-section text-center">
<hr />
<h2 class="mb-4">Our Menu</h2>
<hr />
</div>
</div>
</div>
<div class="container">
<div class="checkbox-group required">
<div class="row no-gutters d-flex">
<div class="col-lg-4 d-flex">
<div class="services-wrap d-flex">
<img class="col-4" src="images/p5.jpeg" class="img-fluid" />
<div class="text p-4">
<h4>Veggie Pizza</h4>
<h4 class="price"><span>89.90</span></h4>
<div class="form-check">
<input name="pizza-selection" class="form-check-input" type="checkbox" value="veggie" id="pizza1" />
<label class="form-check-label" for="pizza1"> Add to my order </label>
</div>
</div>
</div>
</div>
<div class="col-lg-4 d-flex">
<div class="services-wrap d-flex">
<img class="col-4" src="images/p6.jpeg" class="img-fluid" />
<div class="text p-4">
<h4>Pepperoni Pizza</h4>
<h4 class="price"><span>99.90</span></h4>
<div class="form-check">
<input name="pizza-selection" class="form-check-input" type="checkbox" value="pepperoni" id="pizza2" />
<label class="form-check-label" for="pizza2"> Add to my order </label>
</div>
</div>
</div>
</div>
<div class="col-lg-4 d-flex">
<div class="services-wrap d-flex">
<img class="col-4" src="images/p7.jpeg" class="img-fluid" />
<div class="text p-4">
<h3>Meat Pizza</h3>
<h4 class="price"><span>99.90</span></h4>
<div class="form-check">
<input name="pizza-selection" class="form-check-input" type="checkbox" value="meat" id="pizza3" />
<label class="form-check-label" for="pizza3"> Add to my order </label>
</div>
</div>
</div>
</div>
</div>
<br />
<div class="row no-gutters d-flex">
<div class="col-lg-4 d-flex">
<div class="services-wrap d-flex">
<img class="col-4" src="images/p8.jpeg" class="img-fluid" />
<div class="text p-4">
<h3>Margherita Pizza</h3>
<h4 class="price"><span>99.90</span></h4>
<div class="form-check">
<input name="pizza-selection" class="form-check-input" type="checkbox" value="margherita" id="pizza4" />
<label class="form-check-label" for="pizza4"> Add to my order </label>
</div>
</div>
</div>
</div>
<div class="col-lg-4 d-flex">
<div class="services-wrap d-flex">
<img class="col-4" src="images/p9.jpeg" class="img-fluid" />
<div class="text p-4">
<h3>BBQ Chicken Pizza</h3>
<h4 class="price"><span>99.90</span></h4>
<div class="form-check">
<input name="pizza-selection" class="form-check-input" type="checkbox" value="bbq-chicken" id="pizza5" />
<label class="form-check-label" for="pizza5"> Add to my order </label>
</div>
</div>
</div>
</div>
<div class="col-lg-4 d-flex">
<div class="services-wrap d-flex">
<img class="col-4" src="images/p10.jpeg" class="img-fluid" />
<div class="text p-4">
<h3>Hawaiian Pizza</h3>
<h4 class="price"><span>89.90</span></h4>
<div class="form-check">
<input name="pizza-selection" class="form-check-input" type="checkbox" value="hawaiian" id="pizza6" />
<label class="form-check-label" for="pizza6"> Add to my order </label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<br />
<br />
</section>
<div class="container">
<div class="row justify-content-center pb-3">
<div class="col-md-7 heading-section text-center">
<hr />
<h2 class="mb-4">Order</h2>
<hr />
</div>
</div>
</div>
<div class="col-md-10 mx-auto col-lg-5">
<form class="p-4 p-md-5 border rounded-3 bg-body-tertiary">
<div class="alert alert-success text-center" role="alert">An order for your pizza has been placed, <br/>and it will arrive piping hot!</div>
<div class="alert alert-danger text-center" role="alert">Please choose a pizza from our menu.</div>
<div class="form-floating mb-3">
<input name="name" required type="text" class="form-control" id="floatingName" placeholder="name" />
<label for="floatingName">Name</label>
</div>
<div class="form-floating mb-3">
<input name="email" required type="email" class="form-control" id="floatingEmail" placeholder="name@example.com" />
<label for="floatingEmail">Email address</label>
</div>
<div class="form-floating mb-3">
<input name="cellphone" required type="tel" class="form-control" id="floatingCellphone" placeholder="0721230000" />
<label for="floatingCellphone">Cellphone</label>
</div>
<div class="form-floating mb-3">
<textarea name="address" required class="form-control" id="floatingAddress"></textarea>
<label for="floatingAddress">Address</label>
</div>
<button class="w-100 btn btn-lg btn-primary" type="submit">Order</button>
</form>
</div>
<br/>
<br/>
</form>
<script src="js/bootstrap.bundle.min.js"></script>
<script src="js/index.js"></script>
</body>
</html>