提交 | 用户 | 时间
|
0cceb6
|
1 |
// global transition css |
Y |
2 |
|
|
3 |
/* fade */ |
|
4 |
.fade-enter-active, |
|
5 |
.fade-leave-active { |
|
6 |
transition: opacity 0.28s; |
|
7 |
} |
|
8 |
|
|
9 |
.fade-enter, |
|
10 |
.fade-leave-active { |
|
11 |
opacity: 0; |
|
12 |
} |
|
13 |
|
|
14 |
/* fade-transform */ |
|
15 |
.fade-transform--move, |
|
16 |
.fade-transform-leave-active, |
|
17 |
.fade-transform-enter-active { |
|
18 |
transition: all .5s; |
|
19 |
} |
|
20 |
|
|
21 |
.fade-transform-enter { |
|
22 |
opacity: 0; |
|
23 |
transform: translateX(-30px); |
|
24 |
} |
|
25 |
|
|
26 |
.fade-transform-leave-to { |
|
27 |
opacity: 0; |
|
28 |
transform: translateX(30px); |
|
29 |
} |
|
30 |
|
|
31 |
/* breadcrumb transition */ |
|
32 |
.breadcrumb-enter-active, |
|
33 |
.breadcrumb-leave-active { |
|
34 |
transition: all .5s; |
|
35 |
} |
|
36 |
|
|
37 |
.breadcrumb-enter, |
|
38 |
.breadcrumb-leave-active { |
|
39 |
opacity: 0; |
|
40 |
transform: translateX(20px); |
|
41 |
} |
|
42 |
|
|
43 |
.breadcrumb-move { |
|
44 |
transition: all .5s; |
|
45 |
} |
|
46 |
|
|
47 |
.breadcrumb-leave-active { |
|
48 |
position: absolute; |
|
49 |
} |