-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathshopping_cart.html
238 lines (208 loc) · 11.5 KB
/
shopping_cart.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
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<script src="https://kit.fontawesome.com/b84bc68d5e.js" crossorigin="anonymous"></script>
<title>SHOPPING CART</title>
<meta name="description" content="Oh my... What am I doing here?">
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<!--header begins -->
<div class=" header">
<div class="header_upper container">
<div class="search">
<a href="index.html"><div class="logo">
<img src="img/logo.png" alt="logo" title="logo"><div class="name">
bran <span class="letter">d</span></div></div></a>
<form action="#" class="browse_panel_form">
<div class="search_pannel">
<div class="browse"><button>browse<a href="#"><i class="fas fa-caret-down"></i></a></button></div>
<div class="search_for_item">
<div class="search_form">
<input type="search" name="search_input" placeholder="Search for Item...">
</div>
<div class="magnifier"><button><a href="#"><i class="fas fa-search"></i></a></button>
</div></div>
</div>
</form>
</div>
<div class="account">
<div class="cart"><a href="shopping_cart.html"><img src="img/cart.png" alt="cart" title="cart"></a></div>
<form action="#" class="my_account_form">
<a href="#"><div class="my_account"><button>my account<a href="#"><i class="fas fa-caret-down"></i></a></button></div></a>
</form>
</div>
</div>
<div class="navmenu"><a href="index.html"><div class="menu_item">Home</div> </a> <a href="#"><div class="menu_item">Man</div></a> <a href="#"><div class="menu_item">Women</div></a> <a href="#"><div class="menu_item">Kids</div></a> <a href="#"><div class="menu_item">Accoseriese</div> </a> <a href="#"><div class="menu_item">Featured</div></a> <a href="#"><div class="menu_item">Hot Deals </div></a> </div>
</div>
<!--header ends -->
<!--breadcrumbs begins-->
<div class="breadcrumbs">
<div class="breadcrumbs_container container">
<div class="breadcrumbs_active"><a href="#">New Arrivals</a> </div>
<div class="breadcrumbs_menu">
<a href="#">Home</a> / <a href="#">Men</a> /<span> <a href="#">New Arrivals</a></span>
</div>
</div>
</div>
<!--breadcrumbs ends-->
<!--cart begins -->
<form class="cart_form container" action="#">
<div class="cart_container container">
<div class="product_details">
<div class="cart_header"><span>product details</span></div>
<div class="cart_raw cart_raw_product">
<div class="cart_raw_pic"><img src="img/Layer_43.jpg"></div>
<div class="description">
<div class="product_name">Mango People T-shirt</div>
<div class="product_color"><span>Color:</span> Red</div>
<div class="product_size"><span>Size:</span> Xll</div>
</div>
</div>
<div class="cart_raw cart_raw_product">
<div class="cart_raw_pic"><img src="img/Layer_44.jpg"></div>
<div class="description">
<div class="product_name">Mango People T-shirt</div>
<div class="product_color"><span>Color:</span> Red</div>
<div class="product_size"><span>Size:</span> Xll</div>
</div>
</div>
<div class="cart_raw cart_raw_product">
<div class="cart_raw_pic"><img src="img/Layer_45.jpg"></div>
<div class="description">
<div class="product_name">Mango People T-shirt</div>
<div class="product_color"><span>Color:</span> Red</div>
<div class="product_size"><span>Size:</span> Xll</div>
</div>
</div>
</div>
<div class="other_columns">
<div class="unite_price">
<div class="cart_header"><span>unite Price</span></div>
<div class="cart_raw raw"><span>$150</span></div>
<div class="cart_raw raw"><span>$150</span></div>
<div class="cart_raw raw"><span>$150</span></div>
</div>
<div class="quantity">
<div class="cart_header"><span>Quantity</span></div>
<div class="cart_raw raw">
<input name="quantity" pattern="\d [0-9]" placeholder="2">
</div>
<div class="cart_raw raw">
<form>
<input name="quantity" pattern="\d [0-9]" placeholder="2">
</form>
</div>
<div class="cart_raw raw">
<form>
<input name="quantity" pattern="\d [0-9]" placeholder="2">
</form>
</div>
</div>
<div class="shipping">
<div class="cart_header"><span>shipping</span></div>
<div class="cart_raw raw"><span>FREE</span></div>
<div class="cart_raw raw"><span>FREE</span></div>
<div class="cart_raw raw"><span>FREE</span></div>
</div>
<div class="subtotal">
<div class="cart_header"><span>subtotal</span></div>
<div class="cart_raw raw"><span>$300</span></div>
<div class="cart_raw raw"><span>$300</span></div>
<div class="cart_raw raw"><span>$300</span></div>
</div>
<div class="action">
<div class="cart_header"><span>action</span></div>
<div class="cart_raw raw"><a href="#"><i class="fas fa-times-circle"></i></a></div>
<div class="cart_raw raw"><a href="#"><i class="fas fa-times-circle"></i></a></div>
<div class="cart_raw raw"><a href="#"><i class="fas fa-times-circle"></i></a></div>
</div>
</div>
<div class="cart_header">
</div>
</div>
<div class="cart_buttons container">
<div><button class="clear"><span>cLEAR SHOPPING CART</span></button></a></div>
<div></div> <button class="continue"><span>cONTINUE sHOPPING</span></button></div>
</div>
<div class="cart_basement container">
<div class="shipping"> <form action="#" class="shipping_adress">
<div class="shipping_container">
<div class="cart_basement_header">
Shipping Adress
</div>
<div class="country"><i class="fas fa-caret-down"></i><input type="text" placeholder="Bangladesh"></div>
<div class="state"><input type="text" placeholder="State"></div>
<div class="postcode"><input type="text" placeholder="Postcode / Zip"></div>
<div class="shipping_button"><button><span>get a quote</span></button></div>
</div>
</form></div>
<div class="coupon"><form action="#" class="coupon_discount">
<div class="coupon_container">
<div class="cart_basement_header">
coupon discount
</div>
<div class="enter_code">
Enter your coupon code if you have one
</div>
<div class="coupon_state"><input type="text" placeholder="State"></div>
<div class="coupon_button"><button><span>Apply coupon</span></button></div>
</div>
</form></div>
<div class="total">
<div class="sub_total">
<div class="sub_total_left">Sub total</div>
<div class="sub_total_right">$900</div>
</div>
<div class="grand_total">
<div class="grand_total_left">GRAND TOTAL</div>
<div class="grand_total_right">$900</div>
</div>
<div class="proceed"><button>proceed to checkout</button></div>
</div>
</div>
</form>
<!--cart ends -->
<!--footer begins -->
<div class="footer">
<div class="double_grey" style=" background-image: url(img/grey.jpg);
background-repeat: no-repeat;
background-position: bottom; background-size:86%"><div class="d_g_left">
</div><div class="d_g_center"></div><div class="d_g_right"></div></div>
<div class="d_g_blocks"></div>
<div class="container"> <div class="left_block"><div class="l_b_left"><div class="lady"><img src="img/lady.png"></div><div class="lady_text"><div class="l_text_first">“Vestibulum quis porttitor dui! Quisque viverra nunc mi,
a pulvinar purus condimentum a. Aliquam condimentum mattis neque sed pretium”</div><div class="l_text_second">Bin Burhan
</div><div class="l_text_third">Dhaka, Bd</div><div class="l_fourth"><div class="grey_square"></div><div class="rose_square"></div><div class="grey_square2"></div> </div></div></div>
<div class="l_b_right"><div class="upper" align="center"><span>Subscribe
</span><br>FOR OUR NEWLETTER AND PROMOTION</div><div class="lower">
<div class="grey_button">
<form action="#">
<input type="text" name="email" placeholder="Enter Your Email">
</form>
</div>
<div class="rose_button"><div class="subscribe">Subscribe</div></div></div></div></div></div>
<div class="many_letters container">
<div class="frst_col"><a href="index.html"><div class="logo scnd_logo">
<img src="img/logo.png" alt="logo" title="logo"><div class="name">
bran <span class="letter">d</span></div></div></a>
<div class="scnd_line"><div>Objectively transition extensive data rather than cross functional solutions. Monotonectally syndicate multidisciplinary materials before go forward benefits. Intrinsicly syndicate an expanded array of processes and cross-unit partnerships.</div><div>Efficiently plagiarize 24/365 action items and focused infomediaries.
Distinctively seize superior initiatives for wireless technologies. Dynamically optimize.</div> </div>
</div>
<div class="scnd_col"><div class="rose_col_head"><a href="#">COMPANY</a></div><div class="f_line"><a href="#">Home</a> </div><div class="f_line"><a href="#">Shop</a></div><div class="f_line"><a href="#">About</a></div><div class="f_line"><a href="#">How It Works</a></div><div class="f_line"><a href="#">Contact</a></div></div>
<div class="thrd_col"><div class="rose_col_head"><a href="#">INFORMATION</a></div><div class="f_line"><a href="#">Tearms & Condition</a></div><div class="f_line"><a href="#">Privacy Policy</a></div><div class="f_line"><a href="#">How to Buy</a></div><div class="f_line"><a href="#">How to Sell</a></div><div class="f_line"><a href="#">Promotion</a></div></div>
<div class="frth_col"><div class="rose_col_head"><a href="#">SHOP CATEGORY</a></div><div class="f_line"><a href="#">Men</a></div><div class="f_line"><a href="#">Women</a></div><div class="f_line"><a href="#">Child</a></div><div class="f_line"><a href="#">Apparel</a></div><div class="f_line"><a href="#">Brows All</a></div></div>
</div>
<div class="footer_base"><div class="end container"><div class="all_rights"><br>© 2017 Brand All Rights Reserved.</div>
<div class="social">
<a href="#"><div class="facebook"><i class="fab fa-facebook-f"></i></div></a>
<a href="#"><div class="twitter"><i class="fab fa-twitter"></i></div></a>
<a href="#"><div class="linked_in"><i class="fab fa-linkedin-in"></i></div></a>
<a href="#"><div class="pinterest"><i class="fab fa-pinterest-p"></i></div></a>
<a href="#"><div class="google_plus"><i class="fab fa-google-plus-g"></i></div></a>
</div></div></div>
</div>
<!--footer ends -->
</body>
</html>