-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathpay1.html
81 lines (78 loc) · 2.61 KB
/
pay1.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
<!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>Pay1_Part</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet">
<style>
* {
font-family: 'Roboto', sans-serif;
}
#main {
width: 35%;
margin: auto;
margin-top: 12%;
padding: 3%;
box-shadow: 0px 11px 15px -7px rgb(0 0 0 / 20%), 0px 24px 38px 3px rgb(0 0 0 / 14%), 0px 9px 46px 8px rgb(0 0 0 / 12%);
}
#box {
display: grid;
grid-template-columns: 48% 48%;
gap: 4%;
padding: 5px;
}
#box > div {
border: 1px solid rgba(8, 124, 221, 0.5);
border-radius: 5px;
color: #087cdd;
text-align: center;
margin-bottom: 10px;
padding: 10px 0px 10px 0px;
font-weight: 500;
font-size: 14px;
line-height: 25px;
background-color: transparent;
cursor: pointer;
transition-property: background-color, box-shadow, border;
transition-duration: 250ms, 250ms, 250ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1), cubic-bezier(0.4, 0, 0.2, 1), cubic-bezier(0.4, 0, 0.2, 1);
transition-delay: 0ms, 0ms, 0ms;
}
h4{
font-weight: 500;
line-height: 32px;
font-size: 20px;
color: #3c4858;
}
span{
padding-top: 0px;
}
</style>
</head>
<body>
<div id="main">
<h4>Pay Via</h4>
<div id="box">
<div class="card"><span class="material-icons">
credit_card</span>CREDIT CARD</div>
<div class="card" id="debit_card"><span class="material-icons">
credit_card</span>DEBIT CARD</div>
<div class="card">NETBANKING</div>
<div class="card">PAYTM</div>
<div class="card">UPI</div>
<div class="card">EMI(CREDIT CARD)</div>
</div>
</div>
</body>
</html>
<script>
document.getElementById("debit_card").addEventListener("click", function(){
location.href='pay2.html';
});
</script>