@fox-js/fox 2.1.0 → 3.0.2
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.
- package/libs/index.css +144 -1
- package/libs/index.d.ts +1725 -0
- package/libs/index.js +1 -1
- package/main.js +1 -4
- package/package.json +8 -4
package/libs/index.css
CHANGED
|
@@ -1 +1,144 @@
|
|
|
1
|
-
|
|
1
|
+
@charset "UTF-8";
|
|
2
|
+
/* eslint-disable */
|
|
3
|
+
/*views window*/
|
|
4
|
+
.fox-views {
|
|
5
|
+
/*卡片容器class*/
|
|
6
|
+
}
|
|
7
|
+
.fox-views.fox-views-window {
|
|
8
|
+
display: block;
|
|
9
|
+
/*view class*/
|
|
10
|
+
}
|
|
11
|
+
.fox-views.fox-views-window .fox-view {
|
|
12
|
+
position: fixed;
|
|
13
|
+
top: 0px;
|
|
14
|
+
left: 0px;
|
|
15
|
+
width: 100%;
|
|
16
|
+
-webkit-box-sizing: border-box;
|
|
17
|
+
box-sizing: border-box;
|
|
18
|
+
z-index: 100;
|
|
19
|
+
}
|
|
20
|
+
.fox-views.fox-card-views {
|
|
21
|
+
position: relative;
|
|
22
|
+
width: 100%;
|
|
23
|
+
height: 100%;
|
|
24
|
+
box-sizing: border-box;
|
|
25
|
+
/*卡片页class*/
|
|
26
|
+
/*卡片页激活class*/
|
|
27
|
+
/*卡片页失活class*/
|
|
28
|
+
}
|
|
29
|
+
.fox-views.fox-card-views .fox-card-view {
|
|
30
|
+
width: 100%;
|
|
31
|
+
height: 100%;
|
|
32
|
+
}
|
|
33
|
+
.fox-views.fox-card-views .fox-card-view-active {
|
|
34
|
+
z-index: 1;
|
|
35
|
+
}
|
|
36
|
+
.fox-views.fox-card-views .fox-card-view-deactive {
|
|
37
|
+
display: none;
|
|
38
|
+
z-index: 0;
|
|
39
|
+
}
|
|
40
|
+
.fox-views .fox-view-trans-enter-to {
|
|
41
|
+
animation: fox-view-in-slide-right 330ms;
|
|
42
|
+
-webkit-animation: fox-view-in-slide-right 330ms;
|
|
43
|
+
z-index: 120;
|
|
44
|
+
}
|
|
45
|
+
.fox-views .fox-view-trans-leave-to {
|
|
46
|
+
animation: fox-view-out-slide-right 320ms;
|
|
47
|
+
-webkit-animation: fox-view-out-slide-right 320ms;
|
|
48
|
+
z-index: 120;
|
|
49
|
+
}
|
|
50
|
+
.fox-views .fox-view-trans-show-to {
|
|
51
|
+
animation: fox-view-show-slide-right 300ms;
|
|
52
|
+
-webkit-animation: fox-view-show-slide-right 300ms;
|
|
53
|
+
z-index: 110;
|
|
54
|
+
}
|
|
55
|
+
.fox-views .fox-view-trans-hide-to {
|
|
56
|
+
animation: fox-view-hide-slide-left 320ms;
|
|
57
|
+
-webkit-animation: fox-view-hide-slide-left 320ms;
|
|
58
|
+
z-index: 110;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
/* 进场动画 */
|
|
62
|
+
@-webkit-keyframes fox-view-in-slide-right {
|
|
63
|
+
0% {
|
|
64
|
+
-webkit-transform: translateX(103%);
|
|
65
|
+
transform: translateX(103%);
|
|
66
|
+
}
|
|
67
|
+
100% {
|
|
68
|
+
-webkit-transform: translateX(0%);
|
|
69
|
+
transform: translateX(0%);
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
@keyframes fox-view-in-slide-right {
|
|
73
|
+
0% {
|
|
74
|
+
-webkit-transform: translateX(103%);
|
|
75
|
+
transform: translateX(103%);
|
|
76
|
+
}
|
|
77
|
+
100% {
|
|
78
|
+
-webkit-transform: translateX(0%);
|
|
79
|
+
transform: translateX(0%);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
/* 出场动画 */
|
|
83
|
+
@-webkit-keyframes fox-view-out-slide-right {
|
|
84
|
+
0% {
|
|
85
|
+
-webkit-transform: translateX(0%);
|
|
86
|
+
transform: translateX(0%);
|
|
87
|
+
}
|
|
88
|
+
100% {
|
|
89
|
+
-webkit-transform: translateX(103%);
|
|
90
|
+
transform: translateX(103%);
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
@keyframes fox-view-out-slide-right {
|
|
94
|
+
0% {
|
|
95
|
+
-webkit-transform: translateX(0%);
|
|
96
|
+
transform: translateX(0%);
|
|
97
|
+
}
|
|
98
|
+
100% {
|
|
99
|
+
-webkit-transform: translateX(103%);
|
|
100
|
+
transform: translateX(103%);
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
/* 隐藏动画 */
|
|
104
|
+
@-webkit-keyframes fox-view-hide-slide-left {
|
|
105
|
+
0% {
|
|
106
|
+
-webkit-transform: translateX(0%);
|
|
107
|
+
transform: translateX(0%);
|
|
108
|
+
}
|
|
109
|
+
100% {
|
|
110
|
+
-webkit-transform: translateX(-30%);
|
|
111
|
+
transform: translateX(-30%);
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
@keyframes fox-view-hide-slide-left {
|
|
115
|
+
0% {
|
|
116
|
+
-webkit-transform: translateX(0%);
|
|
117
|
+
transform: translateX(0%);
|
|
118
|
+
}
|
|
119
|
+
100% {
|
|
120
|
+
-webkit-transform: translateX(-30%);
|
|
121
|
+
transform: translateX(-30%);
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
/* 显示动画 */
|
|
125
|
+
@-webkit-keyframes fox-view-show-slide-right {
|
|
126
|
+
0% {
|
|
127
|
+
-webkit-transform: translateX(-30%);
|
|
128
|
+
transform: translateX(-30%);
|
|
129
|
+
}
|
|
130
|
+
100% {
|
|
131
|
+
-webkit-transform: translateX(0%);
|
|
132
|
+
transform: translateX(0%);
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
@keyframes fox-view-show-slide-right {
|
|
136
|
+
0% {
|
|
137
|
+
-webkit-transform: translateX(-30%);
|
|
138
|
+
transform: translateX(-30%);
|
|
139
|
+
}
|
|
140
|
+
100% {
|
|
141
|
+
-webkit-transform: translateX(0%);
|
|
142
|
+
transform: translateX(0%);
|
|
143
|
+
}
|
|
144
|
+
}
|