-
Notifications
You must be signed in to change notification settings - Fork 22
/
Copy pathcart-2.html
118 lines (68 loc) · 2.25 KB
/
cart-2.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
<!DOCTYPE html>
<html>
<head>
<title>POCO M2 Pro</title>
<link rel="stylesheet" type="text/css" href="css/cart-2.css">
<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="apple-touch-icon" sizes="180x180" href="image/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="image/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="image/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
</head>
<body>
<div class="container">
<h1>Shopping Cart</h1>
<div class="cart">
<div class="products">
<div class="product">
<img src="image/book-2.png">
<div class="product-info">
<h3 class="product-name" style="font-size: 40px;">POCO M2 Pro</h3>
<h4 class="product-offer" style="font-size: 25px;">Offer Price</h4>
<h4 class="product-price" style="font-size: 30px;">₹ 9,999</h4>
<p class="product-quantity" style="margin-left: 20px;">Qty
<form>
<div class="value-button" id="decrease" onclick="decreaseValue()" value="Decrease Value">-</div>
<input type="number" id="number" value="0" />
<div class="value-button" id="increase" onclick="increaseValue()" value="Increase Value">+</div>
</form>
</p>
<p class="product-remove">
<i class="fa fa-trash" aria-hidden="true"></i>
<span class="remove">Remove</span>
</p>
</div>
</div>
<div class="cart-total">
<p>
<span>Selling Price</span>
<span>₹ 13,999</span>
</p>
<p>
<span>Offer Price</span>
<span>₹ 9,999</span>
</p>
<p>
<span>You Saved</span>
<span>₹ 5,000</span>
</p>
<a href="payment.html">Proceed to Checkout</a>
</div>
</div>
</div>
</body>
<script>
function increaseValue() {
var value = parseInt(document.getElementById('number').value, 10);
value = isNaN(value) ? 0 : value;
value++;
document.getElementById('number').value = value;
}
function decreaseValue() {
var value = parseInt(document.getElementById('number').value, 10);
value = isNaN(value) ? 0 : value;
value < 1 ? value = 1 : '';
value--;
document.getElementById('number').value = value;
}</script>
</html>