unika-components 1.0.93 → 1.0.94

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.
@@ -14,79 +14,6 @@ button.uni-text-component {
14
14
  box-sizing: border-box;
15
15
  white-space: pre-wrap;
16
16
  }
17
-
18
- .slide-guide {
19
- position: absolute;
20
- bottom: 90px;
21
- left: 50%;
22
- transform: translateX(-50%);
23
- }
24
- .slide-guide img {
25
- animation: flowing 2s ease-in-out infinite;
26
- width: 33px;
27
- vertical-align: middle;
28
- border-style: none;
29
- }
30
- body, html {
31
- position: relative;
32
- width: 100%;
33
- height: 100%;
34
- margin: 0px;
35
- }
36
- .swiper-container {
37
- width: 100%;
38
- height: 100%;
39
- }
40
- .swiper-slide {
41
- width: 100%;
42
- height: 100%;
43
- overflow: hidden;
44
- background-size: cover;
45
- background-position: center;
46
- background-repeat: no-repeat;
47
- }
48
- .up-arrow {
49
- width: 2rem;
50
- height: 2rem;
51
- position: fixed;
52
- bottom: 2rem;
53
- left: 50%;
54
- transform: translate3d(-50%, 0, 0);
55
- z-index: 999;
56
- background: none;
57
- border: none;
58
- padding: 0;
59
- animation: upArrowAni 2s infinite linear;
60
- }
61
- .up-arrow img {
62
- width: 2rem;
63
- height: 2rem;
64
- text-align: center;
65
- line-height: 2rem;
66
- color: #fff;
67
- font-size: 1.5rem;
68
- }
69
- @keyframes upArrowAni {
70
- 0% {
71
- opacity: 0;
72
- transform: translate3d(-50%, 30%, 0);
73
- }
74
-
75
- 30% {
76
- opacity: 1;
77
- transform: translate3d(-50%, -20%, 0);
78
- }
79
-
80
- 60% {
81
- opacity: 0;
82
- transform: translate3d(-50%, -35%, 0);
83
- }
84
-
85
- 100% {
86
- opacity: 0;
87
- transform: translate3d(-50%, -50%, 0);
88
- }
89
- }
90
17
 
