unika-components 1.1.133 → 1.1.134

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,123 +8,37 @@
8
8
  max-height: 100%;
9
9
  width: 100%;
10
10
  }
11
-
12
- .ele-text {
13
- position: relative;
11
+ .ele-shape {
12
+ position: absolute;
13
+ overflow: hidden;
14
14
  }
15
15
 
16
- .ele-text .ani-wrap {
16
+ .ani-wrap {
17
17
  width: 100%;
18
18
  height: 100%;
19
+ box-sizing: border-box;
19
20
  }
20
21
 
21
- .text-common {
22
- padding: 5px;
23
- text-orientation: upright;
24
- white-space: pre-wrap;
25
- }
26
-
27
- /* 文本动画类 */
28
- .text-fadeIn {
29
- animation: fadeIn 1s ease-in-out;
30
- }
31
-
32
- .text-slideIn {
33
- animation: slideIn 1s ease-in-out;
34
- }
35
-
36
- .text-bounceIn {
37
- animation: bounceIn 1s ease-in-out;
22
+ .e-shape {
23
+ width: 100%;
24
+ height: 100%;
38
25
  }
39
26
 
40
- /* 基础动画关键帧 */
41
- @keyframes fadeIn {
42
- from {
43
- opacity: 0;
44
- }
45
- to {
46
- opacity: 1;
47
- }
27
+ .svg-container :deep(svg) {
28
+ width: 100%;
29
+ height: 100%;
30
+ display: block;
48
31
  }
49
32
 
50
- @keyframes slideIn {
51
- from {
52
- transform: translateY(20px);
53
- opacity: 0;
54
- }
55
- to {
56
- transform: translateY(0);
57
- opacity: 1;
58
- }
33
+ .svg-loading,
34
+ .svg-error {
35
+ display: flex;
36
+ align-items: center;
37
+ justify-content: center;
38
+ width: 100%;
39
+ height: 100%;
40
+ background: rgba(0,0,0,0.05);
59
41
  }
60
-
61
- @keyframes bounceIn {
62
- 0% {
63
- transform: scale(0.3);
64
- opacity: 0;
65
- }
66
- 50% {
67
- transform: scale(1.05);
68
- opacity: 0.8;
69
- }
70
- 70% {
71
- transform: scale(0.9);
72
- opacity: 0.9;
73
- }
74
- 100% {
75
- transform: scale(1);
76
- opacity: 1;
77
- }
78
- }.ele-img {
79
- position: absolute;
80
- overflow: hidden;
81
- }
82
-
83
- .ele-img .ani-wrap {
84
- width: 100%;
85
- height: 100%;
86
- }
87
-
88
- .ele-img .ele-image {
89
- position: relative;
90
- display: block;
91
- }
92
-
93
- .ele-img .rotate-wrap {
94
- position: absolute;
95
- left: 0;
96
- right: 0;
97
- top: 0;
98
- bottom: 0;
99
- }
100
-
101
- .ele-img .ele-img-bg,
102
- .ele-img .rotate-wrap .img-wrap {
103
- width: 100%;
104
- height: 100%;
105
- overflow: hidden;
106
- }
107
-
108
- .ele-img .ele-bg-wrap {
109
- width: 100%;
110
- height: 100%;
111
- background-size: cover;
112
- background-position: 50% 50%;
113
- background-repeat: no-repeat;
114
- background-clip: border-box;
115
- }
116
-
117
- /* 动画关键帧 */
118
- @keyframes zoomIn {
119
- from {
120
- opacity: 0;
121
- transform: scale(0.5);
122
- }
123
- to {
124
- opacity: 1;
125
- transform: scale(1);
126
- }
127
- }
128
42
  .element-video {
129
43
  position: absolute;
130
44
  overflow: hidden;
@@ -170,6 +84,9 @@
170
84
 
171
85
  .video-cover:hover .play-btn {
172
86
  opacity: 1;
87
+ }
88
+ .ele-lottie .ele-lotwrap {
89
+ overflow: hidden;
173
90
  }#audio {
174
91
  position: absolute;
175
92
  right: 10px;
@@ -240,7 +157,100 @@
240
157
  width: 100%;
241
158
  height: 2px;
242
159
  background: #fff;
243
- }.call {
160
+ }.ele-img {
161
+ position: absolute;
162
+ overflow: hidden;
163
+ }
164
+
165
+ .ele-img .ani-wrap {
166
+ width: 100%;
167
+ height: 100%;
168
+ }
169
+
170
+ .ele-img .ele-image {
171
+ position: relative;
172
+ display: block;
173
+ }
174
+
175
+ .ele-img .rotate-wrap {
176
+ position: absolute;
177
+ left: 0;
178
+ right: 0;
179
+ top: 0;
180
+ bottom: 0;
181
+ }
182
+
183
+ .ele-img .ele-img-bg,
184
+ .ele-img .rotate-wrap .img-wrap {
185
+ width: 100%;
186
+ height: 100%;
187
+ overflow: hidden;
188
+ }
189
+
190
+ .ele-img .ele-bg-wrap {
191
+ width: 100%;
192
+ height: 100%;
193
+ background-size: cover;
194
+ background-position: 50% 50%;
195
+ background-repeat: no-repeat;
196
+ background-clip: border-box;
197
+ }
198
+
199
+ /* 动画关键帧 */
200
+ @keyframes zoomIn {
201
+ from {
202
+ opacity: 0;
203
+ transform: scale(0.5);
204
+ }
205
+ to {
206
+ opacity: 1;
207
+ transform: scale(1);
208
+ }
209
+ }.element-ditu .ani-wrap {
210
+ width: 100%;
211
+ height: 100%;
212
+ overflow: hidden
213
+ }
214
+
215
+ .element-ditu .map {
216
+ width: 100%;
217
+ height: 100%
218
+ }
219
+
220
+ .element-ditu .map .el-button {
221
+ width: 100%;
222
+ height: 100%;
223
+ display: -webkit-box;
224
+ display: -ms-flexbox;
225
+ display: flex;
226
+ -webkit-box-align: center;
227
+ -ms-flex-align: center;
228
+ align-items: center;
229
+ padding: 0;
230
+ -webkit-box-pack: center;
231
+ -ms-flex-pack: center;
232
+ justify-content: center;
233
+ background: inherit;
234
+ color: inherit;
235
+ border: none
236
+ }
237
+
238
+ .element-ditu .center-map {
239
+ width: 100%;
240
+ height: 100%;
241
+ background: #fff
242
+ }
243
+
244
+ .element-ditu .mask-map {
245
+ position: absolute;
246
+ width: 100%;
247
+ height: 100%;
248
+ top: 0
249
+ }
250
+ .map-iframe {
251
+ width: 100%;
252
+ height: 100%;
253
+ }.call {
244
254
  position: absolute;
245
255
  cursor: pointer;
246
256
  user-select: none;
@@ -274,41 +284,325 @@
274
284
  .hb-tel:before {
275
285
  content: "\E642";
276
286
  }
277
- @keyframes jumpheart {
278
- to {
279
- -webkit-transform: scale(1.2);
280
- transform: scale(1.2)
281
- }
282
- }
283
- .ele-calendar {
287
+ .ele-text {
284
288
  position: relative;
285
- width: 325px !important;
286
- min-height: 325px !important;
287
- height: auto !important;
288
289
  }
289
290
 
290
- .ele-calendar .drag-point {
291
- cursor: default !important;
291
+ .ele-text .ani-wrap {
292
+ width: 100%;
293
+ height: 100%;
292
294
  }
293
295
 
294
- .ele-calendar .ani-wrap {
295
- position: relative;
296
- width: 100%;
297
- min-height: 325px !important;
298
- height: auto !important;
299
- padding: 22px 0;
296
+ .text-common {
297
+ padding: 5px;
298
+ text-orientation: upright;
299
+ white-space: pre-wrap;
300
300
  }
301
301
 
302
- .ele-calendar .ani-wrap .can-wrap .can-top {
303
- display: flex;
304
- justify-content: space-between;
305
- align-items: flex-end;
306
- line-height: 1;
307
- padding: 0 47px 20px;
302
+ /* 文本动画类 */
303
+ .text-fadeIn {
304
+ animation: fadeIn 1s ease-in-out;
308
305
  }
309
306
 
310
- .ele-calendar .ani-wrap .can-wrap .can-top .can-left {
311
- font-size: 25px;
307
+ .text-slideIn {
308
+ animation: slideIn 1s ease-in-out;
309
+ }
310
+
311
+ .text-bounceIn {
312
+ animation: bounceIn 1s ease-in-out;
313
+ }
314
+
315
+ /* 基础动画关键帧 */
316
+ @keyframes fadeIn {
317
+ from {
318
+ opacity: 0;
319
+ }
320
+ to {
321
+ opacity: 1;
322
+ }
323
+ }
324
+
325
+ @keyframes slideIn {
326
+ from {
327
+ transform: translateY(20px);
328
+ opacity: 0;
329
+ }
330
+ to {
331
+ transform: translateY(0);
332
+ opacity: 1;
333
+ }
334
+ }
335
+
336
+ @keyframes bounceIn {
337
+ 0% {
338
+ transform: scale(0.3);
339
+ opacity: 0;
340
+ }
341
+ 50% {
342
+ transform: scale(1.05);
343
+ opacity: 0.8;
344
+ }
345
+ 70% {
346
+ transform: scale(0.9);
347
+ opacity: 0.9;
348
+ }
349
+ 100% {
350
+ transform: scale(1);
351
+ opacity: 1;
352
+ }
353
+ }.ele-effect {
354
+ will-change: transform;
355
+ }
356
+
357
+ .ele-effect .effect-wrap {
358
+ position: relative;
359
+ width: 100%;
360
+ height: 100%;
361
+ }
362
+
363
+ .particle {
364
+ position: absolute;
365
+ background-repeat: no-repeat;
366
+ background-size: contain;
367
+ animation-name: falling;
368
+ animation-timing-function: linear;
369
+ animation-iteration-count: infinite;
370
+ will-change: transform;
371
+ }
372
+
373
+ @keyframes falling {
374
+ 0% {
375
+ transform: translateY(0) rotate(0deg);
376
+ opacity: 1;
377
+ }
378
+ 80% {
379
+ opacity: 0.8;
380
+ }
381
+ 100% {
382
+ transform: translateY(100vh) rotate(360deg);
383
+ opacity: 0;
384
+ }
385
+ }
386
+ .ele-lottie .ele-lotwrap {
387
+ overflow: hidden
388
+ }
389
+
390
+ .ele-effect .effect-wrap {
391
+ position: relative;
392
+ overflow: hidden;
393
+ width: 100%;
394
+ height: 100%
395
+ }
396
+
397
+ .ele-effect .e-small {
398
+ position: absolute;
399
+ width: 24px;
400
+ height: 24px;
401
+ background-image: url(https://h5cdn.unika.cc/static/img/uniComponents/snow.png);
402
+ background-size: cover;
403
+ background-repeat: no-repeat;
404
+ -webkit-transform-origin: center;
405
+ transform-origin: center;
406
+ -webkit-animation: snow 5s linear infinite;
407
+ animation: snow 5s linear infinite
408
+ }.count-down .drag-point {
409
+ cursor: default!important
410
+ }
411
+
412
+ .count-down .ani-wrap {
413
+ width: 100%;
414
+ height: 100%
415
+ }
416
+
417
+ .count-down .count-text,.count-down .finish-cont {
418
+ display: -webkit-box;
419
+ display: -ms-flexbox;
420
+ display: flex;
421
+ height: 100%;
422
+ -webkit-box-align: center;
423
+ -ms-flex-align: center;
424
+ align-items: center;
425
+ -webkit-box-pack: center;
426
+ -ms-flex-pack: center;
427
+ justify-content: center
428
+ }
429
+
430
+ .count-down .finish-cont {
431
+ width: 100%
432
+ }
433
+
434
+ .count-down .count-flip {
435
+ display: -webkit-box;
436
+ display: -ms-flexbox;
437
+ display: flex;
438
+ height: 100%;
439
+ -webkit-box-align: center;
440
+ -ms-flex-align: center;
441
+ align-items: center;
442
+ -webkit-box-pack: center;
443
+ -ms-flex-pack: center;
444
+ justify-content: center
445
+ }
446
+
447
+ .count-down .count-flip .numscroll {
448
+ -webkit-animation: numscroll .4s ease-in-out;
449
+ animation: numscroll .4s ease-in-out;
450
+ -webkit-animation-fill-mode: both;
451
+ animation-fill-mode: both
452
+ }
453
+
454
+ .count-down .count-flip .numscroll .curr-num {
455
+ -webkit-transition: all .3s ease-in-out;
456
+ transition: all .3s ease-in-out;
457
+ opacity: .6;
458
+ -webkit-transform: scale(.5)!important;
459
+ transform: scale(.5)!important
460
+ }
461
+
462
+ @-webkit-keyframes numscroll {
463
+ 0% {
464
+ -webkit-transform: translateZ(0);
465
+ transform: translateZ(0)
466
+ }
467
+
468
+ to {
469
+ -webkit-transform: translate3d(0,100%,0);
470
+ transform: translate3d(0,100%,0)
471
+ }
472
+ }
473
+
474
+ @keyframes numscroll {
475
+ 0% {
476
+ -webkit-transform: translateZ(0);
477
+ transform: translateZ(0)
478
+ }
479
+
480
+ to {
481
+ -webkit-transform: translate3d(0,100%,0);
482
+ transform: translate3d(0,100%,0)
483
+ }
484
+ }
485
+
486
+ .count-down .count-flip .c-com {
487
+ min-width: 50px;
488
+ height: auto;
489
+ margin: 6px;
490
+ padding: 5px 0 6px;
491
+ background-color: #111
492
+ }
493
+
494
+ .count-down .count-flip .c-com .flex-wrap {
495
+ display: -webkit-box;
496
+ display: -ms-flexbox;
497
+ display: flex;
498
+ position: relative;
499
+ width: 100%;
500
+ height: 100%;
501
+ -webkit-box-align: center;
502
+ -ms-flex-align: center;
503
+ align-items: center
504
+ }
505
+
506
+ .count-down .count-flip .c-com .flex-wrap .curr-num,.count-down .count-flip .c-com .flex-wrap .next-num {
507
+ line-height: 27px
508
+ }
509
+
510
+ .count-down .count-flip .c-com .flex-wrap .next-num {
511
+ position: absolute;
512
+ top: -100%
513
+ }
514
+
515
+ .count-down .count-flip .c-com .flex-wrap .curr-num {
516
+ -webkit-transform: scale(1);
517
+ transform: scale(1)
518
+ }
519
+
520
+ .count-down .bottom-center,.count-down .left-bottom,.count-down .left-center,.count-down .left-top,.count-down .right-bottom,.count-down .right-center,.count-down .right-top,.count-down .top-center {
521
+ display: none!important
522
+ }
523
+
524
+ .c-wrap {
525
+ width: 100%;
526
+ height: 100%;
527
+ overflow: hidden;
528
+ font-size: 0
529
+ }
530
+
531
+ .c-wrap.c-day-wrap {
532
+ text-align: center
533
+ }
534
+
535
+ .c-wrap.c-day-wrap .c-num {
536
+ width: auto
537
+ }
538
+
539
+ .c-wrap .c-num {
540
+ display: inline-block;
541
+ width: 50%;
542
+ overflow: hidden;
543
+ font-size: 20px;
544
+ color: #999
545
+ }
546
+
547
+ .c-wrap .c-left .flex-wrap {
548
+ display: -webkit-box;
549
+ display: -ms-flexbox;
550
+ display: flex;
551
+ -webkit-box-pack: end;
552
+ -ms-flex-pack: end;
553
+ justify-content: flex-end
554
+ }
555
+
556
+ .c-wrap .c-text {
557
+ display: -webkit-box;
558
+ display: -ms-flexbox;
559
+ display: flex;
560
+ width: 100%;
561
+ font-size: 12px;
562
+ -webkit-box-pack: center;
563
+ -ms-flex-pack: center;
564
+ justify-content: center;
565
+ -webkit-box-align: center;
566
+ -ms-flex-align: center;
567
+ align-items: center;
568
+ white-space: nowrap
569
+ }
570
+
571
+ @keyframes jumpheart {
572
+ to {
573
+ -webkit-transform: scale(1.2);
574
+ transform: scale(1.2)
575
+ }
576
+ }
577
+ .ele-calendar {
578
+ position: relative;
579
+ width: 325px !important;
580
+ min-height: 325px !important;
581
+ height: auto !important;
582
+ }
583
+
584
+ .ele-calendar .drag-point {
585
+ cursor: default !important;
586
+ }
587
+
588
+ .ele-calendar .ani-wrap {
589
+ position: relative;
590
+ width: 100%;
591
+ min-height: 325px !important;
592
+ height: auto !important;
593
+ padding: 22px 0;
594
+ }
595
+
596
+ .ele-calendar .ani-wrap .can-wrap .can-top {
597
+ display: flex;
598
+ justify-content: space-between;
599
+ align-items: flex-end;
600
+ line-height: 1;
601
+ padding: 0 47px 20px;
602
+ }
603
+
604
+ .ele-calendar .ani-wrap .can-wrap .can-top .can-left {
605
+ font-size: 25px;
312
606
  padding-bottom: 4px;
313
607
  }
314
608
 
@@ -513,387 +807,232 @@
513
807
  font-size: 36px;
514
808
  }
515
809
 
516
- .ele-calendar .ani-wrap .can-wrap3 .can-top span {
517
- font-size: 16px
518
- }
519
-
520
- .ele-calendar .ani-wrap .can-wrap3 .can-top .can-year {
521
- font-size: 20px
522
- }
523
-
524
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-week {
525
- display: -webkit-box;
526
- display: -ms-flexbox;
527
- display: flex;
528
- -webkit-box-pack: start;
529
- -ms-flex-pack: start;
530
- justify-content: flex-start;
531
- height: 40px;
532
- line-height: 40px;
533
- padding: 0 34px;
534
- border-bottom: 1px solid
535
- }
536
-
537
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-week span {
538
- width: 14.2%;
539
- text-align: center;
540
- color: #fff;
541
- font-size: 12px;
542
- font-weight: 600
543
- }
544
-
545
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date {
546
- position: relative
547
- }
548
-
549
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul {
550
- font-size: 0;
551
- padding: 5px 33px 0;
552
- text-align: left
553
- }
554
-
555
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li {
556
- position: relative;
557
- display: inline-block;
558
- width: 14.2%;
559
- height: 25px;
560
- text-align: center;
561
- margin-top: 8px;
562
- }
563
-
564
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li.active {
565
- color: #eee
566
- }
567
-
568
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li.active .iconfont {
569
- display: block;
570
- position: absolute;
571
- left: 12%;
572
- top: 2px;
573
- }
574
-
575
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li.active span {
576
- font-size: 12px
577
- }
578
-
579
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li.heart-ani .iconfont {
580
- -webkit-animation: jumpheart .8s ease infinite alternate;
581
- animation: jumpheart .8s ease infinite alternate
582
- }
583
-
584
- @keyframes jumpheart {
585
- to {
586
- -webkit-transform: scale(1.2);
587
- transform: scale(1.2)
588
- }
589
- }
590
-
591
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li .iconfont {
592
- display: none;
593
- font-size: 26px
594
- }
595
-
596
- .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li span {
597
- position: absolute;
598
- left: 50%;
599
- top: 50%;
600
- z-index: 1;
601
- color: #666;
602
- font-size: 13px;
603
- -webkit-transform: translate(-50%,-52%);
604
- transform: translate(-50%,-52%)
605
- }
606
-
607
- .ele-calendar .bottom-center,.ele-calendar .left-center,.ele-calendar .right-center,.ele-calendar .top-center {
608
- display: none!important
609
- }
610
- .icon-tuoyuanxing:before {
611
- content: "\E6A7";
612
- }
613
- .icon-zan1:before {
614
- content: "\E66D";
615
- }
616
- .icon-xingzhuangjiehe:before {
617
- content: "\E6A6";
618
- }.count-down .drag-point {
619
- cursor: default!important
620
- }
621
-
622
- .count-down .ani-wrap {
623
- width: 100%;
624
- height: 100%
625
- }
626
-
627
- .count-down .count-text,.count-down .finish-cont {
628
- display: -webkit-box;
629
- display: -ms-flexbox;
630
- display: flex;
631
- height: 100%;
632
- -webkit-box-align: center;
633
- -ms-flex-align: center;
634
- align-items: center;
635
- -webkit-box-pack: center;
636
- -ms-flex-pack: center;
637
- justify-content: center
638
- }
639
-
640
- .count-down .finish-cont {
641
- width: 100%
642
- }
643
-
644
- .count-down .count-flip {
645
- display: -webkit-box;
646
- display: -ms-flexbox;
647
- display: flex;
648
- height: 100%;
649
- -webkit-box-align: center;
650
- -ms-flex-align: center;
651
- align-items: center;
652
- -webkit-box-pack: center;
653
- -ms-flex-pack: center;
654
- justify-content: center
655
- }
656
-
657
- .count-down .count-flip .numscroll {
658
- -webkit-animation: numscroll .4s ease-in-out;
659
- animation: numscroll .4s ease-in-out;
660
- -webkit-animation-fill-mode: both;
661
- animation-fill-mode: both
662
- }
663
-
664
- .count-down .count-flip .numscroll .curr-num {
665
- -webkit-transition: all .3s ease-in-out;
666
- transition: all .3s ease-in-out;
667
- opacity: .6;
668
- -webkit-transform: scale(.5)!important;
669
- transform: scale(.5)!important
670
- }
671
-
672
- @-webkit-keyframes numscroll {
673
- 0% {
674
- -webkit-transform: translateZ(0);
675
- transform: translateZ(0)
676
- }
677
-
678
- to {
679
- -webkit-transform: translate3d(0,100%,0);
680
- transform: translate3d(0,100%,0)
681
- }
682
- }
683
-
684
- @keyframes numscroll {
685
- 0% {
686
- -webkit-transform: translateZ(0);
687
- transform: translateZ(0)
688
- }
689
-
690
- to {
691
- -webkit-transform: translate3d(0,100%,0);
692
- transform: translate3d(0,100%,0)
693
- }
694
- }
695
-
696
- .count-down .count-flip .c-com {
697
- min-width: 50px;
698
- height: auto;
699
- margin: 6px;
700
- padding: 5px 0 6px;
701
- background-color: #111
810
+ .ele-calendar .ani-wrap .can-wrap3 .can-top span {
811
+ font-size: 16px
702
812
  }
703
813
 
704
- .count-down .count-flip .c-com .flex-wrap {
814
+ .ele-calendar .ani-wrap .can-wrap3 .can-top .can-year {
815
+ font-size: 20px
816
+ }
817
+
818
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-week {
705
819
  display: -webkit-box;
706
820
  display: -ms-flexbox;
707
821
  display: flex;
708
- position: relative;
709
- width: 100%;
710
- height: 100%;
711
- -webkit-box-align: center;
712
- -ms-flex-align: center;
713
- align-items: center
822
+ -webkit-box-pack: start;
823
+ -ms-flex-pack: start;
824
+ justify-content: flex-start;
825
+ height: 40px;
826
+ line-height: 40px;
827
+ padding: 0 34px;
828
+ border-bottom: 1px solid
714
829
  }
715
830
 
716
- .count-down .count-flip .c-com .flex-wrap .curr-num,.count-down .count-flip .c-com .flex-wrap .next-num {
717
- line-height: 27px
831
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-week span {
832
+ width: 14.2%;
833
+ text-align: center;
834
+ color: #fff;
835
+ font-size: 12px;
836
+ font-weight: 600
718
837
  }
719
838
 
720
- .count-down .count-flip .c-com .flex-wrap .next-num {
721
- position: absolute;
722
- top: -100%
839
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date {
840
+ position: relative
723
841
  }
724
842
 
725
- .count-down .count-flip .c-com .flex-wrap .curr-num {
726
- -webkit-transform: scale(1);
727
- transform: scale(1)
843
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul {
844
+ font-size: 0;
845
+ padding: 5px 33px 0;
846
+ text-align: left
728
847
  }
729
848
 
730
- .count-down .bottom-center,.count-down .left-bottom,.count-down .left-center,.count-down .left-top,.count-down .right-bottom,.count-down .right-center,.count-down .right-top,.count-down .top-center {
731
- display: none!important
849
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li {
850
+ position: relative;
851
+ display: inline-block;
852
+ width: 14.2%;
853
+ height: 25px;
854
+ text-align: center;
855
+ margin-top: 8px;
732
856
  }
733
857
 
734
- .c-wrap {
735
- width: 100%;
736
- height: 100%;
737
- overflow: hidden;
738
- font-size: 0
858
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li.active {
859
+ color: #eee
739
860
  }
740
861
 
741
- .c-wrap.c-day-wrap {
742
- text-align: center
862
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li.active .iconfont {
863
+ display: block;
864
+ position: absolute;
865
+ left: 12%;
866
+ top: 2px;
743
867
  }
744
868
 
745
- .c-wrap.c-day-wrap .c-num {
746
- width: auto
869
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li.active span {
870
+ font-size: 12px
747
871
  }
748
872
 
749
- .c-wrap .c-num {
750
- display: inline-block;
751
- width: 50%;
752
- overflow: hidden;
753
- font-size: 20px;
754
- color: #999
873
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li.heart-ani .iconfont {
874
+ -webkit-animation: jumpheart .8s ease infinite alternate;
875
+ animation: jumpheart .8s ease infinite alternate
755
876
  }
756
877
 
757
- .c-wrap .c-left .flex-wrap {
758
- display: -webkit-box;
759
- display: -ms-flexbox;
760
- display: flex;
761
- -webkit-box-pack: end;
762
- -ms-flex-pack: end;
763
- justify-content: flex-end
878
+ @keyframes jumpheart {
879
+ to {
880
+ -webkit-transform: scale(1.2);
881
+ transform: scale(1.2)
882
+ }
764
883
  }
765
884
 
766
- .c-wrap .c-text {
767
- display: -webkit-box;
768
- display: -ms-flexbox;
769
- display: flex;
770
- width: 100%;
771
- font-size: 12px;
772
- -webkit-box-pack: center;
773
- -ms-flex-pack: center;
774
- justify-content: center;
775
- -webkit-box-align: center;
776
- -ms-flex-align: center;
777
- align-items: center;
778
- white-space: nowrap
885
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li .iconfont {
886
+ display: none;
887
+ font-size: 26px
779
888
  }
780
- .ele-shape {
889
+
890
+ .ele-calendar .ani-wrap .can-wrap3 .can-main .can-date ul li span {
781
891
  position: absolute;
782
- overflow: hidden;
892
+ left: 50%;
893
+ top: 50%;
894
+ z-index: 1;
895
+ color: #666;
896
+ font-size: 13px;
897
+ -webkit-transform: translate(-50%,-52%);
898
+ transform: translate(-50%,-52%)
783
899
  }
784
900
 
785
- .ani-wrap {
786
- width: 100%;
787
- height: 100%;
788
- box-sizing: border-box;
901
+ .ele-calendar .bottom-center,.ele-calendar .left-center,.ele-calendar .right-center,.ele-calendar .top-center {
902
+ display: none!important
789
903
  }
790
-
791
- .e-shape {
792
- width: 100%;
793
- height: 100%;
904
+ .icon-tuoyuanxing:before {
905
+ content: "\E6A7";
794
906
  }
795
-
796
- .svg-container :deep(svg) {
797
- width: 100%;
798
- height: 100%;
799
- display: block;
907
+ .icon-zan1:before {
908
+ content: "\E66D";
800
909
  }
801
-
802
- .svg-loading,
803
- .svg-error {
804
- display: flex;
805
- align-items: center;
806
- justify-content: center;
807
- width: 100%;
808
- height: 100%;
809
- background: rgba(0,0,0,0.05);
810
- }.ele-effect {
811
- will-change: transform;
910
+ .icon-xingzhuangjiehe:before {
911
+ content: "\E6A6";
912
+ }.form-submit {
913
+ cursor: pointer;
914
+ transition: all 0.2s;
915
+ outline: none;
916
+ border: none;
812
917
  }
813
918
 
814
- .ele-effect .effect-wrap {
815
- position: relative;
816
- width: 100%;
817
- height: 100%;
919
+ .form-submit:hover {
920
+ opacity: 0.9;
921
+ transform: translateY(-1px);
818
922
  }
819
923
 
820
- .particle {
821
- position: absolute;
822
- background-repeat: no-repeat;
823
- background-size: contain;
824
- animation-name: falling;
825
- animation-timing-function: linear;
826
- animation-iteration-count: infinite;
827
- will-change: transform;
924
+ .form-submit:active {
925
+ opacity: 0.8;
926
+ transform: translateY(0);
828
927
  }
829
928
 
830
- @keyframes falling {
831
- 0% {
832
- transform: translateY(0) rotate(0deg);
833
- opacity: 1;
834
- }
835
- 80% {
836
- opacity: 0.8;
837
- }
838
- 100% {
839
- transform: translateY(100vh) rotate(360deg);
840
- opacity: 0;
841
- }
929
+ .form-submit:disabled {
930
+ opacity: 0.6;
931
+ cursor: not-allowed;
932
+ transform: none !important;
842
933
  }
843
- .ele-lottie .ele-lotwrap {
844
- overflow: hidden
934
+
935
+ .f-submit {
936
+ position: relative;
937
+ display: block
845
938
  }
846
939
 
847
- .ele-effect .effect-wrap {
848
- position: relative;
849
- overflow: hidden;
850
- width: 100%;
851
- height: 100%
940
+ .f-submit .ani-wrap {
941
+ width: 100%;
942
+ height: 100%;
943
+ padding: 10px;
944
+ overflow: hidden;
945
+ position: relative
852
946
  }
853
947
 
854
- .ele-effect .e-small {
855
- position: absolute;
856
- width: 24px;
857
- height: 24px;
858
- background-image: url(https://h5cdn.unika.cc/static/img/uniComponents/snow.png);
859
- background-size: cover;
860
- background-repeat: no-repeat;
861
- -webkit-transform-origin: center;
862
- transform-origin: center;
863
- -webkit-animation: snow 5s linear infinite;
864
- animation: snow 5s linear infinite
865
- }.button {
948
+ .f-submit .f-ovh {
866
949
  position: absolute;
867
- cursor: pointer;
868
- user-select: none;
950
+ left: 50%;
951
+ top: 50%;
952
+ transform: translate(-50%,-50%)
869
953
  }
870
-
871
- .button .ani-wrap {
872
- display: flex;
873
- justify-content: center;
874
- align-items: center;
954
+
955
+ .form-submit:disabled {
956
+ opacity: 0.7;
957
+ cursor: not-allowed;
958
+ }#page-list .tip-cover {
959
+ position: fixed;
960
+ left: 0;
961
+ top: 0;
875
962
  width: 100%;
876
963
  height: 100%;
877
- overflow: hidden;
878
- transition: opacity 0.2s;
964
+ display: -ms-flexbox;
965
+ display: flex;
966
+ -ms-flex-align: center;
967
+ align-items: center;
968
+ -ms-flex-pack: center;
969
+ justify-content: center;
970
+ z-index: 999;
971
+ background-color: rgba(0,0,0,.7)
972
+ }
973
+
974
+ #page-list .tip-cover .tip {
975
+ width: 80%;
976
+ max-width: 250px;
977
+ padding: 10px;
978
+ border-radius: 5px;
979
+ background-color: #fff
879
980
  }
880
-
881
- .button .ani-wrap:hover {
882
- opacity: 0.9;
981
+
982
+ #page-list .tip-cover .tip-btn {
983
+ display: block;
984
+ margin: 25px auto;
985
+ width: 120px;
986
+ height: 30px;
987
+ color: #fff;
988
+ border-radius: 4px;
989
+ text-align: center;
990
+ font-size: 14px;
991
+ line-height: 30px;
992
+ background: #ed5566
883
993
  }
884
994
 
885
- .button-content {
995
+ #page-list .tip-cover .tip-content {
996
+ font-size: 14px;
997
+ padding-top: 30px;
998
+ }
999
+
1000
+ .tip-cover {
1001
+ position: fixed;
1002
+ left: 0;
1003
+ top: 0;
1004
+ width: 100%;
1005
+ height: 100%;
1006
+ display: -ms-flexbox;
886
1007
  display: flex;
1008
+ -ms-flex-align: center;
887
1009
  align-items: center;
1010
+ -ms-flex-pack: center;
888
1011
  justify-content: center;
1012
+ z-index: 999;
1013
+ background-color: rgba(0,0,0,.7)
889
1014
  }
890
1015
 
891
- .btn-text {
892
- margin-left: 10px;
1016
+ .tip-cover .tip {
1017
+ width: 80%;
1018
+ max-width: 250px;
1019
+ padding: 5px;
1020
+ border-radius: 3px;
1021
+ background-color: #fff
893
1022
  }
894
- .ele-lottie .ele-lotwrap {
895
- overflow: hidden;
896
- }body, html {
1023
+
1024
+ .tip-cover .tip-btn {
1025
+ display: block;
1026
+ margin: 13px auto;
1027
+ width: 64px;
1028
+ height: 20px;
1029
+ color: #fff;
1030
+ border-radius: 4px;
1031
+ text-align: center;
1032
+ font-size: 14px;
1033
+ line-height: 20px;
1034
+ background: #ed5566;
1035
+ } body, html {
897
1036
  width: 100%;
898
1037
  height: 100%;
899
1038
  }
@@ -2364,51 +2503,57 @@ to {
2364
2503
  -webkit-transform: none;
2365
2504
  transform: none
2366
2505
  }
2367
- }.element-ditu .ani-wrap {
2368
- width: 100%;
2369
- height: 100%;
2370
- overflow: hidden
2371
- }
2372
-
2373
- .element-ditu .map {
2374
- width: 100%;
2375
- height: 100%
2376
- }
2377
-
2378
- .element-ditu .map .el-button {
2379
- width: 100%;
2380
- height: 100%;
2381
- display: -webkit-box;
2382
- display: -ms-flexbox;
2383
- display: flex;
2384
- -webkit-box-align: center;
2385
- -ms-flex-align: center;
2386
- align-items: center;
2387
- padding: 0;
2388
- -webkit-box-pack: center;
2389
- -ms-flex-pack: center;
2390
- justify-content: center;
2391
- background: inherit;
2392
- color: inherit;
2393
- border: none
2394
- }
2395
-
2396
- .element-ditu .center-map {
2397
- width: 100%;
2398
- height: 100%;
2399
- background: #fff
2400
- }
2401
-
2402
- .element-ditu .mask-map {
2403
- position: absolute;
2404
- width: 100%;
2405
- height: 100%;
2406
- top: 0
2407
- }
2408
- .map-iframe {
2409
- width: 100%;
2410
- height: 100%;
2411
- }/* Iconfont definition */
2506
+ }.form-input {
2507
+ position: absolute;
2508
+ }
2509
+
2510
+ .input-wrapper {
2511
+ display: flex;
2512
+ align-items: center;
2513
+ width: 100%;
2514
+ height: 100%;
2515
+ padding: 0 10px;
2516
+ box-sizing: border-box;
2517
+ position: relative;
2518
+ transition: border-color 0.3s;
2519
+ }
2520
+
2521
+ .required-marker {
2522
+ font-size: 12px;
2523
+ padding: 0 5px 0 0;
2524
+ color: red;
2525
+ vertical-align: middle;
2526
+ }
2527
+
2528
+ input {
2529
+ flex: 1;
2530
+ border: none;
2531
+ outline: none;
2532
+ background: transparent;
2533
+ height: 100%;
2534
+ padding: 0;
2535
+ margin: 0;
2536
+ }
2537
+ /*
2538
+ input::placeholder {
2539
+ color: #ccc;
2540
+ opacity: 1;
2541
+ } */
2542
+
2543
+ .dynamic-placeholder-input::placeholder {
2544
+ color: var(--placeholder-color, #999);
2545
+ opacity: 1;
2546
+ }
2547
+ .dynamic-placeholder-input::-webkit-input-placeholder {
2548
+ color: var(--placeholder-color, #999);
2549
+ }
2550
+ .dynamic-placeholder-input::-moz-placeholder {
2551
+ color: var(--placeholder-color, #999);
2552
+ opacity: 1;
2553
+ }
2554
+ .dynamic-placeholder-input:-ms-input-placeholder {
2555
+ color: var(--placeholder-color, #999);
2556
+ }/* Iconfont definition */
2412
2557
  .icon-danmuliebiao1:before {
2413
2558
  content: "\E68A";
2414
2559
  }
@@ -3289,207 +3434,62 @@ to {
3289
3434
  position: absolute;
3290
3435
  top: 0;
3291
3436
  left: 0;
3292
- width: 100%;
3293
- height: 100%;
3294
- display: flex;
3295
- justify-content: center;
3296
- align-items: center;
3297
- background: rgba(255, 255, 255, 0.8);
3298
- }
3299
-
3300
- .loading-spinner {
3301
- width: 40px;
3302
- height: 40px;
3303
- border: 4px solid #f3f3f3;
3304
- border-top: 4px solid #ed5566;
3305
- border-radius: 50%;
3306
- animation: spin 1s linear infinite;
3307
- }
3308
-
3309
- @keyframes spin {
3310
- 0% { transform: rotate(0deg); }
3311
- 100% { transform: rotate(360deg); }
3312
- }
3313
-
3314
- .form-input {
3315
- position: absolute;
3316
- }
3317
-
3318
- .input-wrapper {
3319
- display: flex;
3320
- align-items: center;
3321
- width: 100%;
3322
- height: 100%;
3323
- padding: 0 10px;
3324
- box-sizing: border-box;
3325
- position: relative;
3326
- transition: border-color 0.3s;
3327
- }
3328
-
3329
- .required-marker {
3330
- font-size: 12px;
3331
- padding: 0 5px 0 0;
3332
- color: red;
3333
- vertical-align: middle;
3334
- }
3335
-
3336
- input {
3337
- flex: 1;
3338
- border: none;
3339
- outline: none;
3340
- background: transparent;
3341
- height: 100%;
3342
- padding: 0;
3343
- margin: 0;
3344
- }
3345
- /*
3346
- input::placeholder {
3347
- color: #ccc;
3348
- opacity: 1;
3349
- } */
3350
-
3351
- .dynamic-placeholder-input::placeholder {
3352
- color: var(--placeholder-color, #999);
3353
- opacity: 1;
3354
- }
3355
- .dynamic-placeholder-input::-webkit-input-placeholder {
3356
- color: var(--placeholder-color, #999);
3357
- }
3358
- .dynamic-placeholder-input::-moz-placeholder {
3359
- color: var(--placeholder-color, #999);
3360
- opacity: 1;
3361
- }
3362
- .dynamic-placeholder-input:-ms-input-placeholder {
3363
- color: var(--placeholder-color, #999);
3364
- }#page-list .tip-cover {
3365
- position: fixed;
3366
- left: 0;
3367
- top: 0;
3368
- width: 100%;
3369
- height: 100%;
3370
- display: -ms-flexbox;
3371
- display: flex;
3372
- -ms-flex-align: center;
3373
- align-items: center;
3374
- -ms-flex-pack: center;
3375
- justify-content: center;
3376
- z-index: 999;
3377
- background-color: rgba(0,0,0,.7)
3378
- }
3379
-
3380
- #page-list .tip-cover .tip {
3381
- width: 80%;
3382
- max-width: 250px;
3383
- padding: 10px;
3384
- border-radius: 5px;
3385
- background-color: #fff
3386
- }
3387
-
3388
- #page-list .tip-cover .tip-btn {
3389
- display: block;
3390
- margin: 25px auto;
3391
- width: 120px;
3392
- height: 30px;
3393
- color: #fff;
3394
- border-radius: 4px;
3395
- text-align: center;
3396
- font-size: 14px;
3397
- line-height: 30px;
3398
- background: #ed5566
3399
- }
3400
-
3401
- #page-list .tip-cover .tip-content {
3402
- font-size: 14px;
3403
- padding-top: 30px;
3437
+ width: 100%;
3438
+ height: 100%;
3439
+ display: flex;
3440
+ justify-content: center;
3441
+ align-items: center;
3442
+ background: rgba(255, 255, 255, 0.8);
3443
+ }
3444
+
3445
+ .loading-spinner {
3446
+ width: 40px;
3447
+ height: 40px;
3448
+ border: 4px solid #f3f3f3;
3449
+ border-top: 4px solid #ed5566;
3450
+ border-radius: 50%;
3451
+ animation: spin 1s linear infinite;
3452
+ }
3453
+
3454
+ @keyframes spin {
3455
+ 0% { transform: rotate(0deg); }
3456
+ 100% { transform: rotate(360deg); }
3457
+ }
3458
+
3459
+ .button {
3460
+ position: absolute;
3461
+ cursor: pointer;
3462
+ user-select: none;
3404
3463
  }
3405
-
3406
- .tip-cover {
3407
- position: fixed;
3408
- left: 0;
3409
- top: 0;
3410
- width: 100%;
3411
- height: 100%;
3412
- display: -ms-flexbox;
3464
+
3465
+ .button .ani-wrap {
3413
3466
  display: flex;
3414
- -ms-flex-align: center;
3415
- align-items: center;
3416
- -ms-flex-pack: center;
3417
3467
  justify-content: center;
3418
- z-index: 999;
3419
- background-color: rgba(0,0,0,.7)
3420
- }
3421
-
3422
- .tip-cover .tip {
3423
- width: 80%;
3424
- max-width: 250px;
3425
- padding: 5px;
3426
- border-radius: 3px;
3427
- background-color: #fff
3428
- }
3429
-
3430
- .tip-cover .tip-btn {
3431
- display: block;
3432
- margin: 13px auto;
3433
- width: 64px;
3434
- height: 20px;
3435
- color: #fff;
3436
- border-radius: 4px;
3437
- text-align: center;
3438
- font-size: 14px;
3439
- line-height: 20px;
3440
- background: #ed5566;
3441
- } .form-submit {
3442
- cursor: pointer;
3443
- transition: all 0.2s;
3444
- outline: none;
3445
- border: none;
3446
- }
3447
-
3448
- .form-submit:hover {
3449
- opacity: 0.9;
3450
- transform: translateY(-1px);
3451
- }
3452
-
3453
- .form-submit:active {
3454
- opacity: 0.8;
3455
- transform: translateY(0);
3456
- }
3457
-
3458
- .form-submit:disabled {
3459
- opacity: 0.6;
3460
- cursor: not-allowed;
3461
- transform: none !important;
3462
- }
3463
-
3464
- .f-submit {
3465
- position: relative;
3466
- display: block
3467
- }
3468
-
3469
- .f-submit .ani-wrap {
3468
+ align-items: center;
3470
3469
  width: 100%;
3471
3470
  height: 100%;
3472
- padding: 10px;
3473
3471
  overflow: hidden;
3474
- position: relative
3472
+ transition: opacity 0.2s;
3473
+ }
3474
+
3475
+ .button .ani-wrap:hover {
3476
+ opacity: 0.9;
3475
3477
  }
3476
3478
 
3477
- .f-submit .f-ovh {
3478
- position: absolute;
3479
- left: 50%;
3480
- top: 50%;
3481
- transform: translate(-50%,-50%)
3479
+ .button-content {
3480
+ display: flex;
3481
+ align-items: center;
3482
+ justify-content: center;
3482
3483
  }
3483
3484
 
3484
- .form-submit:disabled {
3485
- opacity: 0.7;
3486
- cursor: not-allowed;
3485
+ .btn-text {
3486
+ margin-left: 10px;
3487
3487
  }/* .ele-form {
3488
3488
  position: absolute;
3489
3489
  user-select: none;
3490
- } */
3491
-
3492
- .f-select {
3490
+ }
3491
+ */
3492
+ .f-single {
3493
3493
  cursor: pointer;
3494
3494
  }
3495
3495
 
@@ -3497,13 +3497,15 @@ cursor: not-allowed;
3497
3497
  position: relative;
3498
3498
  }
3499
3499
 
3500
- .f-select .ani-wrap .fs-tit {
3501
- position: relative;
3500
+ .f-single .ani-wrap .fs-tit {
3502
3501
  display: flex;
3503
3502
  padding: 0 5px;
3504
- height: 35px;
3505
- line-height: 35px;
3503
+ height: 40px;
3506
3504
  align-items: center;
3505
+ white-space: nowrap;
3506
+ overflow: hidden;
3507
+ text-overflow: ellipsis;
3508
+ border-bottom: 1px solid rgba(153, 153, 153, 1);
3507
3509
  }
3508
3510
 
3509
3511
  .require {
@@ -3512,69 +3514,63 @@ cursor: not-allowed;
3512
3514
  vertical-align: middle;
3513
3515
  }
3514
3516
 
3515
- .fs-cont {
3516
- padding-right: 15px;
3517
- white-space: nowrap;
3518
- overflow: hidden;
3519
- text-overflow: ellipsis;
3520
- flex-grow: 1;
3521
- }
3522
-
3523
- .icon-bofang1 {
3524
- font-size: 12px;
3525
- transition: transform 0.2s ease;
3526
- }
3527
-
3528
- .rotate-180 {
3529
- transform: rotate(180deg) !important;
3530
- }
3531
-
3532
- .f-real {
3533
- position: absolute;
3534
- left: 0;
3535
- top: 0;
3536
- width: 100%;
3537
- height: 100%;
3538
- z-index: 1;
3539
- opacity: 0;
3540
- cursor: pointer;
3517
+ .f-single ul {
3518
+ padding: 15px;
3519
+ margin: 0;
3520
+ list-style: none;
3541
3521
  }
3542
3522
 
3543
- .dropdown-menu {
3544
- box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
3523
+ .f-single ul li {
3524
+ display: flex;
3525
+ align-items: center;
3526
+ margin-top: 12px;
3527
+ font-size: 0;
3545
3528
  }
3546
3529
 
3547
- .dropdown-item {
3548
- padding: 8px 10px;
3549
- cursor: pointer;
3550
- transition: background-color 0.2s;
3530
+ .f-single ul li:first-child {
3531
+ margin-top: 0;
3551
3532
  }
3552
3533
 
3553
- .dropdown-item:hover {
3554
- background-color: #f5f5f5;
3534
+ .fs-circle {
3535
+ display: inline-block;
3536
+ width: 16px;
3537
+ height: 16px;
3538
+ border-radius: 50%;
3539
+ position: relative;
3540
+ transition: all 0.2s;
3555
3541
  }
3556
3542
 
3557
- .dropdown-item.selected {
3558
- background-color: #e6f7ff;
3559
- color: #1890ff;
3543
+ .fs-circle.selected {
3544
+ background-color: #2687f1;
3545
+ border-color: #2687f1 !important;
3560
3546
  }
3561
3547
 
3562
- .f-select .fs-tit .icon-bofang1 {
3563
- position: absolute;
3564
- right: 10px;
3565
- font-size: 12px;
3566
- display: inline-block;
3567
- transform: rotate(90deg);
3548
+ .fs-circle.selected::after {
3549
+ content: "";
3550
+ position: absolute;
3551
+ top: 3px;
3552
+ left: 3px;
3553
+ width: 8px;
3554
+ height: 8px;
3555
+ border-radius: 50%;
3556
+ background-color: white;
3568
3557
  }
3569
3558
 
3570
- .icon-bofang1:before {
3571
- content: "\E6CF";
3559
+ .fs-txt {
3560
+ display: inline-block;
3561
+ width: calc(100% - 16px);
3562
+ padding-left: 8px;
3563
+ vertical-align: top;
3564
+ word-break: break-all;
3565
+ font-size: 14px;
3566
+ line-height: 1.2;
3572
3567
  }
3573
3568
 
3574
- .has-error {
3575
- border-color: #ff4d4f !important;
3569
+ .has-error .fs-tit {
3570
+ border-bottom-color: #ff4d4f;
3576
3571
  }
3577
3572
 
3573
+ /* 错误提示样式 */
3578
3574
  .error-tip {
3579
3575
  position: fixed;
3580
3576
  left: 0;
@@ -3585,9 +3581,9 @@ cursor: not-allowed;
3585
3581
  }/* .ele-form {
3586
3582
  position: absolute;
3587
3583
  user-select: none;
3588
- }
3589
- */
3590
- .f-single {
3584
+ } */
3585
+
3586
+ .f-select {
3591
3587
  cursor: pointer;
3592
3588
  }
3593
3589
 
@@ -3595,15 +3591,13 @@ cursor: not-allowed;
3595
3591
  position: relative;
3596
3592
  }
3597
3593
 
3598
- .f-single .ani-wrap .fs-tit {
3594
+ .f-select .ani-wrap .fs-tit {
3595
+ position: relative;
3599
3596
  display: flex;
3600
3597
  padding: 0 5px;
3601
- height: 40px;
3598
+ height: 35px;
3599
+ line-height: 35px;
3602
3600
  align-items: center;
3603
- white-space: nowrap;
3604
- overflow: hidden;
3605
- text-overflow: ellipsis;
3606
- border-bottom: 1px solid rgba(153, 153, 153, 1);
3607
3601
  }
3608
3602
 
3609
3603
  .require {
@@ -3612,63 +3606,69 @@ cursor: not-allowed;
3612
3606
  vertical-align: middle;
3613
3607
  }
3614
3608
 
3615
- .f-single ul {
3616
- padding: 15px;
3617
- margin: 0;
3618
- list-style: none;
3609
+ .fs-cont {
3610
+ padding-right: 15px;
3611
+ white-space: nowrap;
3612
+ overflow: hidden;
3613
+ text-overflow: ellipsis;
3614
+ flex-grow: 1;
3615
+ }
3616
+
3617
+ .icon-bofang1 {
3618
+ font-size: 12px;
3619
+ transition: transform 0.2s ease;
3620
+ }
3621
+
3622
+ .rotate-180 {
3623
+ transform: rotate(180deg) !important;
3624
+ }
3625
+
3626
+ .f-real {
3627
+ position: absolute;
3628
+ left: 0;
3629
+ top: 0;
3630
+ width: 100%;
3631
+ height: 100%;
3632
+ z-index: 1;
3633
+ opacity: 0;
3634
+ cursor: pointer;
3619
3635
  }
3620
3636
 
3621
- .f-single ul li {
3622
- display: flex;
3623
- align-items: center;
3624
- margin-top: 12px;
3625
- font-size: 0;
3637
+ .dropdown-menu {
3638
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
3626
3639
  }
3627
3640
 
3628
- .f-single ul li:first-child {
3629
- margin-top: 0;
3641
+ .dropdown-item {
3642
+ padding: 8px 10px;
3643
+ cursor: pointer;
3644
+ transition: background-color 0.2s;
3630
3645
  }
3631
3646
 
3632
- .fs-circle {
3633
- display: inline-block;
3634
- width: 16px;
3635
- height: 16px;
3636
- border-radius: 50%;
3637
- position: relative;
3638
- transition: all 0.2s;
3647
+ .dropdown-item:hover {
3648
+ background-color: #f5f5f5;
3639
3649
  }
3640
3650
 
3641
- .fs-circle.selected {
3642
- background-color: #2687f1;
3643
- border-color: #2687f1 !important;
3651
+ .dropdown-item.selected {
3652
+ background-color: #e6f7ff;
3653
+ color: #1890ff;
3644
3654
  }
3645
3655
 
3646
- .fs-circle.selected::after {
3647
- content: "";
3648
- position: absolute;
3649
- top: 3px;
3650
- left: 3px;
3651
- width: 8px;
3652
- height: 8px;
3653
- border-radius: 50%;
3654
- background-color: white;
3656
+ .f-select .fs-tit .icon-bofang1 {
3657
+ position: absolute;
3658
+ right: 10px;
3659
+ font-size: 12px;
3660
+ display: inline-block;
3661
+ transform: rotate(90deg);
3655
3662
  }
3656
3663
 
3657
- .fs-txt {
3658
- display: inline-block;
3659
- width: calc(100% - 16px);
3660
- padding-left: 8px;
3661
- vertical-align: top;
3662
- word-break: break-all;
3663
- font-size: 14px;
3664
- line-height: 1.2;
3664
+ .icon-bofang1:before {
3665
+ content: "\E6CF";
3665
3666
  }
3666
3667
 
3667
- .has-error .fs-tit {
3668
- border-bottom-color: #ff4d4f;
3668
+ .has-error {
3669
+ border-color: #ff4d4f !important;
3669
3670
  }
3670
3671
 
3671
- /* 错误提示样式 */
3672
3672
  .error-tip {
3673
3673
  position: fixed;
3674
3674
  left: 0;
@@ -3676,104 +3676,7 @@ cursor: not-allowed;
3676
3676
  width: 100%;
3677
3677
  height: 100%;
3678
3678
  z-index: 1000;
3679
- }/* .ele-form {
3680
- position: absolute;
3681
- user-select: none;
3682
- } */
3683
-
3684
- .f-multiple {
3685
- cursor: pointer;
3686
- }
3687
-
3688
- .ani-wrap {
3689
- position: relative;
3690
- }
3691
-
3692
- .f-multiple .ani-wrap .fs-tit {
3693
- display: flex;
3694
- padding: 0 5px;
3695
- height: 40px;
3696
- align-items: center;
3697
- white-space: nowrap;
3698
- overflow: hidden;
3699
- text-overflow: ellipsis;
3700
- border-bottom: 1px solid rgba(153, 153, 153, 1);
3701
- }
3702
-
3703
- .require {
3704
- padding: 0 5px 0 0;
3705
- color: red;
3706
- vertical-align: middle;
3707
- }
3708
-
3709
- .f-multiple ul {
3710
- padding: 15px;
3711
- margin: 0;
3712
- list-style: none;
3713
- }
3714
-
3715
- .f-multiple ul li {
3716
- margin-top: 12px;
3717
- font-size: 0;
3718
- display: flex;
3719
- align-items: center;
3720
- cursor: pointer;
3721
- }
3722
-
3723
- .f-multiple ul li:first-child {
3724
- margin-top: 0;
3725
- }
3726
-
3727
- .fs-circle {
3728
- display: inline-block;
3729
- width: 16px;
3730
- height: 16px;
3731
- border-radius: 50%;
3732
- position: relative;
3733
- transition: all 0.2s;
3734
- }
3735
-
3736
- .fs-circle.selected {
3737
- background-color: #2687f1;
3738
- border-color: #2687f1 !important;
3739
- }
3740
-
3741
- .fs-circle.selected::after {
3742
- content: "";
3743
- position: absolute;
3744
- top: 3px;
3745
- left: 3px;
3746
- width: 8px;
3747
- height: 8px;
3748
- border-radius: 50%;
3749
- background-color: white;
3750
- }
3751
-
3752
- .fs-txt {
3753
- display: inline-block;
3754
- width: calc(100% - 16px);
3755
- padding-left: 8px;
3756
- vertical-align: top;
3757
- word-break: break-all;
3758
- font-size: 14px;
3759
- line-height: 1.2;
3760
- }
3761
-
3762
- .has-error .fs-tit {
3763
- border-bottom-color: #ff4d4f;
3764
- }
3765
- .global.tel {
3766
- width: 35px;
3767
- height: 55px;
3768
- border-radius: 50%;
3769
- text-align: center;
3770
- margin-bottom: 15px;
3771
- border: 2px solid #fff;
3772
- cursor: pointer;
3773
- }
3774
- .icon-dianhua:before { content: "\E60E"; }
3775
- .iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
3776
- .global.tel > span { font-size: 10px; line-height: 20px; display: block;}
3679
+ }
3777
3680
  .icon-guanbi:before {
3778
3681
  content: "\E676";
3779
3682
  }
@@ -4167,7 +4070,92 @@ cursor: not-allowed;
4167
4070
  content: "\E65E";
4168
4071
  color: #F44336; /* 失败的红色 */
4169
4072
  }
4073
+ /* .ele-form {
4074
+ position: absolute;
4075
+ user-select: none;
4076
+ } */
4077
+
4078
+ .f-multiple {
4079
+ cursor: pointer;
4080
+ }
4081
+
4082
+ .ani-wrap {
4083
+ position: relative;
4084
+ }
4085
+
4086
+ .f-multiple .ani-wrap .fs-tit {
4087
+ display: flex;
4088
+ padding: 0 5px;
4089
+ height: 40px;
4090
+ align-items: center;
4091
+ white-space: nowrap;
4092
+ overflow: hidden;
4093
+ text-overflow: ellipsis;
4094
+ border-bottom: 1px solid rgba(153, 153, 153, 1);
4095
+ }
4096
+
4097
+ .require {
4098
+ padding: 0 5px 0 0;
4099
+ color: red;
4100
+ vertical-align: middle;
4101
+ }
4102
+
4103
+ .f-multiple ul {
4104
+ padding: 15px;
4105
+ margin: 0;
4106
+ list-style: none;
4107
+ }
4108
+
4109
+ .f-multiple ul li {
4110
+ margin-top: 12px;
4111
+ font-size: 0;
4112
+ display: flex;
4113
+ align-items: center;
4114
+ cursor: pointer;
4115
+ }
4116
+
4117
+ .f-multiple ul li:first-child {
4118
+ margin-top: 0;
4119
+ }
4120
+
4121
+ .fs-circle {
4122
+ display: inline-block;
4123
+ width: 16px;
4124
+ height: 16px;
4125
+ border-radius: 50%;
4126
+ position: relative;
4127
+ transition: all 0.2s;
4128
+ }
4129
+
4130
+ .fs-circle.selected {
4131
+ background-color: #2687f1;
4132
+ border-color: #2687f1 !important;
4133
+ }
4134
+
4135
+ .fs-circle.selected::after {
4136
+ content: "";
4137
+ position: absolute;
4138
+ top: 3px;
4139
+ left: 3px;
4140
+ width: 8px;
4141
+ height: 8px;
4142
+ border-radius: 50%;
4143
+ background-color: white;
4144
+ }
4145
+
4146
+ .fs-txt {
4147
+ display: inline-block;
4148
+ width: calc(100% - 16px);
4149
+ padding-left: 8px;
4150
+ vertical-align: top;
4151
+ word-break: break-all;
4152
+ font-size: 14px;
4153
+ line-height: 1.2;
4154
+ }
4170
4155
 
4156
+ .has-error .fs-tit {
4157
+ border-bottom-color: #ff4d4f;
4158
+ }
4171
4159
  .global.map {
4172
4160
  width: 35px;
4173
4161
  height: 55px;
@@ -4205,4 +4193,16 @@ cursor: not-allowed;
4205
4193
  }
4206
4194
  .icon-liuyan:before { content: "\E636"; }
4207
4195
  .iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
4208
- .global.receipt > span { font-size: 10px; line-height: 20px; display: block; }
4196
+ .global.receipt > span { font-size: 10px; line-height: 20px; display: block; }
4197
+ .global.tel {
4198
+ width: 35px;
4199
+ height: 55px;
4200
+ border-radius: 50%;
4201
+ text-align: center;
4202
+ margin-bottom: 15px;
4203
+ border: 2px solid #fff;
4204
+ cursor: pointer;
4205
+ }
4206
+ .icon-dianhua:before { content: "\E60E"; }
4207
+ .iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
4208
+ .global.tel > span { font-size: 10px; line-height: 20px; display: block;}