-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfood_order.html
71 lines (69 loc) · 3.49 KB
/
food_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
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<div class="top_header_div">
<h1 class="main_header">Order Food</h1>
</div>
<div class="nav_btns_div">
<button id="home_btn">Home</button>
</div>
<div id="main_order_panel_div" class="main_order_panel_div">
<div id="pre_order_panel_div" class="pre_order_panel_div_class">
<button id="start_order_btn" class="start_order_btn_class">Start Order</button>
</div>
<div id="order_panel_div" class="order_panel_div_class">
<div id="current_food_img_div" class="current_food_img_div">
<img id="current_food_img" class="current_food_img"></img>
</div>
<div id="side_order_panel_div" class="side_order_panel_div">
<h3>Select a dish:</h3>
<select id="dish_selection_dropdown" class="dish_selection_dropdown">
</select>
<h3 class="side_order_panel_div_child">Quantity:</h3>
<div id="quantity_input_div" class="quantity_input_div">
<button id="increase_quantity_btn">+</button>
<input id="quantity_input_box" class="quantity_input_box" value="1"></input>
<button id="decrease_quantity_btn">-</button>
</div>
<h3 id="calculated_price_tag">Price: S$</h3>
<button id="add_to_order_btn">Add To Order</button>
<button id="view_order_details_btn">View Order Details</button>
<button id="cancel_order_btn">Cancel Order</button>
<popup id="add_to_order_status_popup"></popup>
</div>
</div>
<div id="view_order_panel_div" class="view_order_panel_div_class">
<h2>Current Order Details</h2>
<div id="order_details_grid" class="order_details_grid_class">
</div>
<div id="view_order_panel_btns_div" class="view_order_panel_btns_div_class">
<button id="back_to_order_btn">Back To Order</button>
<button id="purchase_btn">Proceed To Checkout</button>
</div>
</div>
<div id="post_order_panel_div" class="post_order_panel_div_class">
<h2 id="payment_details_section_header">Enter your payment details</h2>
<div id="payment_details_grid" class="payment_details_grid_class">
<h3>Card Number:</h3>
<input id="card_number_input_box" class="payment_details_input_box"></input>
<h3>MM/YY:</h3>
<input id="card_mm_yy_input_box" class="payment_details_input_box"></input>
<h3>CSV:</h3>
<input id="card_csv_input_box" class="payment_details_input_box"></input>
<h3>Street Address:</h3>
<input id="street_address_input_box" class="payment_details_input_box"></input>
<h3>Unit No.:</h3>
<input id="unit_no_input_box" class="payment_details_input_box"></input>
<h3>Postal Code:</h3>
<input id="postal_code_input_box" class="payment_details_input_box"></input>
</div>
<button id="complete_payment_btn">Make Payment</button>
<popup id="order_completion_status_popup" class="order_completion_status_popup_class">Transaction successful. Your order will be arriving shortly.</popup>
</div>
</div>
</body>
<script src="food_order_page_script.js"></script>
</html>