91
18
  .slot-number {
92
19
  position: absolute;
@@ -137,8 +64,8 @@ body, html {
137
64
  right: 10px;
138
65
  top: 10px;
139
66
  z-index: 103;
140
- width: 30px;
141
- height: 30px;
67
+ width: 32px;
68
+ height: 32px;
142
69
  display: -webkit-box;
143
70
  display: -ms-flexbox;
144
71
  display: flex;
@@ -188,23 +115,6 @@ body, html {
188
115
  -webkit-animation: mrotate 5s linear infinite;
189
116
  animation: mrotate 5s linear infinite;
190
117
  }
191
- .video-play-audio {
192
- position: absolute;
193
- left: -9999px;
194
- top: -9999px;
195
- width: 0;
196
- height: 0;
197
- z-index: -1;
198
- opacity: 1;
199
- overflow: hidden;
200
- }
201
-
202
- .music-img {
203
- position: relative;
204
- display: inline-block;
205
- width: 100%;
206
- height: 100%;
207
- }
208
118
 
209
119
  .uni-music-component {
210
120
  position: absolute;
@@ -229,90 +139,85 @@ body, html {
229
139
  -webkit-transform: rotate(360deg);
230
140
  }
231
141
  }
232
-
233
- .uni-video-component {
234
- position: relative;
235
- text-align: center;
236
- }
237
- .play-pause-button {
238
- position: absolute;
239
- top: 50%;
240
- left: 50%;
241
- transform: translate(-50%, -50%);
242
- cursor: pointer;
243
- font-size: 2rem;
244
- color: #fff;
245
- background: rgba(0, 0, 0, 0.6);
246
- border-radius: 50%;
247
- padding: 10px;
248
- transition: background 0.3s;
249
- }
250
- .play-pause-button:hover {
251
- background: rgba(0, 0, 0, 0.8);
252
- }
253
-
254
- .ant-input-number {
255
- box-sizing: border-box;
256
- margin: 0;
257
- padding: 0;
258
- color: rgba(0, 0, 0, 0.88);
259
- font-size: 14px;
260
- line-height: 1.5714285714285714;
261
- list-style: none;
262
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
263
- position: relative;
264
- display: inline-block;
265
- width: 100%;
266
- min-width: 0;
267
- background-color: #ffffff;
268
- background-image: none;
269
- border-width: 1px;
270
- border-style: solid;
271
- border-color: #d9d9d9;
272
- border-radius: 6px;
273
- transition: all 0.2s;
274
- border: 1px solid #d9d9d9;
275
- }
276
- .ant-form-item {
277
- box-sizing: border-box;
278
- margin: 0;
279
- padding: 0;
280
- color: rgba(0, 0, 0, 0.88);
281
- font-size: 14px;
282
- line-height: 1.5714285714285714;
283
- list-style: none;
284
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
285
- margin-bottom: 0px;
286
- vertical-align: top;
287
- }
142
+
143
+ .slide-guide {
144
+ position: absolute;
145
+ bottom: 90px;
146
+ left: 50%;
147
+ transform: translateX(-50%);
148
+ }
149
+ .slide-guide img {
150
+ animation: flowing 2s ease-in-out infinite;
151
+ width: 33px;
152
+ vertical-align: middle;
153
+ border-style: none;
154
+ }
155
+ body, html {
156
+ position: relative;
157
+ width: 100%;
158
+ height: 100%;
159
+ margin: 0px;
160
+ }
161
+ .swiper-container {
162
+ width: 100%;
163
+ height: 100%;
164
+ }
165
+ .swiper-slide {
166
+ width: 100%;
167
+ height: 100%;
168
+ overflow: hidden;
169
+ background-size: cover;
170
+ background-position: center;
171
+ background-repeat: no-repeat;
172
+ }
173
+ .up-arrow {
174
+ width: 2rem;
175
+ height: 2rem;
176
+ position: fixed;
177
+ bottom: 2rem;
178
+ left: 50%;
179
+ transform: translate3d(-50%, 0, 0);
180
+ z-index: 999;
181
+ background: none;
182
+ border: none;
183
+ padding: 0;
184
+ animation: upArrowAni 2s infinite linear;
185
+ }
186
+ .up-arrow img {
187
+ width: 2rem;
188
+ height: 2rem;
189
+ text-align: center;
190
+ line-height: 2rem;
191
+ color: #fff;
192
+ font-size: 1.5rem;
193
+ }
194
+ @keyframes upArrowAni {
195
+ 0% {
196
+ opacity: 0;
197
+ transform: translate3d(-50%, 30%, 0);
198
+ }
199
+
200
+ 30% {
201
+ opacity: 1;
202
+ transform: translate3d(-50%, -20%, 0);
203
+ }
204
+
205
+ 60% {
206
+ opacity: 0;
207
+ transform: translate3d(-50%, -35%, 0);
208
+ }
209
+
210
+ 100% {
211
+ opacity: 0;
212
+ transform: translate3d(-50%, -50%, 0);
213
+ }
214
+ }
288
215
 
289
216
  .effect {
290
217
  width: 100%;
291
218
  height: 100%;
292
219
  }
293
220
 
294
- .like-button {
295
- display: flex;
296
- flex-direction: column;
297
- align-items: center;
298
- cursor: pointer;
299
- }
300
-
301
- .icon-heart {
302
- font-size: 24px;
303
- color: #e74c3c;
304
- }
305
-
306
- .liked {
307
- color: #f00; /* 更改颜色以示已赞 */
308
- }
309
-
310
- .like-count {
311
- margin-top: 4px;
312
- font-size: 16px;
313
- color: #333;
314
- }
315
-
316
221
  .barrage-container {
317
222
  position: fixed;
318
223
  bottom: 0;
@@ -562,21 +467,99 @@ input::placeholder {
562
467
  gap: 10px;
563
468
  }
564
469
 
565
- .swiper-warp {
566
- width: 100%;
567
- height: 100%;
470
+ .like-button {
471
+ display: flex;
472
+ flex-direction: column;
473
+ align-items: center;
474
+ cursor: pointer;
568
475
  }
569
476
 
570
- .swiper-slide-component {
571
- text-align: center;
477
+ .icon-heart {
478
+ font-size: 24px;
479
+ color: #e74c3c;
572
480
  }
573
481
 
574
- .swiper-slide img {
575
- max-width: 100%;
576
- max-height: 100%;
482
+ .liked {
483
+ color: #f00; /* 更改颜色以示已赞 */
577
484
  }
578
- /**
579
- * Swiper 6.8.4
485
+
486
+ .like-count {
487
+ margin-top: 4px;
488
+ font-size: 16px;
489
+ color: #333;
490
+ }
491
+
492
+ .uni-video-component {
493
+ position: relative;
494
+ text-align: center;
495
+ }
496
+ .play-pause-button {
497
+ position: absolute;
498
+ top: 50%;
499
+ left: 50%;
500
+ transform: translate(-50%, -50%);
501
+ cursor: pointer;
502
+ font-size: 2rem;
503
+ color: #fff;
504
+ background: rgba(0, 0, 0, 0.6);
505
+ border-radius: 50%;
506
+ padding: 10px;
507
+ transition: background 0.3s;
508
+ }
509
+ .play-pause-button:hover {
510
+ background: rgba(0, 0, 0, 0.8);
511
+ }
512
+
513
+ .swiper-warp {
514
+ width: 100%;
515
+ height: 100%;
516
+ }
517
+
518
+ .swiper-slide-component {
519
+ text-align: center;
520
+ }
521
+
522
+ .swiper-slide img {
523
+ max-width: 100%;
524
+ max-height: 100%;
525
+ }
526
+
527
+ .ant-input-number {
528
+ box-sizing: border-box;
529
+ margin: 0;
530
+ padding: 0;
531
+ color: rgba(0, 0, 0, 0.88);
532
+ font-size: 14px;
533
+ line-height: 1.5714285714285714;
534
+ list-style: none;
535
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
536
+ position: relative;
537
+ display: inline-block;
538
+ width: 100%;
539
+ min-width: 0;
540
+ background-color: #ffffff;
541
+ background-image: none;
542
+ border-width: 1px;
543
+ border-style: solid;
544
+ border-color: #d9d9d9;
545
+ border-radius: 6px;
546
+ transition: all 0.2s;
547
+ border: 1px solid #d9d9d9;
548
+ }
549
+ .ant-form-item {
550
+ box-sizing: border-box;
551
+ margin: 0;
552
+ padding: 0;
553
+ color: rgba(0, 0, 0, 0.88);
554
+ font-size: 14px;
555
+ line-height: 1.5714285714285714;
556
+ list-style: none;
557
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
558
+ margin-bottom: 0px;
559
+ vertical-align: top;
560
+ }
561
+ /**
562
+ * Swiper 6.8.4
580
563
  * Most modern mobile touch slider and framework with hardware accelerated transitions
581
564
  * https://swiperjs.com
582
565
  *
@@ -1123,193 +1106,6 @@ button.swiper-pagination-bullet {
1123
1106
  backface-visibility: hidden;
1124
1107
  }
1125
1108
 
1126
-
1127
- .no-animation__card {
1128
- font-weight: 500;
1129
- font-size: var(--countdown-size, 2rem);
1130
- line-height: 1.5;
1131
- display: block;
1132
- color: var(--main-color, #EC685C);
1133
- }
1134
-
1135
- .flip-clock {
1136
- text-align: center;
1137
- perspective: 600px;
1138
- margin: 0 auto;
1139
- }
1140
-
1141
- .flip-clock *,
1142
- .flip-clock *:before,
1143
- .flip-clock *:after {
1144
- box-sizing: border-box;
1145
- }
1146
-
1147
- .flip-clock__piece {
1148
- display: inline-block;
1149
- margin: 0 0.2vw;
1150
- }
1151
-
1152
- @media (min-width: 1000px) {
1153
- .flip-clock__piece {
1154
- margin: 0 5px;
1155
- }
1156
- }
1157
-
1158
- .flip-clock__slot {
1159
- font-size: var(--label-size, 1rem);
1160
- line-height: 1.5;
1161
- display: block;
1162
- color: var(--label-color, #222222);
1163
- }
1164
-
1165
- .flip-card {
1166
- display: block;
1167
- position: relative;
1168
- padding-bottom: 0.72em; /* halfHeight */
1169
- font-size: var(--countdown-size, 2.25rem);
1170
- line-height: 0.95;
1171
- }
1172
-
1173
- @media (min-width: 1000px) {
1174
- .flip-clock__slot {
1175
- font-size: 1.2rem;
1176
- }
1177
-
1178
- .flip-card {
1179
- font-size: 3rem;
1180
- }
1181
- }
1182
-
1183
- .flip-card__top,
1184
- .flip-card__bottom,
1185
- .flip-card__back-bottom,
1186
- .flip-card__back::before,
1187
- .flip-card__back::after{
1188
- display: block;
1189
- height: 0.72em; /* halfHeight */
1190
- color: var(--main-color, #EC685C);
1191
- background: var(--main-flip-background-color, #222222);
1192
- padding: 0.23em 0.15em 0.4em;
1193
- border-radius: 0.15em 0.15em 0 0; /* borderRadius */
1194
- backface-visibility: hidden;
1195
- -webkit-backface-visibility: hidden;
1196
- transform-style: preserve-3d;
1197
- width: 2.1em;
1198
- }
1199
-
1200
- .flip-card__top-4digits,
1201
- .flip-card__bottom-4digits,
1202
- .flip-card__back-bottom-4digits,
1203
- .flip-card__back-4digits::before,
1204
- .flip-card__back-4digits::after {
1205
- display: block;
1206
- height: 0.72em; /* halfHeight */
1207
- color: var(--main-color, #EC685C);
1208
- background: var(--main-flip-background-color, #222222);
1209
- padding: 0.23em 0.15em 0.4em;
1210
- border-radius: 0.15em 0.15em 0 0; /* borderRadius */
1211
- backface-visibility: hidden;
1212
- -webkit-backface-visibility: hidden;
1213
- transform-style: preserve-3d;
1214
- width: 2.65em;
1215
- }
1216
-
1217
- .flip-card__bottom,
1218
- .flip-card__back-bottom,
1219
- .flip-card__bottom-4digits,
1220
- .flip-card__back-bottom-4digits {
1221
- color: var(--second-flip-color, #EC685C);
1222
- position: absolute;
1223
- top: 50%;
1224
- left: 0;
1225
- border-top: solid 1px var(--second-flip-background-color, #000);
1226
- background: var(--second-flip-background-color, #393939);
1227
- border-radius: 0 0 0.15em 0.15em; /* borderRadius */
1228
- pointer-events: none;
1229
- overflow: hidden;
1230
- z-index: 2;
1231
- }
1232
-
1233
- .flip-card__back-bottom,
1234
- .flip-card__back-bottom-4digits {
1235
- z-index: 1;
1236
- }
1237
-
1238
- .flip-card__bottom::after,
1239
- .flip-card__back-bottom::after,
1240
- .flip-card__bottom-4digits::after,
1241
- .flip-card__back-bottom-4digits::after {
1242
- display: block;
1243
- margin-top: -0.72em; /* Negative halfHeight */
1244
- }
1245
- .flip-card__back::before,
1246
- .flip-card__bottom::after,
1247
- .flip-card__back-bottom::after,
1248
- .flip-card__back-4digits::before,
1249
- .flip-card__bottom-4digits::after,
1250
- .flip-card__back-bottom-4digits::after {
1251
- content: attr(data-value);
1252
- }
1253
-
1254
- .flip-card__back,
1255
- .flip-card__back-4digits {
1256
- position: absolute;
1257
- top: 0;
1258
- height: 100%;
1259
- left: 0%;
1260
- pointer-events: none;
1261
- }
1262
- .flip-card__back::before,
1263
- .flip-card__back-4digits::before {
1264
- position: relative;
1265
- overflow: hidden;
1266
- z-index: -1;
1267
- }
1268
-
1269
- .flip .flip-card__back::before,
1270
- .flip .flip-card__back-4digits::before {
1271
- z-index: 1;
1272
- animation: flipTop 0.3s cubic-bezier(0.37, 0.01, 0.94, 0.35);
1273
- animation-fill-mode: both;
1274
- transform-origin: center bottom;
1275
- }
1276
-
1277
- .flip .flip-card__bottom,
1278
- .flip .flip-card__bottom-4digits {
1279
- transform-origin: center top;
1280
- animation-fill-mode: both;
1281
- animation: flipBottom 0.6s cubic-bezier(0.15, 0.45, 0.28, 1);
1282
- }
1283
- @keyframes flipTop {
1284
- 0% {
1285
- transform: rotateX(0deg);
1286
- z-index: 2;
1287
- }
1288
- 0%, 99% {
1289
- opacity: 1;
1290
- }
1291
- 100% {
1292
- transform: rotateX(-90deg);
1293
- opacity: 0;
1294
- }
1295
- }
1296
-
1297
- @keyframes flipBottom {
1298
- 0%, 50% {
1299
- z-index: -1;
1300
- transform: rotateX(90deg);
1301
- opacity: 0;
1302
- }
1303
- 51% {
1304
- opacity: 1;
1305
- }
1306
- 100% {
1307
- opacity: 1;
1308
- transform: rotateX(0deg);
1309
- z-index: 5;
1310
- }
1311
- }
1312
-
1313
1109
  .unika-calendar-title {
1314
1110
  font-size: 25px;
1315
1111
  padding-bottom: 4px;
@@ -1576,4 +1372,190 @@ button.swiper-pagination-bullet {
1576
1372
  background-color: #ccc;
1577
1373
  margin: 1px 0;
1578
1374
  }
1579
-
1375
+
1376
+
1377
+ .no-animation__card {
1378
+ font-weight: 500;
1379
+ font-size: var(--countdown-size, 2rem);
1380
+ line-height: 1.5;
1381
+ display: block;
1382
+ color: var(--main-color, #EC685C);
1383
+ }
1384
+
1385
+ .flip-clock {
1386
+ text-align: center;
1387
+ perspective: 600px;
1388
+ margin: 0 auto;
1389
+ }
1390
+
1391
+ .flip-clock *,
1392
+ .flip-clock *:before,
1393
+ .flip-clock *:after {
1394
+ box-sizing: border-box;
1395
+ }
1396
+
1397
+ .flip-clock__piece {
1398
+ display: inline-block;
1399
+ margin: 0 0.2vw;
1400
+ }
1401
+
1402
+ @media (min-width: 1000px) {
1403
+ .flip-clock__piece {
1404
+ margin: 0 5px;
1405
+ }
1406
+ }
1407
+
1408
+ .flip-clock__slot {
1409
+ font-size: var(--label-size, 1rem);
1410
+ line-height: 1.5;
1411
+ display: block;
1412
+ color: var(--label-color, #222222);
1413
+ }
1414
+
1415
+ .flip-card {
1416
+ display: block;
1417
+ position: relative;
1418
+ padding-bottom: 0.72em; /* halfHeight */
1419
+ font-size: var(--countdown-size, 2.25rem);
1420
+ line-height: 0.95;
1421
+ }
1422
+
1423
+ @media (min-width: 1000px) {
1424
+ .flip-clock__slot {
1425
+ font-size: 1.2rem;
1426
+ }
1427
+
1428
+ .flip-card {
1429
+ font-size: 3rem;
1430
+ }
1431
+ }
1432
+
1433
+ .flip-card__top,
1434
+ .flip-card__bottom,
1435
+ .flip-card__back-bottom,
1436
+ .flip-card__back::before,
1437
+ .flip-card__back::after{
1438
+ display: block;
1439
+ height: 0.72em; /* halfHeight */
1440
+ color: var(--main-color, #EC685C);
1441
+ background: var(--main-flip-background-color, #222222);
1442
+ padding: 0.23em 0.15em 0.4em;
1443
+ border-radius: 0.15em 0.15em 0 0; /* borderRadius */
1444
+ backface-visibility: hidden;
1445
+ -webkit-backface-visibility: hidden;
1446
+ transform-style: preserve-3d;
1447
+ width: 2.1em;
1448
+ }
1449
+
1450
+ .flip-card__top-4digits,
1451
+ .flip-card__bottom-4digits,
1452
+ .flip-card__back-bottom-4digits,
1453
+ .flip-card__back-4digits::before,
1454
+ .flip-card__back-4digits::after {
1455
+ display: block;
1456
+ height: 0.72em; /* halfHeight */
1457
+ color: var(--main-color, #EC685C);
1458
+ background: var(--main-flip-background-color, #222222);
1459
+ padding: 0.23em 0.15em 0.4em;
1460
+ border-radius: 0.15em 0.15em 0 0; /* borderRadius */
1461
+ backface-visibility: hidden;
1462
+ -webkit-backface-visibility: hidden;
1463
+ transform-style: preserve-3d;
1464
+ width: 2.65em;
1465
+ }
1466
+
1467
+ .flip-card__bottom,
1468
+ .flip-card__back-bottom,
1469
+ .flip-card__bottom-4digits,
1470
+ .flip-card__back-bottom-4digits {
1471
+ color: var(--second-flip-color, #EC685C);
1472
+ position: absolute;
1473
+ top: 50%;
1474
+ left: 0;
1475
+ border-top: solid 1px var(--second-flip-background-color, #000);
1476
+ background: var(--second-flip-background-color, #393939);
1477
+ border-radius: 0 0 0.15em 0.15em; /* borderRadius */
1478
+ pointer-events: none;
1479
+ overflow: hidden;
1480
+ z-index: 2;
1481
+ }
1482
+
1483
+ .flip-card__back-bottom,
1484
+ .flip-card__back-bottom-4digits {
1485
+ z-index: 1;
1486
+ }
1487
+
1488
+ .flip-card__bottom::after,
1489
+ .flip-card__back-bottom::after,
1490
+ .flip-card__bottom-4digits::after,
1491
+ .flip-card__back-bottom-4digits::after {
1492
+ display: block;
1493
+ margin-top: -0.72em; /* Negative halfHeight */
1494
+ }
1495
+ .flip-card__back::before,
1496
+ .flip-card__bottom::after,
1497
+ .flip-card__back-bottom::after,
1498
+ .flip-card__back-4digits::before,
1499
+ .flip-card__bottom-4digits::after,
1500
+ .flip-card__back-bottom-4digits::after {
1501
+ content: attr(data-value);
1502
+ }
1503
+
1504
+ .flip-card__back,
1505
+ .flip-card__back-4digits {
1506
+ position: absolute;
1507
+ top: 0;
1508
+ height: 100%;
1509
+ left: 0%;
1510
+ pointer-events: none;
1511
+ }
1512
+ .flip-card__back::before,
1513
+ .flip-card__back-4digits::before {
1514
+ position: relative;
1515
+ overflow: hidden;
1516
+ z-index: -1;
1517
+ }
1518
+
1519
+ .flip .flip-card__back::before,
1520
+ .flip .flip-card__back-4digits::before {
1521
+ z-index: 1;
1522
+ animation: flipTop 0.3s cubic-bezier(0.37, 0.01, 0.94, 0.35);
1523
+ animation-fill-mode: both;
1524
+ transform-origin: center bottom;
1525
+ }
1526
+
1527
+ .flip .flip-card__bottom,
1528
+ .flip .flip-card__bottom-4digits {
1529
+ transform-origin: center top;
1530
+ animation-fill-mode: both;
1531
+ animation: flipBottom 0.6s cubic-bezier(0.15, 0.45, 0.28, 1);
1532
+ }
1533
+ @keyframes flipTop {
1534
+ 0% {
1535
+ transform: rotateX(0deg);
1536
+ z-index: 2;
1537
+ }
1538
+ 0%, 99% {
1539
+ opacity: 1;
1540
+ }
1541
+ 100% {
1542
+ transform: rotateX(-90deg);
1543
+ opacity: 0;
1544
+ }
1545
+ }
1546
+
1547
+ @keyframes flipBottom {
1548
+ 0%, 50% {
1549
+ z-index: -1;
1550
+ transform: rotateX(90deg);
1551
+ opacity: 0;
1552
+ }
1553
+ 51% {
1554
+ opacity: 1;
1555
+ }
1556
+ 100% {
1557
+ opacity: 1;
1558
+ transform: rotateX(0deg);
1559
+ z-index: 5;
1560
+ }
1561
+ }
@@ -1,4 +1,4 @@
1
- import { computed, defineComponent, openBlock, createBlock, resolveDynamicComponent, withModifiers, normalizeStyle as normalizeStyle$1, withCtx, createTextVNode, toDisplayString, createElementBlock, Fragment, renderList, normalizeProps, guardReactiveProps, h as h$3, ref, onUpdated, watch, nextTick as nextTick$1, onMounted, onBeforeUnmount, onBeforeUpdate, resolveComponent, mergeProps, createCommentVNode, createVNode, normalizeClass, createElementVNode, pushScopeId, popScopeId, renderSlot, toRefs, onBeforeMount, onUnmounted, withDirectives, vShow, isVNode, Comment, Text, reactive, getCurrentInstance, inject, provide, unref, shallowRef, watchEffect, triggerRef, Transition, resolveDirective, cloneVNode, render as render$o, toRef, Teleport, isRef, toRaw, TransitionGroup } from 'vue';
1
+ import { computed, defineComponent, openBlock, createBlock, resolveDynamicComponent, withModifiers, normalizeStyle as normalizeStyle$1, withCtx, createTextVNode, toDisplayString, createElementBlock, Fragment, renderList, normalizeProps, guardReactiveProps, h as h$3, ref, onUpdated, watch, nextTick as nextTick$1, onMounted, onBeforeUnmount, onBeforeUpdate, resolveComponent, createCommentVNode, createVNode, normalizeClass, createElementVNode, pushScopeId, popScopeId, renderSlot, toRefs, onBeforeMount, onUnmounted, withDirectives, vShow, isVNode, Comment, Text, reactive, getCurrentInstance, inject, provide, unref, shallowRef, watchEffect, triggerRef, Transition, resolveDirective, cloneVNode, render as render$o, toRef, Teleport, isRef, toRaw, TransitionGroup, mergeProps } from 'vue';
2
2
  import crypto from 'crypto';
3
3
  import util, { TextEncoder as TextEncoder$1 } from 'util';
4
4
  import stream, { Readable } from 'stream';
@@ -13057,7 +13057,7 @@ var script$i = defineComponent({
13057
13057
  const _hoisted_1$d = { style: {"width":"100%","height":"100%"} };
13058
13058
  const _hoisted_2$6 = ["id"];
13059
13059
  const _hoisted_3$5 = {
13060
- key: 2,
13060
+ key: 0,
13061
13061
  class: "up-arrow"
13062
13062
  };
13063
13063
  const _hoisted_4$4 = /*#__PURE__*/createElementVNode("img", {
@@ -13069,18 +13069,12 @@ const _hoisted_5$4 = [
13069
13069
  ];
13070
13070
 
13071
13071
  function render$j(_ctx, _cache, $props, $setup, $data, $options) {
13072
- const _component_uni_tanmu = resolveComponent("uni-tanmu");
13073
- const _component_uni_music = resolveComponent("uni-music");
13074
13072
  const _component_swiper_slide = resolveComponent("swiper-slide");
13075
13073
  const _component_swiper = resolveComponent("swiper");
13076
13074
 
13077
13075
  return (openBlock(), createElementBlock("div", _hoisted_1$d, [
13078
- (_ctx.work?.tanmu)
13079
- ? (openBlock(), createBlock(_component_uni_tanmu, normalizeProps(mergeProps({ key: 0 }, { publishContentID: _ctx.work.uuid })), null, 16 /* FULL_PROPS */))
13080
- : createCommentVNode("v-if", true),
13081
- (_ctx.work?.music?.musicSrc)
13082
- ? (openBlock(), createBlock(_component_uni_music, normalizeProps(mergeProps({ key: 1 }, { musicSrc: _ctx.work?.music?.musicSrc })), null, 16 /* FULL_PROPS */))
13083
- : createCommentVNode("v-if", true),
13076
+ createCommentVNode(" <uni-tanmu v-if=\"work?.tanmu\" v-bind=\"{ publishContentID: work.uuid }\"/> "),
13077
+ createCommentVNode(" <uni-music v-if=\"work?.music?.musicSrc\" v-bind=\"{ musicSrc: work?.music?.musicSrc }\"/> "),
13084
13078
  createVNode(_component_swiper, {
13085
13079
  class: "swiper-container",
13086
13080
  modules: _ctx.modules,
@@ -13063,7 +13063,7 @@
13063
13063
  const _hoisted_1$d = { style: {"width":"100%","height":"100%"} };
13064
13064
  const _hoisted_2$6 = ["id"];
13065
13065
  const _hoisted_3$5 = {
13066
- key: 2,
13066
+ key: 0,
13067
13067
  class: "up-arrow"
13068
13068
  };
13069
13069
  const _hoisted_4$4 = /*#__PURE__*/vue.createElementVNode("img", {
@@ -13075,18 +13075,12 @@
13075
13075
  ];
13076
13076
 
13077
13077
  function render$j(_ctx, _cache, $props, $setup, $data, $options) {
13078
- const _component_uni_tanmu = vue.resolveComponent("uni-tanmu");
13079
- const _component_uni_music = vue.resolveComponent("uni-music");
13080
13078
  const _component_swiper_slide = vue.resolveComponent("swiper-slide");
13081
13079
  const _component_swiper = vue.resolveComponent("swiper");
13082
13080
 
13083
13081
  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
13084
- (_ctx.work?.tanmu)
13085
- ? (vue.openBlock(), vue.createBlock(_component_uni_tanmu, vue.normalizeProps(vue.mergeProps({ key: 0 }, { publishContentID: _ctx.work.uuid })), null, 16 /* FULL_PROPS */))
13086
- : vue.createCommentVNode("v-if", true),
13087
- (_ctx.work?.music?.musicSrc)
13088
- ? (vue.openBlock(), vue.createBlock(_component_uni_music, vue.normalizeProps(vue.mergeProps({ key: 1 }, { musicSrc: _ctx.work?.music?.musicSrc })), null, 16 /* FULL_PROPS */))
13089
- : vue.createCommentVNode("v-if", true),
13082
+ vue.createCommentVNode(" <uni-tanmu v-if=\"work?.tanmu\" v-bind=\"{ publishContentID: work.uuid }\"/> "),
13083
+ vue.createCommentVNode(" <uni-music v-if=\"work?.music?.musicSrc\" v-bind=\"{ musicSrc: work?.music?.musicSrc }\"/> "),
13090
13084
  vue.createVNode(_component_swiper, {
13091
13085
  class: "swiper-container",
13092
13086
  modules: _ctx.modules,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "unika-components",
3
- "version": "1.0.93",
3
+ "version": "1.0.94",
4
4
  "private": false,
5
5
  "main": "dist/unika-components.umd.js",
6
6
  "module": "dist/unika-components.esm.js",