-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
612 lines (589 loc) · 58.5 KB
/
index.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
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Crypto Stars</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="description" content="Crypto stars">
<link rel="preload" href="fonts/exo2-regular.woff2" as="font" crossorigin="anonymous">
<link rel="preload" href="fonts/exo2-semibold.woff2" as="font" crossorigin="anonymous">
<link rel="preload" href="fonts/exo2-bold.woff2" as="font" crossorigin="anonymous">
<link rel="stylesheet" href="./leaflet/leaflet.css">
<link rel="stylesheet" href="css/style.min.css">
</head>
<body>
<div class="visually-hidden">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<symbol id="crypto-stars-logo" viewBox="0 0 92 36">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M20.7313 4.26901C18.0155 3.72882 15.2006 4.00607 12.6424 5.0657C10.0843 6.12532 7.89776 7.91974 6.35942 10.222C4.82108 12.5243 4 15.2311 4 18C4 20.7689 4.82109 23.4757 6.35943 25.778C7.89777 28.0803 10.0843 29.8747 12.6424 30.9343C15.2006 31.9939 18.0155 32.2712 20.7313 31.731C23.447 31.1908 25.9416 29.8574 27.8995 27.8995C28.6805 27.1185 29.9469 27.1185 30.7279 27.8995C31.509 28.6805 31.509 29.9469 30.7279 30.7279C28.2106 33.2453 25.0033 34.9596 21.5116 35.6541C18.02 36.3487 14.4008 35.9922 11.1117 34.6298C7.82263 33.2675 5.01141 30.9604 3.03355 28.0003C1.05568 25.0402 0 21.5601 0 18C0 14.4399 1.05568 10.9598 3.03355 7.99975C5.01141 5.03966 7.82263 2.73256 11.1117 1.37018C14.4008 0.00779963 18.02 -0.348661 21.5116 0.345873C25.0033 1.04041 28.2106 2.75474 30.7279 5.27208C31.509 6.05313 31.509 7.31946 30.7279 8.10051C29.9469 8.88156 28.6805 8.88156 27.8995 8.10051C25.9416 6.14258 23.447 4.80921 20.7313 4.26901Z"
fill="#4B6AA8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M40.845 23.048C41.1761 23.048 41.5232 23.0587 41.8864 23.08C42.2602 23.1013 42.6287 23.128 42.9918 23.16C43.3549 23.192 43.6967 23.2293 44.0171 23.272L43.921 24.024C43.4404 23.992 42.9491 23.9707 42.4471 23.96C41.9451 23.9387 41.4538 23.928 40.9732 23.928C40.4606 23.9173 40.0494 23.9333 39.7396 23.976C39.4406 24.008 39.2163 24.1147 39.0668 24.296C38.9279 24.4667 38.8585 24.7547 38.8585 25.16C38.8585 25.6187 38.96 25.9333 39.1629 26.104C39.3658 26.264 39.6649 26.3813 40.06 26.456L42.4471 26.904C43.0452 27.0213 43.4884 27.2347 43.7768 27.544C44.0758 27.8533 44.2254 28.328 44.2254 28.968C44.2254 29.6187 44.1079 30.0987 43.8729 30.408C43.6379 30.7173 43.2802 30.92 42.7995 31.016C42.3189 31.1227 41.7208 31.176 41.0052 31.176C40.6955 31.176 40.279 31.1653 39.7556 31.144C39.243 31.1227 38.6716 31.064 38.0415 30.968L38.1216 30.232C38.4099 30.2427 38.6983 30.2587 38.9867 30.28C39.275 30.2907 39.5687 30.3013 39.8678 30.312H40.829C41.4378 30.3013 41.9184 30.2693 42.2709 30.216C42.6233 30.152 42.8743 30.024 43.0238 29.832C43.1734 29.64 43.2481 29.352 43.2481 28.968C43.2481 28.52 43.1253 28.216 42.8796 28.056C42.6447 27.896 42.3403 27.7787 41.9665 27.704L39.5954 27.272C39.2003 27.1867 38.8745 27.064 38.6182 26.904C38.3619 26.7333 38.1696 26.5093 38.0415 26.232C37.924 25.944 37.8652 25.5867 37.8652 25.16C37.8652 24.5413 37.972 24.0827 38.1856 23.784C38.3993 23.4747 38.725 23.272 39.1629 23.176C39.6008 23.08 40.1615 23.0373 40.845 23.048ZM52.458 23.24V20.904H51.4487V23.2459L50.0389 23.32V24.072H51.4487V29.192C51.4487 29.8213 51.6089 30.3013 51.9293 30.632C52.2604 30.9627 52.741 31.128 53.3712 31.128C53.4887 31.128 53.6435 31.1227 53.8358 31.112C54.028 31.1013 54.2256 31.08 54.4285 31.048C54.6421 31.0267 54.829 30.9947 54.9893 30.952L54.8611 30.2H53.5955C53.211 30.2 52.9226 30.1093 52.7304 29.928C52.5488 29.7467 52.458 29.4587 52.458 29.064V24.072H55.0854V23.24H52.458ZM64.9402 23.048C65.4742 23.048 65.9228 23.128 66.2859 23.288C66.6598 23.4373 66.9428 23.688 67.135 24.04C67.3273 24.3813 67.4234 24.8453 67.4234 25.432V31H66.6224L66.494 29.6415C66.3944 29.7374 66.277 29.8383 66.1418 29.944C65.9068 30.136 65.6291 30.3227 65.3087 30.504C64.999 30.6853 64.6519 30.8347 64.2674 30.952C63.8936 31.0693 63.5037 31.128 63.0979 31.128C62.6493 31.128 62.2595 31.048 61.9284 30.888C61.5973 30.728 61.3356 30.4933 61.1434 30.184C60.9618 29.864 60.871 29.48 60.871 29.032V28.136C60.871 27.5387 61.0472 27.08 61.3997 26.76C61.7628 26.4293 62.2701 26.264 62.9216 26.264H66.3981V25.432C66.3981 24.9413 66.2806 24.568 66.0456 24.312C65.8213 24.056 65.3888 23.928 64.748 23.928C64.278 23.928 63.7333 23.9493 63.1139 23.992C62.4944 24.0347 61.891 24.088 61.3036 24.152L61.2074 23.4C61.5706 23.336 61.9551 23.2827 62.3609 23.24C62.7668 23.1867 63.1886 23.144 63.6265 23.112C64.0644 23.0693 64.5023 23.048 64.9402 23.048ZM66.3981 27.036V28.9294C66.1645 29.1385 65.9081 29.3273 65.6291 29.496C65.2232 29.7413 64.8121 29.928 64.3955 30.056C63.9897 30.184 63.6159 30.2427 63.2741 30.232C62.8148 30.232 62.4731 30.1253 62.2488 29.912C62.0245 29.6987 61.9123 29.3733 61.9123 28.936V28.264C61.9123 27.8907 62.0031 27.6027 62.1847 27.4C62.3769 27.1867 62.676 27.0747 63.0818 27.064L66.3981 27.036ZM75.4341 24.5476L75.3202 23.24H74.5352V31H75.5445V25.2152C76.1867 24.8377 76.7367 24.5473 77.1946 24.344C77.6859 24.12 78.1826 24.008 78.6845 24.008H79.069L79.1972 23.048H78.8608C78.3054 23.048 77.734 23.1867 77.1466 23.464C76.5807 23.7312 76.0099 24.0924 75.4341 24.5476ZM87.8407 23.048C88.1718 23.048 88.5189 23.0587 88.8821 23.08C89.2559 23.1013 89.6244 23.128 89.9875 23.16C90.3506 23.192 90.6924 23.2293 91.0128 23.272L90.9167 24.024C90.4361 23.992 89.9448 23.9707 89.4428 23.96C88.9408 23.9387 88.4495 23.928 87.9689 23.928C87.4562 23.9173 87.0451 23.9333 86.7353 23.976C86.4363 24.008 86.212 24.1147 86.0625 24.296C85.9236 24.4667 85.8542 24.7547 85.8542 25.16C85.8542 25.6187 85.9557 25.9333 86.1586 26.104C86.3615 26.264 86.6606 26.3813 87.0557 26.456L89.4428 26.904C90.0409 27.0213 90.4841 27.2347 90.7725 27.544C91.0715 27.8533 91.2211 28.328 91.2211 28.968C91.2211 29.6187 91.1036 30.0987 90.8686 30.408C90.6336 30.7173 90.2759 30.92 89.7952 31.016C89.3146 31.1227 88.7165 31.176 88.0009 31.176C87.6912 31.176 87.2747 31.1653 86.7514 31.144C86.2387 31.1227 85.6673 31.064 85.0372 30.968L85.1173 30.232C85.4056 30.2427 85.694 30.2587 85.9824 30.28C86.2707 30.2907 86.5644 30.3013 86.8635 30.312H87.8247C88.4335 30.3013 88.9141 30.2693 89.2666 30.216C89.619 30.152 89.87 30.024 90.0195 29.832C90.1691 29.64 90.2438 29.352 90.2438 28.968C90.2438 28.52 90.121 28.216 89.8753 28.056C89.6404 27.896 89.336 27.7787 88.9622 27.704L86.5911 27.272C86.196 27.1867 85.8702 27.064 85.6139 26.904C85.3576 26.7333 85.1653 26.5093 85.0372 26.232C84.9197 25.944 84.8609 25.5867 84.8609 25.16C84.8609 24.5413 84.9677 24.0827 85.1813 23.784C85.3949 23.4747 85.7207 23.272 86.1586 23.176C86.5965 23.08 87.1572 23.0373 87.8407 23.048Z"
fill="#10A9A0" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M18.4485 8.90848C18.2651 8.53685 17.7351 8.53685 17.5517 8.90848L15.1775 13.7192C15.1047 13.8668 14.9639 13.969 14.801 13.9927L9.49212 14.7641C9.08201 14.8237 8.91826 15.3277 9.21502 15.617L13.0566 19.3616C13.1744 19.4765 13.2282 19.642 13.2004 19.8042L12.2935 25.0916C12.2235 25.5001 12.6522 25.8116 13.019 25.6187L17.7674 23.1223C17.9131 23.0457 18.0871 23.0457 18.2328 23.1223L22.9812 25.6187C23.348 25.8116 23.7768 25.5001 23.7067 25.0916L22.7998 19.8042C22.772 19.642 22.8258 19.4765 22.9436 19.3616L26.7852 15.617C27.082 15.3277 26.9182 14.8237 26.5081 14.7641L21.1992 13.9927C21.0363 13.969 20.8955 13.8668 20.8227 13.7192L18.4485 8.90848Z"
fill="#10A9A0" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M89.6822 7.38204C89.1308 7.22338 88.4533 7.14404 87.6496 7.14404C86.8552 7.14404 86.1777 7.22338 85.617 7.38204C85.0656 7.54071 84.617 7.81138 84.2712 8.19404C83.9255 8.56738 83.6778 9.07604 83.5283 9.72004C83.3788 10.364 83.304 11.1807 83.304 12.17C83.304 13.15 83.3788 13.9667 83.5283 14.62C83.6778 15.264 83.9255 15.7774 84.2712 16.16C84.617 16.5334 85.0656 16.7994 85.617 16.958C86.1777 17.1167 86.8552 17.196 87.6496 17.196C88.4533 17.196 89.1308 17.1167 89.6822 16.958C90.2335 16.7994 90.6821 16.5334 91.0279 16.16C91.3737 15.7774 91.6213 15.264 91.7708 14.62C91.9203 13.9667 91.9951 13.15 91.9951 12.17C91.9951 11.1807 91.9203 10.364 91.7708 9.72004C91.6213 9.07604 91.3737 8.56738 91.0279 8.19404C90.6821 7.81138 90.2335 7.54071 89.6822 7.38204ZM86.6823 9.39804C86.916 9.23004 87.2384 9.14604 87.6496 9.14604C88.0608 9.14604 88.3785 9.23004 88.6028 9.39804C88.8364 9.56604 88.9953 9.86938 89.0794 10.308C89.1728 10.7467 89.2196 11.3674 89.2196 12.17C89.2196 12.9727 89.1728 13.5934 89.0794 14.032C88.9953 14.4707 88.8364 14.774 88.6028 14.942C88.3785 15.11 88.0608 15.194 87.6496 15.194C87.2384 15.194 86.916 15.11 86.6823 14.942C86.458 14.774 86.2992 14.4707 86.2057 14.032C86.1123 13.5934 86.0655 12.9727 86.0655 12.17C86.0655 11.3674 86.1123 10.7467 86.2057 10.308C86.2992 9.86938 86.458 9.56604 86.6823 9.39804ZM43.0269 7.21404C42.6905 7.18604 42.2793 7.17204 41.7933 7.17204C40.756 7.17204 39.9243 7.33538 39.2981 7.66204C38.6814 7.97938 38.2328 8.50204 37.9524 9.23004C37.6814 9.95804 37.5459 10.938 37.5459 12.17C37.5459 13.402 37.6814 14.382 37.9524 15.11C38.2328 15.838 38.6814 16.3654 39.2981 16.692C39.9243 17.0094 40.756 17.168 41.7933 17.168C42.5223 17.168 43.1297 17.1354 43.6157 17.07C44.111 17.0047 44.5922 16.8927 45.0595 16.734L44.8633 14.816C44.4053 14.8627 43.9474 14.8954 43.4895 14.914C43.0409 14.9327 42.4755 14.942 41.7933 14.942C41.4102 14.942 41.1064 14.8627 40.8822 14.704C40.6672 14.5454 40.5177 14.2654 40.4336 13.864C40.3495 13.4627 40.3074 12.898 40.3074 12.17C40.3074 11.442 40.3495 10.8774 40.4336 10.476C40.5177 10.0747 40.6672 9.79471 40.8822 9.63604C41.1064 9.47738 41.4102 9.39804 41.7933 9.39804C42.2232 9.39804 42.5924 9.40271 42.9007 9.41204C43.2091 9.41204 43.4988 9.41671 43.7699 9.42604C44.0409 9.42604 44.3352 9.43538 44.653 9.45404L44.8492 7.52204C44.5502 7.43804 44.2558 7.37271 43.9661 7.32604C43.6857 7.27938 43.3727 7.24204 43.0269 7.21404ZM52.7649 7.46604C52.1948 7.28871 51.4565 7.20004 50.55 7.20004C49.9426 7.20004 49.4193 7.20471 48.98 7.21404C48.5501 7.21404 48.153 7.22338 47.7885 7.24204C47.424 7.26071 47.0362 7.29338 46.625 7.34004V17H49.2043V13.3474C49.5559 13.3494 49.9624 13.3536 50.4239 13.36C50.6949 13.36 50.9005 13.4114 51.0407 13.514C51.1808 13.6074 51.2836 13.8034 51.3491 14.102L52.0359 17H54.7975L53.9984 14.018C53.9237 13.654 53.7975 13.3694 53.62 13.164C53.4517 12.9494 53.2648 12.7954 53.0592 12.702C52.863 12.6087 52.6761 12.5527 52.4985 12.534V12.45C52.9845 12.394 53.3676 12.2634 53.648 12.058C53.9284 11.8434 54.1246 11.568 54.2368 11.232C54.3582 10.896 54.419 10.5227 54.419 10.112C54.419 9.35604 54.2835 8.77271 54.0125 8.36204C53.7508 7.94204 53.3349 7.64338 52.7649 7.46604ZM49.2043 11.456H50.494C50.8304 11.456 51.0874 11.4234 51.265 11.358C51.4519 11.2927 51.5827 11.176 51.6575 11.008C51.7322 10.8307 51.7696 10.588 51.7696 10.28C51.7696 9.96271 51.7322 9.72004 51.6575 9.55204C51.5827 9.38404 51.4519 9.26738 51.265 9.20204C51.0874 9.13671 50.8304 9.10404 50.494 9.10404C50.0286 9.10404 49.5987 9.10522 49.2043 9.10759V11.456ZM64.1973 7.34004L61.0012 13.8884V17H58.3658V13.9172L55.1557 7.34004H57.8752L59.277 10.616C59.3611 10.812 59.4218 11.0267 59.4592 11.26C59.5059 11.484 59.5526 11.6987 59.5994 11.904H59.7676C59.805 11.6987 59.847 11.4794 59.8938 11.246C59.9498 11.0127 60.0152 10.798 60.09 10.602L61.4778 7.34004H64.1973ZM71.5814 7.49404C71.03 7.29804 70.2684 7.20004 69.2965 7.20004C68.689 7.20004 68.1704 7.20471 67.7405 7.21404C67.3106 7.21404 66.9134 7.22338 66.549 7.24204C66.1845 7.26071 65.7967 7.29338 65.3855 7.34004V17H68.0209V13.5509C68.1175 13.5624 68.2157 13.5735 68.3152 13.584C68.7638 13.6214 69.2124 13.64 69.6609 13.64C70.5114 13.64 71.1889 13.5467 71.6936 13.36C72.1982 13.1734 72.558 12.8514 72.7729 12.394C72.9972 11.9274 73.1094 11.274 73.1094 10.434C73.1094 9.59404 72.9925 8.94071 72.7589 8.47404C72.5253 8.00738 72.1328 7.68071 71.5814 7.49404ZM68.0209 11.75H69.2404C69.5675 11.7407 69.8198 11.7034 69.9974 11.638C70.1749 11.5634 70.2964 11.4327 70.3618 11.246C70.4366 11.05 70.474 10.7794 70.474 10.434C70.474 10.0794 70.4366 9.80404 70.3618 9.60804C70.2964 9.41204 70.1749 9.28138 69.9974 9.21604C69.8198 9.14138 69.5675 9.10404 69.2404 9.10404C68.8035 9.10404 68.397 9.10513 68.0209 9.1073V11.75ZM79.4568 9.34204V17H76.8215V9.34204H74.0179V7.34004H76.8215H79.4568H82.2464V9.34204H79.4568Z"
fill="#4B6AA8" />
</symbol>
<symbol id="icon-arrow-right" viewBox="0 0 14 12">
<path d="M0.5 4.5H13.5L9.5 0.5M0.5 7.5H13.5L9.5 11.5" stroke="#A8B7D4" stroke-linecap="round"
stroke-linejoin="round" />
</symbol>
<symbol id="icon-close-small" viewBox="0 0 8 8">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M3.35032 4L0.324841 0.974523C0.145436 0.795119 0.145436 0.504246 0.324841 0.324841C0.504246 0.145436 0.795118 0.145436 0.974523 0.324841L4 3.35032L7.02548 0.324841C7.20488 0.145436 7.49575 0.145436 7.67516 0.324841C7.85456 0.504246 7.85456 0.795119 7.67516 0.974524L4.64968 4L7.67516 7.02548C7.85456 7.20488 7.85456 7.49575 7.67516 7.67516C7.49575 7.85456 7.20488 7.85456 7.02548 7.67516L4 4.64968L0.974524 7.67516C0.795119 7.85456 0.504246 7.85456 0.324841 7.67516C0.145436 7.49575 0.145436 7.20488 0.324841 7.02548L3.35032 4Z"
fill="none" />
</symbol>
<symbol id="icon-close" viewBox="0 0 20 20">
<path
d="M.293 18.291a1 1 0 101.414 1.414L10 11.413l8.292 8.292a1 1 0 101.414-1.414l-8.292-8.292 8.292-8.292A1 1 0 1018.291.293L9.999 8.585 1.707.293A1 1 0 10.293 1.707L8.585 10 .293 18.291z" />
</symbol>
<symbol id="icon-error" viewBox="0 0 20 20">
<path
d="M0 10C0 4.47715 4.47715 0 10 0C15.5228 0 20 4.47715 20 10C20 15.5228 15.5228 20 10 20C4.47715 20 0 15.5228 0 10Z"
fill="#ED7358" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M9.35032 10L6.32484 6.97452C6.14544 6.79512 6.14544 6.50425 6.32484 6.32484V6.32484C6.50425 6.14544 6.79512 6.14544 6.97452 6.32484L10 9.35032L13.0255 6.32484C13.2049 6.14544 13.4958 6.14544 13.6752 6.32484V6.32484C13.8546 6.50425 13.8546 6.79512 13.6752 6.97452L10.6497 10L13.6752 13.0255C13.8546 13.2049 13.8546 13.4958 13.6752 13.6752V13.6752C13.4958 13.8546 13.2049 13.8546 13.0255 13.6752L10 10.6497L6.97452 13.6752C6.79512 13.8546 6.50425 13.8546 6.32484 13.6752V13.6752C6.14544 13.4958 6.14544 13.2049 6.32484 13.0255L9.35032 10Z"
fill="white" />
</symbol>
<symbol id="icon-kekscoin" viewBox="0 0 20 20">
<path
d="M0 10C0 4.47715 4.47715 0 10 0C15.5228 0 20 4.47715 20 10C20 15.5228 15.5228 20 10 20C4.47715 20 0 15.5228 0 10Z"
fill="#EDF0F8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M11.0214 13.6036C10.5909 13.173 10.2494 12.646 10 12.02C9.75055 12.646 9.40908 13.173 8.97855 13.6036C7.97671 14.6054 6.57707 15 5 15L5 14C6.42293 14 7.52329 13.6446 8.27145 12.8964C9.01961 12.1483 9.5 10.9229 9.5 9C9.5 7.59805 7.2541 6 6 6L6 5L14 5L14 6C12.7459 6 10.5 7.59805 10.5 9C10.5 10.9229 10.9804 12.1483 11.7286 12.8964C12.4767 13.6446 13.5771 14 15 14L15 15C13.4229 15 12.0233 14.6054 11.0214 13.6036ZM10 7.5C10.3515 6.94134 10.8542 6.49436 11.483 6L8.517 6C9.14582 6.49436 9.64847 6.94134 10 7.5Z"
fill="#4B6AA8" />
</symbol>
<symbol id="icon-no-results" viewBox="0 0 60 60">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M21.9995 43C33.5974 43 42.9997 33.598 43 22C43.0003 10.402 33.5985 1 22.0005 1C10.4026 1 1.0003 10.402 1 22C0.999705 33.598 10.4015 43 21.9995 43ZM42.1437 30.8581C43.3372 28.148 43.9999 25.1514 44 22C44.0003 9.84974 34.1508 0 22.0006 0C9.8503 0 0.00030932 9.84974 7.28435e-09 22C-0.000309291 34.1503 9.84918 44 21.9994 44C25.1519 44 28.1496 43.3369 30.8605 42.1426C32.6922 43.6913 35.2329 43.9675 37.3174 42.9712L37.5592 43.213L53.1716 58.8258C54.7337 60.3879 57.2663 60.3879 58.8284 58.8258C60.3905 57.2637 60.3905 54.731 58.8284 53.1689L43.216 37.556L42.9737 37.3137C43.9689 35.2293 43.6923 32.6893 42.1437 30.8581ZM41.6647 31.8743C39.5408 36.0956 36.0976 39.5391 31.8766 41.6635C33.826 43.0209 36.5264 42.8304 38.2649 41.0918L41.0933 38.2633C42.832 36.5245 43.0225 33.8238 41.6647 31.8743ZM22.0002 39.0006C31.3894 39.0006 39.001 31.3892 39.0012 22.0001C39.0015 12.6109 31.3902 4.99951 22.0011 4.99951C12.6119 4.99951 5.00034 12.6109 5.0001 22.0001C4.99986 31.3892 12.6111 39.0006 22.0002 39.0006ZM22.0002 40.0006C31.9416 40.0006 40.001 31.9415 40.0012 22.0001C40.0015 12.0586 31.9426 3.99951 22.0011 3.99951C12.0597 3.99951 4.00036 12.0586 4.0001 22.0001C3.99985 31.9415 12.0588 40.0006 22.0002 40.0006ZM42.5089 38.2632L38.2663 42.5059L53.8787 58.1187C55.0503 59.2903 56.9498 59.2903 58.1213 58.1187C59.2929 56.9471 59.2929 55.0476 58.1213 53.876L42.5089 38.2632ZM17.3561 16.6464C17.1608 16.4512 16.8442 16.4512 16.649 16.6464C16.4537 16.8417 16.4537 17.1583 16.649 17.3536L21.2954 22L16.649 26.6464C16.4537 26.8417 16.4537 27.1583 16.649 27.3536C16.8442 27.5488 17.1608 27.5488 17.3561 27.3536L22.0025 22.7071L26.649 27.3536C26.8442 27.5488 27.1608 27.5488 27.3561 27.3536C27.5513 27.1583 27.5513 26.8417 27.3561 26.6464L22.7096 22L27.3561 17.3536C27.5513 17.1583 27.5513 16.8417 27.3561 16.6464C27.1608 16.4512 26.8442 16.4512 26.649 16.6464L22.0025 21.2929L17.3561 16.6464Z"
fill="#4B6AA8" />
</symbol>
<symbol id="icon-pin-buy" viewBox="0 0 36 46">
<path
d="M36 18.4C36 32.242 18 46 18 46C18 46 0 32.242 0 18.4C0 8.23796 8.05887 0 18 0C27.9411 0 36 8.23796 36 18.4Z"
fill="currentColor" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M18 32C25.732 32 32 25.732 32 18C32 10.268 25.732 4 18 4C10.268 4 4 10.268 4 18C4 25.732 10.268 32 18 32ZM28 18C28 23.5228 23.5228 28 18 28C12.4772 28 8 23.5228 8 18C8 12.4772 12.4772 8 18 8C23.5228 8 28 12.4772 28 18ZM18.4484 10.9085L20.2348 14.5282C20.3076 14.6758 20.4484 14.7781 20.6113 14.8017L24.6059 15.3822C25.016 15.4418 25.1797 15.9458 24.883 16.235L21.9925 19.0526C21.8746 19.1675 21.8208 19.333 21.8487 19.4951L22.531 23.4736C22.6011 23.8821 22.1724 24.1935 21.8055 24.0007L18.2327 22.1223C18.087 22.0457 17.913 22.0457 17.7673 22.1223L14.1945 24.0007C13.8276 24.1935 13.3989 23.8821 13.469 23.4736L14.1513 19.4951C14.1792 19.333 14.1254 19.1675 14.0075 19.0526L11.117 16.235C10.8203 15.9458 10.984 15.4418 11.3941 15.3822L15.3887 14.8017C15.5516 14.7781 15.6924 14.6758 15.7652 14.5282L17.5516 10.9085C17.735 10.5369 18.265 10.5369 18.4484 10.9085Z"
fill="white" />
</symbol>
<symbol id="icon-pin-sell" viewBox="0 0 36 46">
<path
d="M36 18.4C36 32.242 18 46 18 46C18 46 0 32.242 0 18.4C0 8.23796 8.05887 0 18 0C27.9411 0 36 8.23796 36 18.4Z"
fill="currentColor" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M18 32C25.732 32 32 25.732 32 18C32 10.268 25.732 4 18 4C10.268 4 4 10.268 4 18C4 25.732 10.268 32 18 32ZM28 18C28 23.5228 23.5228 28 18 28C12.4772 28 8 23.5228 8 18C8 12.4772 12.4772 8 18 8C23.5228 8 28 12.4772 28 18ZM18.4484 10.9085L20.2348 14.5282C20.3076 14.6758 20.4484 14.7781 20.6113 14.8017L24.6059 15.3822C25.016 15.4418 25.1797 15.9458 24.883 16.235L21.9925 19.0526C21.8746 19.1675 21.8208 19.333 21.8487 19.4952L22.531 23.4736C22.6011 23.8821 22.1724 24.1935 21.8055 24.0007L18.2327 22.1223C18.087 22.0457 17.913 22.0457 17.7673 22.1223L14.1945 24.0007C13.8276 24.1935 13.3989 23.8821 13.469 23.4736L14.1513 19.4951C14.1792 19.333 14.1254 19.1675 14.0075 19.0526L11.117 16.235C10.8203 15.9458 10.984 15.4418 11.3941 15.3822L15.3887 14.8017C15.5516 14.7781 15.6924 14.6758 15.7652 14.5282L17.5516 10.9085C17.735 10.5369 18.265 10.5369 18.4484 10.9085Z"
fill="white" />
</symbol>
<symbol id="icon-rub" viewBox="0 0 20 20">
<path
d="M0 10C0 4.47715 4.47715 0 10 0C15.5228 0 20 4.47715 20 10C20 15.5228 15.5228 20 10 20C4.47715 20 0 15.5228 0 10Z"
fill="#EDF0F8" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M11 6L8 6V10L11 10C12.2816 9.99998 13 9.24301 13 8C13 6.75702 12.2816 6 11 6ZM8 11L11 11C11.0037 11 11.0075 11 11.0113 11C12.8298 11.0006 14 9.76914 14 8C14 6.23086 12.8298 4.99939 11.0113 5C10.0075 5.00034 8.00377 5 7 5V10L6.00064 10L6.00004 11L7 11V12H6V13H7V15H8V13H12V12H8V11Z"
fill="#4B6AA8" />
</symbol>
<symbol id="icon-server-error" viewBox="0 0 60 60">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M26.5 0C26.2556 0 26.047 0.176707 26.0068 0.417801L21.0068 30.4178C20.9826 30.5628 21.0235 30.711 21.1185 30.8232C21.2135 30.9353 21.353 31 21.5 31H25.886L20.0104 59.3987C19.961 59.6375 20.091 59.8771 20.3182 59.9658C20.5453 60.0544 20.8033 59.9663 20.9287 59.7572L38.9287 29.7572C39.0214 29.6028 39.0239 29.4104 38.9351 29.2537C38.8463 29.0969 38.6801 29 38.5 29H32.2721L44.9563 0.704528C45.0256 0.549824 45.0118 0.370516 44.9197 0.228213C44.8275 0.0859104 44.6695 0 44.5 0H26.5ZM22.0902 30L26.9236 1H43.7279L31.0437 29.2955C30.9744 29.4502 30.9882 29.6295 31.0803 29.7718C31.1725 29.9141 31.3305 30 31.5 30H37.6169L21.5862 56.7178L26.9896 30.6013C27.0201 30.454 26.9827 30.3009 26.8877 30.1843C26.7928 30.0677 26.6504 30 26.5 30H22.0902ZM22.2866 9.57813C15.3577 8.73117 9.46834 15.188 10.6692 21.8847C4.26662 23.3954 0 29.164 0 36C0 43.6349 5.41505 49.9308 12.9648 50.4636L12.9809 50.4648L12.9971 50.4649L19.0837 50.5C19.3599 50.5016 19.585 50.2791 19.5866 50.0029C19.5882 49.7268 19.3657 49.5016 19.0895 49.5L13.0192 49.465C6.04669 48.9646 1 43.1511 1 36C1 29.4222 5.19206 23.9826 11.3557 22.7588L11.8621 22.6583L11.7454 22.1554C10.3076 15.9556 15.7607 9.78789 22.1652 10.5707C22.4393 10.6042 22.6887 10.4092 22.7222 10.1351C22.7557 9.861 22.5607 9.61163 22.2866 9.57813ZM42.3724 12.2087C42.1078 12.1297 41.8293 12.2801 41.7503 12.5447C41.6712 12.8093 41.8217 13.0879 42.0863 13.1669C49.5577 15.3983 54.4063 23.0107 53.3503 30.6982L53.2979 31.0796L53.6532 31.2277C57.0477 32.6431 59 36.003 59 40C59 45.281 55.2136 49.5 50 49.5H29.4835C29.2073 49.5 28.9835 49.7239 28.9835 50C28.9835 50.2762 29.2073 50.5 29.4835 50.5H50C55.8321 50.5 60 45.7647 60 40C60 35.8102 58.001 32.1367 54.3882 30.4589C55.3054 22.4159 50.1983 14.546 42.3724 12.2087Z"
fill="#4B6AA8" />
</symbol>
<symbol id="icon-star" viewBox="0 0 20 20">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M10 20C15.5228 20 20 15.5228 20 10C20 4.47715 15.5228 0 10 0C4.47715 0 0 4.47715 0 10C0 15.5228 4.47715 20 10 20ZM12.2348 6.52821L10.4484 2.90849C10.265 2.53687 9.73504 2.53687 9.55163 2.90849L7.76519 6.52821C7.69236 6.67578 7.55158 6.77807 7.38873 6.80173L3.39413 7.38218C2.98402 7.44177 2.82026 7.94576 3.11702 8.23503L6.00754 11.0526C6.12538 11.1675 6.17916 11.333 6.15134 11.4951L5.46898 15.4736C5.39892 15.8821 5.82764 16.1935 6.19445 16.0007L9.76733 14.1223C9.91299 14.0457 10.087 14.0457 10.2327 14.1223L13.8055 16.0007C14.1724 16.1935 14.6011 15.8821 14.531 15.4736L13.8487 11.4952C13.8208 11.333 13.8746 11.1675 13.9925 11.0526L16.883 8.23503C17.1797 7.94576 17.016 7.44177 16.6059 7.38218L12.6113 6.80173C12.4484 6.77807 12.3076 6.67578 12.2348 6.52821Z"
fill="#FFA800" />
</symbol>
<symbol id="icon-success" viewBox="0 0 20 20">
<path
d="M0 10C0 4.47715 4.47715 0 10 0C15.5228 0 20 4.47715 20 10C20 15.5228 15.5228 20 10 20C4.47715 20 0 15.5228 0 10Z"
fill="#10A9A0" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M14.8536 6.16737C15.0488 6.39052 15.0488 6.75233 14.8536 6.97549L8.85355 13.8326C8.65829 14.0558 8.34171 14.0558 8.14645 13.8326L5.14645 10.4041C4.95118 10.1809 4.95118 9.8191 5.14645 9.59594C5.34171 9.37278 5.65829 9.37278 5.85355 9.59594L8.5 12.6204L14.1464 6.16737C14.3417 5.94421 14.6583 5.94421 14.8536 6.16737Z"
fill="white" />
</symbol>
<symbol id="icon-user" viewBox="0 0 20 20">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M9.99976 10C12.7612 10 14.9998 7.76142 14.9998 5C14.9998 2.23858 12.7612 0 9.99976 0C7.23833 0 4.99976 2.23858 4.99976 5C4.99976 7.76142 7.23833 10 9.99976 10ZM9.99976 12C6.72812 12 3.82344 13.5711 1.99902 16C3.82344 18.4289 6.72812 20 9.99976 20C13.2714 20 16.1761 18.4289 18.0005 16C16.1761 13.5711 13.2714 12 9.99976 12Z"
fill="#4B6AA8" />
</symbol>
</svg>
</div>
<div class="wrapper">
<header class="header">
<div class="container">
<span class="header__logo">
<svg width="92" height="36" aria-hidden="true">
<use xlink:href="#crypto-stars-logo"></use>
</svg>
</span>
<!--
В случае ошибки загрузки данных блок .user-profile нужно скрыть.
Способ подойдёт любой - как полное удаление из DOM,
так и добавление display: none
-->
<div class="user-profile">
<ul class="user-profile__cash">
<li class="user-profile__cash-item">
<svg width="20" height="20" aria-hidden="true">
<use xlink:href="#icon-kekscoin"></use>
</svg>
<span id="user-crypto-balance" data-wallet-number="">
<!-- Вставьте сюда количество криптомонет пользователя -->
</span>
<span class="visually-hidden">кекскоин</span>
</li>
<li class="user-profile__cash-item">
<svg width="20" height="20" aria-hidden="true">
<use xlink:href="#icon-rub"></use>
</svg>
<span id="user-fiat-balance">
<!-- Вставьте сюда количество денег у пользователя -->
</span>
<span class="visually-hidden">рубль</span>
</li>
</ul>
<span class="user-profile__name">
<svg width="20" height="20" aria-hidden="true">
<use xlink:href="#icon-user"></use>
</svg>
<span id="user-name">
<!-- Вставьте сюда имя пользователя -->
</span>
</span>
</div>
</div>
</header>
<main>
<h1 class="visually-hidden">Пользователи биржи</h1>
<!--
В случае ошибки загрузки нужно показать .container с сообщением об ошибке
Остальные контейнеры нужно скрыть. Способ сокрытия подойдёт любой.
Для удобства обращения из JS, вы можете добавить контейнерам id
или уникальные классы
-->
<div class="container server-error-message-container" style="display: none">
<div class="message">
<span class="message__icon">
<svg width="60" height="60" aria-hidden="true">
<use xlink:href="#icon-server-error"></use>
</svg>
</span>
<p class="message__paragraph">
Сервер временно недоступен, попробуйте
<a href="javascript:window.location.reload()" class="link">обновить страницу</a>
</p>
</div>
</div>
<div class="container menu-header-container">
<div class="users-nav">
<div class="users-nav__tabs">
<div class="tabs no-transition-global tabs--toggle-buy-sell" data-tabs="parent"
data-delay="300">
<div class="tabs__controls" data-tabs="controls">
<!-- При переключении с продавцов на покупателей и обратно нужно выделить активный пункт .is-active -->
<button class="tabs__control btn is-active" type="button"
data-tabs="control" id="button-buy">Купить</button>
<button class="tabs__control btn" type="button" data-tabs="control" id="button-sell">Продать</button>
</div>
</div>
</div>
<div class="custom-toggle users-nav__custom-toggle">
<label>
<input type="checkbox" id="checked-users" name="checkbox">
<span class="custom-toggle__icon"></span>
<span class="custom-toggle__label">Только проверенные пользователи</span>
</label>
</div>
<div class="users-nav__tabs">
<div class="tabs no-transition-global tabs--toggle-list-map" data-tabs="parent"
data-delay="300">
<!-- При переключении с карты на список и обратно нужно выделить активный пункт .is-active -->
<div class="tabs__controls" data-tabs="controls">
<button class="tabs__control btn is-active" type="button"
data-tabs="control" id="button-list">Cписок</button>
<button class="tabs__control btn" type="button" data-tabs="control" id="button-map">Карта</button>
</div>
</div>
</div>
</div>
<!-- При переключении на карту блок .users-list нужно скрыть. Способ сокрытия подойдёт любой -->
<div class="users-list">
<table class="users-list__table tab-item active">
<thead class="users-list__table-head">
<tr class="users-list__table-row">
<th class="users-list__table-cell users-list__table-name">Пользователь</th>
<th class="users-list__table-cell users-list__table-currency">Валюта</th>
<th class="users-list__table-cell users-list__table-exchangerate">Курс</th>
<th class="users-list__table-cell users-list__table-cashlimit">Лимит</th>
<th class="users-list__table-cell users-list__table-payments">Платёжные системы</th>
<th class="users-list__table-cell users-list__table-btn"></th>
</tr>
</thead>
<tbody class="users-list__table-body">
<!-- Записи в таблице строятся по шаблону #user-table-row__template -->
</tbody>
</table>
</div>
</div>
<!--
При отсутствии данных (если пользователь применил жёсткие фильтры
или сервер вернул пустой массив данных) нужно отобразить данный контейнер.
Справедливо только для отображения типа "Список". В случае с картой
просто показывается пустая карта
-->
<div class="container container--lightbackground search-error-message-container" style="display: none">
<div class="message message--noresults"><span class="message__icon">
<svg width="60" height="60" aria-hidden="true">
<use xlink:href="#icon-no-results"></use>
</svg></span>
<p class="message__paragraph">Нет подходящих объявлений</p>
</div>
</div>
<!-- При переключении на карту нужно отобразить данный контейнер -->
<div class="container map-container" style="display: none">
<div class="map" id="map">
<!--
Карту нужно отрисовать в этот контейнер. Иконки для карты -
img/pin.svg и img/pin-verified.svg для обычных пользователей
и для верифицированных соответственно.
Контент для балуна вы найдёте в шаблоне #map-baloon__template
-->
</div>
</div>
</main>
<footer class="footer">
<div class="container"><span class="footer__logo">
<svg width="92" height="36" aria-hidden="true">
<use xlink:href="#crypto-stars-logo"></use>
</svg></span>
<p class="footer__copyright">Разработано в HTML Academy</p>
</div>
</footer>
</div>
<!--
N.B.
В разметке мы приводим два отдельных попапа для продажи
и для покупки, но по своей сути они отличаются только порядком полей.
Поэтому вы можете свести всё к одному попапу и менять порядок при отрисовке
в зависимости от типа действия - покупка/продажа.
Это более сложный вариант, поэтому трезво оцените свои силы
-->
<!--
При открытии попапа данные нужно заменить на настоящие.
Для удобства обращения из JS, вы можете добавить обёрткам id
или уникальные классы там, где их нет, а также сами обёрки (используйте <span>)
Обратите внимание, что при открытии попапа также нужно убрать скролл с body,
для этого можете использовать класс "scroll-lock"
-->
<div class="modal modal--buy" style="display: none">
<div class="modal__wrapper">
<div class="modal__overlay" data-close-modal></div>
<div class="modal__content">
<h2 class="modal__description">Покупка криптовалюты</h2>
<!-- Не забудьте указать верный action-атрибут -->
<form class="modal-buy" method="post" enctype="multipart/form-data" action="https://cryptostar.grading.pages.academy/" autocomplete="off">
<!--
Обратите внимание, что всем полям для отправки на сервер нужно указать
атрибуты name (их список вы найдёте в техзадании), а часть полей
вообще отправляется скрытыми
-->
<input type="hidden" name="type" value="BUY">
<input type="hidden" name="contractorId" class="contractorId">
<input type="hidden" name="exchangeRate" class="exchangeRate">
<input type="hidden" name="sendingCurrency" value="RUB">
<input type="hidden" name="receivingCurrency" value="KEKS">
<div class="transaction-info">
<p class="transaction-info__item transaction-info__item--name"><span
class="transaction-info__label">Пользователь</span><span class="transaction-info__data">
<svg width="20" height="20" aria-hidden="true">
<use class="star-badge" xlink:href="#icon-star"></use>
</svg><span class="transaction-info-name">John Smith</span></span></p>
<p class="transaction-info__item transaction-info__item--exchangerate"><span
class="transaction-info__label">Курс</span><span class="transaction-info__data transaction-info-exchange-rate">9 999
999 ₽</span></p>
<p class="transaction-info__item transaction-info__item--cashlimit"><span
class="transaction-info__label">Лимит</span><span class="transaction-info__data transaction-info-limit">9 999
999 ₽ - 9 999 999 000 ₽</span></p>
</div>
<div class="modal__container modal__container--small">
<div class="modal__input-wrapper modal__input-wrapper--min">
<div class="custom-input modal-form__element">
<label><span class="custom-input__label">Оплата</span><span
class="custom-input__unit">₽</span>
<button class="btn btn--textblue custom-input__btn exchange-all" type="button">обменять все
</button>
<input name="sendingAmount" class="payment-input" type="number" value="" placeholder="0" min="0" max="9999999999999999999999" data-pristine-min-message="Сумма слишком мала" data-pristine-max-message="Сумма превышает лимит">
</label>
<!-- Пример стилизации ошибки валидации -->
<!-- <div class="custom-input__error">Минимальная сумма — 9 999 999 ₽</div> -->
</div>
</div>
<svg class="modal__container-svg" width="14" height="12" aria-hidden="true">
<use xlink:href="#icon-arrow-right"></use>
</svg>
<div class="modal__input-wrapper modal__input-wrapper--min">
<div class="custom-input">
<label><span class="custom-input__label">Зачисление</span><span
class="custom-input__unit">KEKS</span>
<input name="receivingAmount" class="receival-input" type="number" placeholder="0">
</label>
</div>
</div>
</div>
<div class="modal__container">
<div class="modal__select-wrapper">
<div class="select"><span>Плaтёжная система</span>
<!--
При отрисовке в списке платёжных систем нужно отразить только те,
которые есть у пользователя. Способ - удалить из разметки или добавить disable-атрибут
остаётся на ваше усмотрение. Первый пункт, с предложением выбора, должен быть всегда
-->
<select class="payment-methods" name="paymentMethod">
<option selected disabled>Выберите платёжную систему</option>
</select>
</div>
</div>
<div class="modal__input-wrapper modal__input-wrapper--decorated">
<div class="custom-input">
<!-- В случае, если выбрана оплата наличными, поле нужно оставить пустым -->
<label><span class="custom-input__label">Номер банковской карты пользователя</span>
<input type="text" placeholder="1234 5678 9012 3456" class="card-number" disabled>
</label>
</div>
</div>
<div class="modal__input-wrapper modal__input-wrapper--decorated">
<div class="custom-input">
<label><span class="custom-input__label">Номер криптокошелька пользователя</span>
<input type="text" placeholder="08701943851-9832345" class="wallet-number" disabled>
</label>
</div>
</div>
<div class="modal__input-wrapper modal__input-wrapper--decorated">
<div class="custom-input password-form-field">
<label><span class="custom-input__label">Платёжный пароль</span>
<input name="paymentPassword" type="password" value="123456" placeholder="Введите пароль" class="password" required data-pristine-required-message="Обязательное поле">
</label>
<div class="custom-input__error password-error-message"></div>
</div>
</div>
<button class="btn btn--green modal__submit" type="submit">Обменять
</button>
<!-- Сообщение, которое нужно показать в случае неудачной отправки данных -->
<p class="modal__validation-message modal__validation-message--error" style="visibility: hidden">
<svg width="20" height="20" aria-hidden="true">
<use xlink:href="#icon-error"></use>
</svg>Ошибка заполнения формы
</p>
<!-- Сообщение, которое нужно показать в случае успешной отправки данных -->
<p class="modal__validation-message modal__validation-message--success" style="visibility: hidden">
<svg width="20" height="20" aria-hidden="true">
<use xlink:href="#icon-success"></use>
</svg>Данные успешно отправлены
</p>
</div>
</form>
<button class="close-btn modal__close-btn" type="button" aria-label="Закрыть попап">
<svg width="8" height="8" aria-hidden="true">
<use id="modal-buy-close-button" xlink:href="#icon-close-small"></use>
</svg>
</button>
</div>
</div>
</div>
<!--
При открытии попапа данные нужно заменить на настоящие.
Для удобства обращения из JS, вы можете добавить обёрткам id
или уникальные классы там, где их нет, а также сами обёрки (используйте <span>)
Обратите внимание, что при открытии попапа также нужно убрать скролл с body,
для этого можете использовать класс "scroll-lock"
-->
<div class="modal modal--sell" style="display: none">
<div class="modal__wrapper">
<div class="modal__overlay" data-close-modal></div>
<div class="modal__content">
<h2 class="modal__description">Продажа криптовалюты</h2>
<!-- Не забудьте указать верный action-атрибут -->
<form class="modal-sell" method="post" enctype="multipart/form-data" action="https://cryptostar.grading.pages.academy/" autocomplete="off">
<!--
Обратите внимание, что всем полям для отправки на сервер нужно указать
атрибуты name (их список вы найдёте в техзадании), а часть полей
вообще отправляется скрытыми
-->
<input type="hidden" name="type" value="SELL">
<input type="hidden" name="contractorId" class="contractorId">
<input type="hidden" name="exchangeRate" class="exchangeRate">
<input type="hidden" name="sendingCurrency" value="KEKS">
<input type="hidden" name="receivingCurrency" value="RUB">
<div class="transaction-info">
<p class="transaction-info__item transaction-info__item--name">
<span class="transaction-info__label">Пользователь</span>
<span class="transaction-info__data">
<svg width="20" height="20" aria-hidden="true">
<use class="star-badge" xlink:href="#icon-star"></use>
</svg>
<span class="transaction-info-name">John Smith</span>
</span>
</p>
<p class="transaction-info__item transaction-info__item--exchangerate">
<span class="transaction-info__label">Курс</span>
<span class="transaction-info__data transaction-info-exchange-rate">9 999 999 ₽</span>
</p>
<p class="transaction-info__item transaction-info__item--cashlimit">
<span class="transaction-info__label">Лимит</span>
<span class="transaction-info__data transaction-info-limit">9 999 999 ₽ - 9 999 999
000 ₽</span>
</p>
</div>
<div class="modal__container">
<div class="modal__input-wrapper modal__input-wrapper--min">
<div class="custom-input">
<label>
<span class="custom-input__label">Оплата</span>
<span class="custom-input__unit">KEKS</span>
<button class="btn btn--textblue custom-input__btn exchange-all" type="button">обменять
все</button>
<input name="sendingAmount" class="payment-input" type="number" value="" placeholder="0" min="0" max="9999999999999999999999" data-pristine-min-message="Сумма слишком мала" data-pristine-max-message="Сумма превышает лимит">
</label>
<!-- <div class="custom-input__error">Минимальная сумма — 9 999 999 ₽</div> -->
</div>
</div>
<svg class="modal__container-svg" width="14" height="12" aria-hidden="true">
<use xlink:href="#icon-arrow-right"></use>
</svg>
<div class="modal__input-wrapper modal__input-wrapper--min">
<div class="custom-input">
<label><span class="custom-input__label">Зачисление</span><span
class="custom-input__unit">₽</span>
<button class="btn btn--textblue custom-input__btn exchange-all" type="button">обменять все
</button>
<input name="receivingAmount" class="receival-input" type="number" placeholder="0">
</label>
</div>
</div>
</div>
<div class="modal__container">
<div class="modal__input-wrapper modal__input-wrapper--decorated">
<div class="custom-input">
<label><span class="custom-input__label">Номер криптокошелька пользователя</span>
<input type="text" placeholder="08701943851-983457-2345" class="wallet-number" disabled>
</label>
</div>
</div>
<div class="modal__select-wrapper">
<div class="select"><span>Плaтёжная система</span>
<!--
При отрисовке в списке платёжных систем нужно отразить только те,
которые есть у пользователя. Способ - удалить из разметки или добавить disable-атрибут
остаётся на ваше усмотрение. Первый пункт, с предложением выбора, должен быть всегда
-->
<select class="payment-methods" name="paymentMethod">
<option selected disabled>Выберите платёжную систему</option>
</select>
</div>
</div>
<div class="modal__input-wrapper modal__input-wrapper--decorated">
<div class="custom-input">
<!-- В случае, если выбрана оплата наличными, поле нужно оставить пустым -->
<label><span class="custom-input__label">Номер банковской карты пользователя</span>
<input type="text" placeholder="1234 5678 9012 3456" class="card-number" disabled>
</label>
</div>
</div>
<div class="modal__input-wrapper modal__input-wrapper--decorated">
<div class="custom-input">
<label><span class="custom-input__label">Платёжный пароль</span>
<input name="paymentPassword" type="password" value="123456" placeholder="Введите пароль" class="password" required data-pristine-required-message="Обязательное поле">
</label>
<div class="custom-input__error password-error-message"></div>
</div>
</div>
<button class="btn btn--green modal__submit" type="submit">Обменять
</button>
<!-- Сообщение, которое нужно показать в случае неудачной отправки данных -->
<p class="modal__validation-message modal__validation-message--error" style="visibility: hidden">
<svg width="20" height="20" aria-hidden="true">
<use xlink:href="#icon-error"></use>
</svg>Ошибка заполнения формы
</p>
<!-- Сообщение, которое нужно показать в случае успешной отправки данных -->
<p class="modal__validation-message modal__validation-message--success" style="visibility: hidden">
<svg width="20" height="20" aria-hidden="true">
<use xlink:href="#icon-success"></use>
</svg>Данные успешно отправлены
</p>
</div>
</form>
<button class="close-btn modal__close-btn" type="button" aria-label="Закрыть попап">
<svg width="8" height="8" aria-hidden="true">
<use id="modal-sell-close-button" xlink:href="#icon-close-small"></use>
</svg>
</button>
</div>
</div>
</div>
<template id="user-table-row__template">
<!--
При клонировании данные нужно заменить на настоящие.
Для удобства обращения из JS, вы можете добавить обёрткам id
или уникальные классы там, где их нет, а также сами обёрки (используйте <span>)
-->
<tr class="users-list__table-row">
<td class="users-list__table-cell users-list__table-name">
<!-- Обратите внимание, что "звёздочка только" у верифицированных пользователей -->
<svg width="20" height="20" aria-hidden="true">
<use class="star-badge" xlink:href="#icon-star"></use>
</svg>
<span class="user-name">John Smith</span>
</td>
<td class="users-list__table-cell users-list__table-currency">keks</td>
<td class="users-list__table-cell users-list__table-exchangerate">9 999 999 ₽</td>
<td class="users-list__table-cell users-list__table-cashlimit">9 999
999 ₽ - 9 999 999 000 ₽</td>
<td class="users-list__table-cell users-list__table-payments">
<ul class="users-list__badges-list">
<!-- <li class="users-list__badges-item badge">BitTransfer</li>
<li class="users-list__badges-item badge">CryptoEx</li>
<li class="users-list__badges-item badge">Первый криптобанк</li> -->
</ul>
</td>
<td class="users-list__table-cell users-list__table-btn">
<button class="btn btn--greenborder exchange-btn" type="button">Обменять
</button>
</td>
</tr>
</template>
<template id="map-baloon__template">
<!--
При клонировании данные нужно заменить на настоящие.
Для удобства обращения из JS, вы можете добавить обёрткам id
или уникальные классы там, где их нет, а также сами обёрки (используйте <span>)
-->
<div class="user-card">
<span class="user-card__user-name" style="width: 100%">
<!-- Обратите внимание, что "звёздочка только" у верифицированных пользователей -->
<svg width="20" height="20" aria-hidden="true">
<use class="star-badge" xlink:href="#icon-star"></use>
</svg>
<span id="seller-name">Неопознанный енот</span><br>
</span>
<p class="user-card__cash-item"><span class="user-card__cash-label">Валюта</span><span
class="user-card__cash-data" id="seller-currency">KEKS</span></p>
<p class="user-card__cash-item"><span class="user-card__cash-label">Курс</span><span
class="user-card__cash-data" id="seller-exchange-rate">9 999 999 ₽</span></p>
<p class="user-card__cash-item"><span class="user-card__cash-label">Лимит</span><span
class="user-card__cash-data" id="seller-limit">9 900 ₽ – 9 900 000 000 ₽</span></p>
<ul class="user-card__badges-list">
</ul>
<button class="btn btn--green user-card__change-btn exchange-btn" type="button">Обменять
</button>
</div>
</template>
<script src="./leaflet/leaflet.js"></script>
<script src="./node_modules/pristinejs/dist/pristine.js" type="text/javascript"></script>
<script src="./js/main.js" type="module"></script>
</body>
</html>