unika-components 1.0.21 → 1.0.23

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.
@@ -0,0 +1,17 @@
1
+ declare const _default: import("vue").DefineComponent<{
2
+ iframeHtml: {
3
+ type: StringConstructor;
4
+ default: string;
5
+ };
6
+ }, {
7
+ styleProps: import("vue").ComputedRef<Pick<any, string>>;
8
+ handleClick: () => void;
9
+ }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
10
+ iframeHtml: {
11
+ type: StringConstructor;
12
+ default: string;
13
+ };
14
+ }>>, {
15
+ iframeHtml: string;
16
+ }, {}>;
17
+ export default _default;
@@ -0,0 +1,2 @@
1
+ import UniMap from './UniMap.vue';
2
+ export default UniMap;
@@ -274,6 +274,26 @@ export declare const countdownDefaultProps: {
274
274
  top: string;
275
275
  right: string;
276
276
  };
277
+ export declare const mapDefaultProps: {
278
+ actionType: string;
279
+ url: string;
280
+ height: string;
281
+ width: string;
282
+ paddingLeft: string;
283
+ paddingRight: string;
284
+ paddingTop: string;
285
+ paddingBottom: string;
286
+ borderStyle: string;
287
+ borderColor: string;
288
+ borderWidth: string;
289
+ borderRadius: string;
290
+ boxShadow: string;
291
+ opacity: number;
292
+ position: string;
293
+ left: string;
294
+ top: string;
295
+ right: string;
296
+ };
277
297
  export declare const componentsDefaultProps: {
278
298
  'uni-text': {
279
299
  props: {
@@ -459,6 +479,28 @@ export declare const componentsDefaultProps: {
459
479
  right: string;
460
480
  };
461
481
  };
482
+ 'uni-map': {
483
+ props: {
484
+ actionType: string;
485
+ url: string;
486
+ height: string;
487
+ width: string;
488
+ paddingLeft: string;
489
+ paddingRight: string;
490
+ paddingTop: string;
491
+ paddingBottom: string;
492
+ borderStyle: string;
493
+ borderColor: string;
494
+ borderWidth: string;
495
+ borderRadius: string;
496
+ boxShadow: string;
497
+ opacity: number;
498
+ position: string;
499
+ left: string;
500
+ top: string;
501
+ right: string;
502
+ };
503
+ };
462
504
  };
463
505
  export declare const isEditingProp: {
464
506
  isEditing: {
@@ -9,8 +9,9 @@ import UniMusic from './components/UniMusic';
9
9
  import UniVideo from './components/UniVideo';
10
10
  import UniCalendar from './components/UniCalendar';
11
11
  import UniCountdown from './components/UniCountdown';
12
+ import UniMap from './components/UniMap';
12
13
  declare const install: (app: App) => void;
13
- export { UniText, UniImage, UniShape, LongPage, SwiperPage, UniBackground, UniMusic, UniVideo, UniCalendar, UniCountdown, install };
14
+ export { UniText, UniImage, UniShape, LongPage, SwiperPage, UniBackground, UniMusic, UniVideo, UniCalendar, UniCountdown, UniMap, install };
14
15
  declare const _default: {
15
16
  install: (app: App<any>) => void;
16
17
  };
@@ -1,81 +1,77 @@
1
1
 
2
- .slide-guide {
3
- position: absolute;
4
- bottom: 90px;
5
- left: 50%;
6
- transform: translateX(-50%);
7
- }
8
- .slide-guide img {
9
- animation: flowing 2s ease-in-out infinite;
10
- width: 33px;
11
- vertical-align: middle;
12
- border-style: none;
13
- }
14
- body, html {
15
- position: relative;
16
- width: 100%;
17
- height: 100%;
18
- margin: 0px;
19
- }
20
- .swiper-container {
21
- width: 100%;
22
- height: 100%;
23
- }
24
- .swiper-slide {
25
- width: 100%;
26
- height: 100%;
27
- overflow: hidden;
28
- background-size: cover;
29
- background-position: center;
30
- background-repeat: no-repeat;
31
- }
32
- .up-arrow {
33
- width: 2rem;
34
- height: 2rem;
35
- position: fixed;
36
- bottom: 2rem;
37
- left: 50%;
38
- transform: translate3d(-50%, 0, 0);
39
- z-index: 999;
40
- background: none;
41
- border: none;
42
- padding: 0;
43
- animation: upArrowAni 2s infinite linear;
2
+ h2.uni-text-component, p.uni-text-component {
3
+ margin-bottom: 0;
44
4
  }
45
- .up-arrow img {
46
- width: 2rem;
47
- height: 2rem;
48
- text-align: center;
49
- line-height: 2rem;
50
- color: #fff;
51
- font-size: 1.5rem;
5
+ button.uni-text-component {
6
+ padding: 5px 10px;
7
+ cursor: pointer;
52
8
  }
53
- @keyframes upArrowAni {
54
- 0% {
55
- opacity: 0;
56
- transform: translate3d(-50%, 30%, 0);
57
- }
58
-
59
- 30% {
60
- opacity: 1;
61
- transform: translate3d(-50%, -20%, 0);
62
- }
63
-
64
- 60% {
65
- opacity: 0;
66
- transform: translate3d(-50%, -35%, 0);
67
- }
68
-
69
- 100% {
70
- opacity: 0;
71
- transform: translate3d(-50%, -50%, 0);
72
- }
9
+ .uni-text-component {
10
+ box-sizing: border-box;
11
+ white-space: pre-wrap;
73
12
  }
74
13
 
75
14
  .uni-image-component {
76
15
  max-width: 100%;
77
16
  }
78
17
 
18
+ .uni-background-component {
19
+ width: 100%;
20
+ }
21
+ .bg-img {
22
+ width: 100%;
23
+ height: 100%;
24
+ object-fit: cover;
25
+ z-index:1;
26
+ }
27
+ .watermark {
28
+ height: 100%;
29
+ position: absolute;
30
+ top: 0;
31
+ left: 0;
32
+ right: 0;
33
+ bottom: 0;
34
+ }
35
+ .watermark-div {
36
+ height: 100%;
37
+ width:100%;
38
+ position:absolute;
39
+ z-index:99999999;
40
+ }
41
+ body:before{
42
+ content: '';
43
+ position: fixed;
44
+ top: 0;
45
+ bottom: 0;
46
+ left: 0;
47
+ right: 0;
48
+ z-index: -1;
49
+ /* background: url(https://unika-static-dev.unika.cc/logo.png) 0 0 repeat; */
50
+ background-position: center;
51
+ opacity: 0.1;
52
+ }
53
+
54
+ .uni-video-component {
55
+ position: relative;
56
+ text-align: center;
57
+ }
58
+ .play-pause-button {
59
+ position: absolute;
60
+ top: 50%;
61
+ left: 50%;
62
+ transform: translate(-50%, -50%);
63
+ cursor: pointer;
64
+ font-size: 2rem;
65
+ color: #fff;
66
+ background: rgba(0, 0, 0, 0.6);
67
+ border-radius: 50%;
68
+ padding: 10px;
69
+ transition: background 0.3s;
70
+ }
71
+ .play-pause-button:hover {
72
+ background: rgba(0, 0, 0, 0.8);
73
+ }
74
+
79
75
  #audio {
80
76
  position: absolute;
81
77
  right: 10px;
@@ -171,53 +167,78 @@ body, html {
171
167
  }
172
168
  }
173
169
 
174
- h2.uni-text-component, p.uni-text-component {
175
- margin-bottom: 0;
170
+ .slide-guide {
171
+ position: absolute;
172
+ bottom: 90px;
173
+ left: 50%;
174
+ transform: translateX(-50%);
176
175
  }
177
- button.uni-text-component {
178
- padding: 5px 10px;
179
- cursor: pointer;
176
+ .slide-guide img {
177
+ animation: flowing 2s ease-in-out infinite;
178
+ width: 33px;
179
+ vertical-align: middle;
180
+ border-style: none;
180
181
  }
181
- .uni-text-component {
182
- box-sizing: border-box;
183
- white-space: pre-wrap;
182
+ body, html {
183
+ position: relative;
184
+ width: 100%;
185
+ height: 100%;
186
+ margin: 0px;
187
+ }
188
+ .swiper-container {
189
+ width: 100%;
190
+ height: 100%;
191
+ }
192
+ .swiper-slide {
193
+ width: 100%;
194
+ height: 100%;
195
+ overflow: hidden;
196
+ background-size: cover;
197
+ background-position: center;
198
+ background-repeat: no-repeat;
199
+ }
200
+ .up-arrow {
201
+ width: 2rem;
202
+ height: 2rem;
203
+ position: fixed;
204
+ bottom: 2rem;
205
+ left: 50%;
206
+ transform: translate3d(-50%, 0, 0);
207
+ z-index: 999;
208
+ background: none;
209
+ border: none;
210
+ padding: 0;
211
+ animation: upArrowAni 2s infinite linear;
212
+ }
213
+ .up-arrow img {
214
+ width: 2rem;
215
+ height: 2rem;
216
+ text-align: center;
217
+ line-height: 2rem;
218
+ color: #fff;
219
+ font-size: 1.5rem;
220
+ }
221
+ @keyframes upArrowAni {
222
+ 0% {
223
+ opacity: 0;
224
+ transform: translate3d(-50%, 30%, 0);
225
+ }
226
+
227
+ 30% {
228
+ opacity: 1;
229
+ transform: translate3d(-50%, -20%, 0);
230
+ }
231
+
232
+ 60% {
233
+ opacity: 0;
234
+ transform: translate3d(-50%, -35%, 0);
235
+ }
236
+
237
+ 100% {
238
+ opacity: 0;
239
+ transform: translate3d(-50%, -50%, 0);
240
+ }
184
241
  }
185
-
186
- .uni-background-component {
187
- width: 100%;
188
- }
189
- .bg-img {
190
- width: 100%;
191
- height: 100%;
192
- object-fit: cover;
193
- z-index:1;
194
- }
195
- .watermark {
196
- height: 100%;
197
- position: absolute;
198
- top: 0;
199
- left: 0;
200
- right: 0;
201
- bottom: 0;
202
- }
203
- .watermark-div {
204
- height: 100%;
205
- width:100%;
206
- position:absolute;
207
- z-index:99999999;
208
- }
209
- body:before{
210
- content: '';
211
- position: fixed;
212
- top: 0;
213
- bottom: 0;
214
- left: 0;
215
- right: 0;
216
- z-index: -1;
217
- /* background: url(https://unika-static-dev.unika.cc/logo.png) 0 0 repeat; */
218
- background-position: center;
219
- opacity: 0.1;
220
- }
221
242
 
222
243
  .slot-number {
223
244
  position: absolute;
@@ -226,27 +247,6 @@ button.uni-text-component {
226
247
  font-size: 12px;
227
248
  color: #666
228
249
  }
229
-
230
- .uni-video-component {
231
- position: relative;
232
- text-align: center;
233
- }
234
- .play-pause-button {
235
- position: absolute;
236
- top: 50%;
237
- left: 50%;
238
- transform: translate(-50%, -50%);
239
- cursor: pointer;
240
- font-size: 2rem;
241
- color: #fff;
242
- background: rgba(0, 0, 0, 0.6);
243
- border-radius: 50%;
244
- padding: 10px;
245
- transition: background 0.3s;
246
- }
247
- .play-pause-button:hover {
248
- background: rgba(0, 0, 0, 0.8);
249
- }
250
250
  /**
251
251
  * Swiper 6.8.4
252
252
  * Most modern mobile touch slider and framework with hardware accelerated transitions
@@ -885,60 +885,59 @@ button.swiper-pagination-bullet {
885
885
  }
886
886
 
887
887
  .no-animation__card {
888
- font-weight: 500;
889
- font-size: 2rem;
890
- line-height: 1.5;
891
- display: block;
892
- color: v-bind(mainColor);
888
+ font-weight: 500;
889
+ font-size: 2rem;
890
+ line-height: 1.5;
891
+ display: block;
892
+ color: var(--main-color);
893
893
  }
894
894
 
895
895
  .flip-clock {
896
- text-align: center;
897
- perspective: 600px;
898
- margin: 0 auto;
896
+ text-align: center;
897
+ perspective: 600px;
898
+ margin: 0 auto;
899
+ }
899
900
 
900
- *,
901
- *:before,
902
- *:after {
903
- box-sizing: border-box;
904
- }
901
+ .flip-clock *,
902
+ .flip-clock *:before,
903
+ .flip-clock *:after {
904
+ box-sizing: border-box;
905
905
  }
906
906
 
907
907
  .flip-clock__piece {
908
- display: inline-block;
909
- margin: 0 0.2vw;
908
+ display: inline-block;
909
+ margin: 0 0.2vw;
910
+ }
910
911
 
911
- @media (min-width: 1000px) {
912
- margin: 0 5px;
913
- }
912
+ @media (min-width: 1000px) {
913
+ .flip-clock__piece {
914
+ margin: 0 5px;
915
+ }
914
916
  }
915
917
 
916
918
  .flip-clock__slot {
917
- font-size: 1rem;
918
- line-height: 1.5;
919
- display: block;
920
- color: v-bind(labelColor);
919
+ font-size: 1rem;
920
+ line-height: 1.5;
921
+ display: block;
922
+ color: var(--label-color);
921
923
  }
922
924
 
923
- @halfHeight: 0.72em;
924
- @borderRadius: 0.15em;
925
-
926
925
  .flip-card {
927
- display: block;
928
- position: relative;
929
- padding-bottom: @halfHeight;
930
- font-size: 2.25rem;
931
- line-height: 0.95;
926
+ display: block;
927
+ position: relative;
928
+ padding-bottom: 0.72em;
929
+ font-size: 2.25rem;
930
+ line-height: 0.95;
932
931
  }
933
932
 
934
933
  @media (min-width: 1000px) {
935
- .flip-clock__slot {
936
- font-size: 1.2rem;
937
- }
934
+ .flip-clock__slot {
935
+ font-size: 1.2rem;
936
+ }
938
937
 
939
- .flip-card {
940
- font-size: 2rem;
941
- }
938
+ .flip-card {
939
+ font-size: 2rem;
940
+ }
942
941
  }
943
942
 
944
943
  .flip-card__top,
@@ -946,73 +945,17 @@ button.swiper-pagination-bullet {
946
945
  .flip-card__back-bottom,
947
946
  .flip-card__back::before,
948
947
  .flip-card__back::after {
949
- display: block;
950
- height: @halfHeight;
951
- color: v-bind(mainColor);
952
- background: v-bind(mainFlipBackgroundColor);
953
- padding: 0.23em 0.15em 0.4em;
954
- border-radius: @borderRadius @borderRadius 0 0;
955
- backface-visibility: hidden;
956
- -webkit-backface-visibility: hidden;
957
- transform-style: preserve-3d;
958
- width: 2.1em;
959
- height: @halfHeight;
960
- }
961
-
962
- .flip-card__top-4digits,
963
- .flip-card__bottom-4digits,
964
- .flip-card__back-bottom-4digits,
965
- .flip-card__back-4digits::before,
966
- .flip-card__back-4digits::after {
967
- display: block;
968
- height: @halfHeight;
969
- color: v-bind(mainColor);
970
- background: v-bind(mainFlipBackgroundColor);
971
- padding: 0.23em 0.15em 0.4em;
972
- border-radius: @borderRadius @borderRadius 0 0;
973
- backface-visibility: hidden;
974
- -webkit-backface-visibility: hidden;
975
- transform-style: preserve-3d;
976
- width: 2.65em;
977
- height: @halfHeight;
978
- }
979
-
980
- .flip-card__bottom,
981
- .flip-card__back-bottom,
982
- .flip-card__bottom-4digits,
983
- .flip-card__back-bottom-4digits {
984
- color: v-bind(secondFlipColor);
985
- position: absolute;
986
- top: 50%;
987
- left: 0;
988
- border-top: solid 1px #000;
989
- background: v-bind(secondFlipBackgroundColor);
990
- border-radius: 0 0 @borderRadius @borderRadius;
991
- pointer-events: none;
992
- overflow: hidden;
993
- z-index: 2;
994
- }
995
-
996
- .flip-card__back-bottom,
997
- .flip-card__back-bottom-4digits {
998
- z-index: 1;
999
- }
1000
-
1001
- .flip-card__bottom::after,
1002
- .flip-card__back-bottom::after,
1003
- .flip-card__bottom-4digits::after,
1004
- .flip-card__back-bottom-4digits::after {
1005
- display: block;
1006
- margin-top: -@halfHeight;
1007
- }
1008
-
1009
- .flip-card__back::before,
1010
- .flip-card__bottom::after,
1011
- .flip-card__back-bottom::after,
1012
- .flip-card__back-4digits::before,
1013
- .flip-card__bottom-4digits::after,
1014
- .flip-card__back-bottom-4digits::after {
1015
- content: attr(data-value);
948
+ display: block;
949
+ height: 0.72em;
950
+ color: var(--main-color);
951
+ background: var(--main-flip-background-color);
952
+ padding: 0.23em 0.15em 0.4em;
953
+ border-radius: 0.15em 0.15em 0 0;
954
+ backface-visibility: hidden;
955
+ -webkit-backface-visibility: hidden;
956
+ transform-style: preserve-3d;
957
+ width: 2.1em;
958
+ height: 0.72em;
1016
959
  }
1017
960
 
1018
961
  .flip-card__back,
@@ -1051,12 +994,9 @@ button.swiper-pagination-bullet {
1051
994
  transform: rotateX(0deg);
1052
995
  z-index: 2;
1053
996
  }
1054
-
1055
- 0%,
1056
- 99% {
997
+ 0%, 99% {
1057
998
  opacity: 1;
1058
999
  }
1059
-
1060
1000
  100% {
1061
1001
  transform: rotateX(-90deg);
1062
1002
  opacity: 0;
@@ -1064,18 +1004,14 @@ button.swiper-pagination-bullet {
1064
1004
  }
1065
1005
 
1066
1006
  @keyframes flipBottom {
1067
-
1068
- 0%,
1069
- 50% {
1007
+ 0%, 50% {
1070
1008
  z-index: -1;
1071
1009
  transform: rotateX(90deg);
1072
1010
  opacity: 0;
1073
1011
  }
1074
-
1075
1012
  51% {
1076
1013
  opacity: 1;
1077
1014
  }
1078
-
1079
1015
  100% {
1080
1016
  opacity: 1;
1081
1017
  transform: rotateX(0deg);