-
Notifications
You must be signed in to change notification settings - Fork 0
/
order.html
154 lines (154 loc) · 8.22 KB
/
order.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
<!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">
<link rel="shortcut icon" href="./images/logo.png" type="image/x-icon">
<link rel="stylesheet" href="./Style/order.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css">
<script src="./js/cart.js" async></script>
<title>Luigi's Order</title>
</head>
<!--Start of Tawk.to Script-->
<script type="text/javascript">
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/5ee663299e5f694422908a06/1fhj2uhoa';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
</script>
<!--End of Tawk.to Script-->
<body>
<header>
<div class="navbar">
<strong>
<div class="logo">
<img src="./images/logo.png" style="max-height: 150px; max-width: 150px;">
</div>
</strong>
</div>
<!--Cart icon-->
<div class="cart-info" id="cart-info">
<span class="cart-info-icon">
<i class="fas fa-shopping-cart"></i>
</span>
<p>
<span id="item-count">0</span> items
</p>
</div>
<!--end -->
<!--cart-->
<section>
<div class="cart" id="cart">
<h1 class="section-header">Cart</h1>
<div class="cart-row">
<span class="cart-item cart-header cart-column">ITEM</span>
<span class="cart-price cart-header cart-column">PRICE</span>
<span class="cart-quantity cart-header cart-column">QUANTITY</span>
</div>
<div class="cart-items">
</div>
<div class="cart-total">
<strong class="cart-total-title">
TOTAL
</strong>
<span class="cart-total-price">$0</span>
</div>
<button class="btn btn-primary btn-purchase" type="button">PURCHASE</button>
<button class="btn btn-primary btn-checkout" onclick="myFunction()" style="margin-left: 2rem;">DELIVERY</button>
<br><br>
<p id="delivery"></p>
</div>
</section>
</div>
<button class="button" style="vertical-align:right;" ><a href="./index.html"><span style="color:black; opacity: 8em; font-weight: 500; ">Back</span></a>
</button>
</header>
<div class="main-container">
<p class="title">Luigi's Pizza Order</p>
</div>
<h2>LUIGI'S PIZZA BAR IS OPEN FOR IN-PERSON DINING AND TAKEOUT.</h2>
<div class="order">
<img src="./images/order.png">
<h3>CALL (+254) 667-2929 TO ORDER BY PHONE.</h3>
</div>
<section class="container">
<div class="products">
<div class="product folders">
<img src="./images/small pizza.jpeg" class="product_image">
<h5 class="product-title"> SMALL PIZZA😋 </h5>
<br>
<p style="text-align: center; font-weight:bold;">Choose your favourite crust</p>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-label">Crispy</label>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-label"> Stuffed</label>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-label"> Gluten-free</label>
<div class="shop-items-details">
<p style="text-align: center; font-weight:bold; font-family: fantasy; color:red;">Choose your favourite toppings</p>
<input class="checkbox" type="checkbox" name="test1" value="yes" />
<label class="checkbox">Onions</label>
<input class="checkbox" type="checkbox" name="test2" value="yes" />
<label class="checkbox"> Chicken.</label>
<input class="checkbox" type="checkbox" name="test3" value="yes" />
<label class="checkbox"> Mushrooms</label>
<h3 class="product__price">Ksh300</h3>
<button class="btn btn-primary ADD-TO-CART">Add to Cart</button>
</div>
</div>
<div class="product files">
<img src="./images/medium pizza.jpeg" class="product_image">
<h5 class="product-title">MEDIUM PIZZA😋 </h5>
<br>
<p style="text-align: center; font-weight:bold;">Choose your favourite crust</p>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-label">Crispy</label>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-label"> Stuffed</label>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-label"> Gluten-free</label>
<div class="shop-items-details">
<p style="text-align: center; font-weight:bold; font-family: fantasy; color:red;">Choose your favourite toppings</p>
<input class="checkbox" type="checkbox" name="test1" value="yes" />
<label class="checkbox">Pepperoni</label>
<input class="checkbox" type="checkbox" name="test2" value="yes" />
<label class="checkbox">Sausage</label>
<input class="checkbox" type="checkbox" name="test3" value="yes" />
<label class="checkbox">Tomato</label>
<h3 class="product__price">Ksh800</h3>
<button class="btn btn-primary ADD-TO-CART">Add to Cart</button>
</div>
</div>
<div class="product images">
<img src="./images/large pizza.jpeg" class="product_image">
<h5 class="product-title">LARGE PIZZA😋 </h5>
<p style="text-align: center; font-weight:bold;">Choose your favourite crust</p>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-input">Crispy</label>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-input"> Stuffed</label>
<input class="radio-input" type="radio" name="test" value="yes" />
<label class="radio-input"> Gluten-free</label>
<div class="shop-items-details">
<p style="text-align: center; font-weight:bold; font-family: fantasy; color:red;">Choose your favourite toppings</p>
<input class="checkbox" type="checkbox" name="test1" value="yes" />
<label class="checkbox">Peppers</label>
<input class="checkbox" type="checkbox" name="test2" value="yes" />
<label class="checkbox">Extra Cheese</label>
<input class="checkbox" type="checkbox" name="test3" value="yes" />
<label class="checkbox">Spicy Pork</label>
<h3 class="product__price" >Ksh1000</h3>
<button class="btn btn-primary ADD-TO-CART" style="margin-top: 2em;">Add to Cart</button>
</div>
</div>
</div>
</section>
</section>
</body>
</html>