forked from javichur/nfest-xrpl-hackathon
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.php
150 lines (136 loc) · 5.76 KB
/
index.php
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
<html>
<head>
<link href="vendor/frogator/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="vendor/frogator/css/icons.css" rel="stylesheet" type="text/css">
<link href="vendor/frogator/css/style.css" rel="stylesheet" type="text/css">
<script src='https://unpkg.com/[email protected]'></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" integrity="sha512-vKMx8UnXk60zUwyUnUPM3HbQo8QfmNx7+ltw8Pm5zLusl1XIfwcxo8DbWCqMGKaWeNxWA8yrx5v3SaVpMvR3CA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.header {
width: 500px;
position: relative;
display: block;
margin: 0 auto;
}
body {
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
background-size: 1400% 1400%;
animation: gradient 15s ease infinite;
height: 100vh;
}
.card {
border: none !important;
background-color: rgb(255 255 255 / 77%);
}
@keyframes gradient {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
.card_op {
height: 277px
}
</style>
</head>
<body>
<div class="page-content m-0">
<div class="content-fluid">
<div class="row mb-4 pt-5">
<div class="col-12">
<div class=" d-flex align-items-center">
<div class="header text-center">
<!-- <img src="assets/images/logo-sm.png" alt="" class="thumb-sm"> -->
<h3 class="mt-3 text-white">Congratulations!</h3>
<div class="border w-25 mx-auto border-white"></div>
<h1 class="">You have received a custom NFT<img class=" text-white" src="/vendor/img/xrplogo.svg" style="width:120px;margin-top: -6px;"></h1>
<p class="font-14 mt-3 text-white">Please, connect your wallet or create a new one to claim the reward.</p>
</div>
</div>
</div>
</div>
<seccion id='add_wallet'>
<div class="row justify-content-center mt-4 pt-4">
<div class="col-lg-4 col-10 mb-4">
<div class="card border mb-0 text-center">
<div class="card-body card_op">
<h5 class="card-title"><i class="mdi mdi-wallet-outline text-danger" style="font-size: 60px;"></i></h5>
<h5 class="card-title">Connect your wallet</h5>
<input class="form-control" type="password" id="secret">
<p class="card-text">Enter your credentials to connect your wallet</p><a id="connect" class="btn btn-danger text-white">CONNECT</a>
</div>
</div>
</div>
<div class="col-lg-4 col-10 mb-4">
<div class="card border mb-0 text-center">
<div class="card-body card_op">
<h5 class="card-title"><i class="mdi mdi-plus-circle text-success" style="font-size: 60px;"></i></h5>
<h5 class="card-title">Create new wallet</h5>
<p class="card-text">Click the botton below, and don´t forget to copy your credentials</p><br><a id="create" class="btn btn-success text-white">CREATE</a>
</div>
</div>
</div>
</div>
</seccion>
<seccion id='loaders' style="display: none;">
<div class="row justify-content-center mt-4 pt-4">
<div class="col-lg-8">
<div class="card border mb-0 text-center">
<div class="card-body">
<h5 class="card-title"><i id="iconLoad" class="mdi mdi-wallet-outline text-danger" style="font-size: 60px;"></i></h5>
<h5 id="progress-def" class="card-title">Connect your wallet</h5>
<div class="progress mb-3" style="height: 18px;">
<div class="progress-bar progress-bar-striped progress-bar-animated loader " id="progressbar" role="progressbar" style="width: 0%;"></div>
</div>
</div>
</div>
</div>
</div>
</seccion>
<seccion id='galery' style="display: none;">
<div class="row justify-content-left m-4">
<div class="col-12 m-1">
<div class="card border mb-0 text-left">
<div class="card-body row">
<h5 class="card-title col-2"><i class="mdi mdi-wallet-outline text-danger" style="font-size: 60px;"></i></h5>
<div class="col-8">
<h5 class="card-title">WALLET INFO</h5>
<p class="card-text text-muted font-13 m-1"><strong>Secret: </strong><span id='w-secret'></span></p>
<p class="card-text text-muted font-13 m-1"><strong>Address: </strong><span id='w-addres'></span></p>
<p class="card-text text-muted font-13 m-1"><strong>Public Key: </strong><span id='publicK'></span></p>
</div>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class=" d-flex align-items-center">
<div class="header text-center">
<h3 class="mt-3 text-white">NFT COLLECTION</h3>
<div class="border w-25 mx-auto border-white"></div>
</div>
</div>
</div>
<div id="nft-container" class="row justify-content-left m-4">
</div>
</seccion>
</div>
</div>
<script>
const tokenOfferIdex = '<?= $_GET['tokenoffer'] ?>';
</script>
<script src="https://cdnout.com/jquery/"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.1.1/toastr.min.js"></script>
<script>
toastr.options = {
"positionClass": "toast-top-center",
}
</script>
<script src="index.js"></script>
</body>
</html>