-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathcheckout-delivery.html
152 lines (144 loc) · 7.31 KB
/
checkout-delivery.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
<!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">
<title>DELIVERY OPTION | UNIQLO IN</title>
<script src="https://kit.fontawesome.com/f7879b5792.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="/styles/nav.css" />
<script src="https://kit.fontawesome.com/f7879b5792.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="/styles/nav.css" />
<link rel="stylesheet" href="./styles/checkout-delivery.css"/>
<link rel="stylesheet" href="./styles/footer.css" />
<link rel="shortcut icon" href="https://asset.uniqlo.com/logotypes/uniqlo_roman.ico">
</head>
<body>
<div id="navbarContainer"></div>
<div id="main">
<div class="pageLinks">
<p> <a href="index.html">UNIQLO HOME PAGE</a>/
<a href="cart.html">SHOPPING CART</a>/<p id="this">DELIVERY</p>
</p>
</div>
<h1>CHECKOUT</h1>
<div id="cartDiv">
<div class="showCartDiv">
<div class="leftDiv">
<div>
<h1 style="margin-left:20px;">1.DELIVERY OPTION</h1>
<hr>
<div class="deliveryOption">
<div>
<table width="100%">
<tr>
<td><input type="radio" id="premiumShipping" name="deliveryOption" value="premiumShipping"></td>
<td><label for="premiumShipping">Ship To Address Shipping Rs. 100.00</label></td>
</tr>
</table>
</div>
<div>
<table width="100%">
<tr>
<td><input type="radio" id="freeShipping" name="deliveryOption" value="freeShipping"></td>
<td><label for="freeShipping">Click & Collect <br> Shipping: FREE <br> Note - Please wait for delivery
email (about 2-10 days) before visiting store.</label></td>
</tr>
</table>
</div>
</div>
<hr>
<h1 style="margin-left:20px;">REGISTER A NEW ADDRESS</h1>
<div id="deliveryForm">
<table width="100%">
<tr>
<td>
<h3>FIRST NAME</h3>
</td>
<td>
<input type="text" id="firstName" placeholder="Please enter your first name in alphabets." />
</td>
</tr>
<tr>
<td>
<h3>LAST NAME</h3>
</td>
<td>
<input type="text" id="lastName" placeholder="Please enter your last name in alphabets." />
</td>
</tr>
<tr>
<td>
<h3>PINCODE</h3>
</td>
<td>
<input type="text" id="pincode" placeholder="Please enter your Pincode." />
</td>
</tr>
<tr>
<td>
<h3>ADDRESS DETAIL 1</h3>
</td>
<td>
<input type="text" id="add1" placeholder="Street & Number, P.O. Boc, C/O" />
</td>
</tr>
<tr>
<td>
<h3>ADDRESS DETAIL 2 </h3>
</td>
<td>
<input type="text" id="add2" placeholder="Apt., Suit, Unit, Building, Floor, etc." />
</td>
</tr>
<tr>
<td>
<h3>CITY</h3>
</td>
<td>
<input type="text" id="city" placeholder="Please enter your City." />
</td>
</tr>
<tr>
<td>
<h3>STATE</h3>
</td>
<td>
<input type="text" id="state" placeholder="Please enter your State." />
</td>
</tr>
<tr>
<td>
<h3>MOBILE PHONE</h3>
</td>
<td>
<input type="tel" id="mobile" placeholder="Please enter your Mobile Number." />
</td>
</tr>
</table>
<p>You may be contacted via phone or email if we have questions about your order and delivery option.</p>
<input type="checkbox" id="billing"><label for="billing">Use as billing address</label>
<br><br>
<button onclick="goToNextPage()">CONTINUE TO PAYMENT</button>
</div>
</div>
<div><h3 style="margin-left:20px;">2.PAYMENT OPTION</h3></div>
<div><h3 style="margin-left:20px;">3. ORDER CONFIRMATION</h3></div>
<div><i class="fas fa-lock"></i> We encrypt all your sensitive information with TLS (Transport Layer Security) encryption technology.</div>
</div>
<div class="rightDiv"></div>
</div>
</div>
</div>
<div id="footerDiv"></div>
</body>
</html>
<script type="text/javascript" src="./scripts/checkout-delivery.js"></script>
<script type="module">
import footer from './components/footer.js';
// let footerDiv = document.getElementById('div');
// footerDiv.innerHTML = footer();
document.getElementById('footerDiv').innerHTML = footer();
</script>
<script type="module" src="./scripts/main.js">
</script>