sinzmise-cetastories-en 2.0.0-1734691087496 → 2.0.0-1734700979626

Sign up to get free protection for your applications and to get access to all the features.
package/css/kslink.css CHANGED
@@ -1 +1,38 @@
1
- .addBtn{display:flex;justify-content:center;flex-wrap:wrap}.addBtn button{transition:.2s;display:flex;margin:5px auto;color:var(--global-bg);padding:15px;border-radius:40px;background:var(--search-result-title);align-items:center}button{padding:0;outline:0;border:none;background:0 0;cursor:pointer;touch-action:manipulation}.fa-solid,.fas{font-family:"Font Awesome 6 Free";font-weight:900}.addBtn i{font-size:1.3rem;margin-right:10px}.addBtn button:hover{background:var(--theme-color);color:#fff}
1
+ /* 添加友链按钮 */
2
+ /* 快速填写格式 */
3
+ .addBtn {
4
+ display: flex;
5
+ justify-content: center;
6
+ flex-wrap: wrap;
7
+ }
8
+ .addBtn button {
9
+ transition: .2s;
10
+ display: flex;
11
+ margin: 5px auto;
12
+ color: var(--global-bg);
13
+ padding: 15px;
14
+ border-radius: 40px;
15
+ background: var(--search-result-title);
16
+ align-items: center;
17
+ }
18
+
19
+ button {
20
+ padding: 0;
21
+ outline: 0;
22
+ border: none;
23
+ background: 0 0;
24
+ cursor: pointer;
25
+ touch-action: manipulation;
26
+ }
27
+ .fa-solid, .fas {
28
+ font-family: "Font Awesome 6 Free";
29
+ font-weight: 900;
30
+ }
31
+ .addBtn i {
32
+ font-size: 1.3rem;
33
+ margin-right: 10px;
34
+ }
35
+ .addBtn button:hover {
36
+ background: var(--theme-color);
37
+ color: #fff;
38
+ }
@@ -1 +1,39 @@
1
- .pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pace.pace-inactive .pace-progress{display:none}.pace .pace-progress{position:fixed;z-index:2000;top:0;right:0;height:5rem;width:5rem;-webkit-transform:translate3d(0,0,0)!important;-ms-transform:translate3d(0,0,0)!important;transform:translate3d(0,0,0)!important}.pace .pace-progress:after{display:block;position:absolute;top:0;right:.5rem;content:attr(data-progress-text);font-family:"Helvetica Neue",sans-serif;font-weight:100;font-size:5rem;line-height:1;text-align:right;color:rgba(0,0,0,.19999999999999996)}
1
+ .pace {
2
+ -webkit-pointer-events: none;
3
+ pointer-events: none;
4
+
5
+ -webkit-user-select: none;
6
+ -moz-user-select: none;
7
+ user-select: none;
8
+ }
9
+
10
+ .pace.pace-inactive .pace-progress {
11
+ display: none;
12
+ }
13
+
14
+ .pace .pace-progress {
15
+ position: fixed;
16
+ z-index: 2000;
17
+ top: 0;
18
+ right: 0;
19
+ height: 5rem;
20
+ width: 5rem;
21
+
22
+ -webkit-transform: translate3d(0, 0, 0) !important;
23
+ -ms-transform: translate3d(0, 0, 0) !important;
24
+ transform: translate3d(0, 0, 0) !important;
25
+ }
26
+
27
+ .pace .pace-progress:after {
28
+ display: block;
29
+ position: absolute;
30
+ top: 0;
31
+ right: .5rem;
32
+ content: attr(data-progress-text);
33
+ font-family: "Helvetica Neue", sans-serif;
34
+ font-weight: 100;
35
+ font-size: 5rem;
36
+ line-height: 1;
37
+ text-align: right;
38
+ color: rgba(0, 0, 0, 0.19999999999999996);
39
+ }
@@ -1 +1,72 @@
1
- .pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pace .pace-activity{display:block;position:fixed;z-index:2000;top:0;right:0;width:300px;height:300px;background:#29d;-webkit-transition:-webkit-transform .3s;transition:transform .3s;-webkit-transform:translateX(100%) translateY(-100%) rotate(45deg);transform:translateX(100%) translateY(-100%) rotate(45deg);pointer-events:none}.pace.pace-active .pace-activity{-webkit-transform:translateX(50%) translateY(-50%) rotate(45deg);transform:translateX(50%) translateY(-50%) rotate(45deg)}.pace .pace-activity::after,.pace .pace-activity::before{-moz-box-sizing:border-box;box-sizing:border-box;position:absolute;bottom:30px;left:50%;display:block;border:5px solid #fff;border-radius:50%;content:''}.pace .pace-activity::before{margin-left:-40px;width:80px;height:80px;border-right-color:rgba(0,0,0,.2);border-left-color:rgba(0,0,0,.2);-webkit-animation:pace-theme-corner-indicator-spin 3s linear infinite;animation:pace-theme-corner-indicator-spin 3s linear infinite}.pace .pace-activity::after{bottom:50px;margin-left:-20px;width:40px;height:40px;border-top-color:rgba(0,0,0,.2);border-bottom-color:rgba(0,0,0,.2);-webkit-animation:pace-theme-corner-indicator-spin 1s linear infinite;animation:pace-theme-corner-indicator-spin 1s linear infinite}@-webkit-keyframes pace-theme-corner-indicator-spin{0%{-webkit-transform:rotate(0)}100%{-webkit-transform:rotate(359deg)}}@keyframes pace-theme-corner-indicator-spin{0%{transform:rotate(0)}100%{transform:rotate(359deg)}}
1
+ .pace {
2
+ -webkit-pointer-events: none;
3
+ pointer-events: none;
4
+
5
+ -webkit-user-select: none;
6
+ -moz-user-select: none;
7
+ user-select: none;
8
+ }
9
+
10
+ .pace .pace-activity {
11
+ display: block;
12
+ position: fixed;
13
+ z-index: 2000;
14
+ top: 0;
15
+ right: 0;
16
+ width: 300px;
17
+ height: 300px;
18
+ background: #29d;
19
+ -webkit-transition: -webkit-transform 0.3s;
20
+ transition: transform 0.3s;
21
+ -webkit-transform: translateX(100%) translateY(-100%) rotate(45deg);
22
+ transform: translateX(100%) translateY(-100%) rotate(45deg);
23
+ pointer-events: none;
24
+ }
25
+
26
+ .pace.pace-active .pace-activity {
27
+ -webkit-transform: translateX(50%) translateY(-50%) rotate(45deg);
28
+ transform: translateX(50%) translateY(-50%) rotate(45deg);
29
+ }
30
+
31
+ .pace .pace-activity::before,
32
+ .pace .pace-activity::after {
33
+ -moz-box-sizing: border-box;
34
+ box-sizing: border-box;
35
+ position: absolute;
36
+ bottom: 30px;
37
+ left: 50%;
38
+ display: block;
39
+ border: 5px solid #fff;
40
+ border-radius: 50%;
41
+ content: '';
42
+ }
43
+
44
+ .pace .pace-activity::before {
45
+ margin-left: -40px;
46
+ width: 80px;
47
+ height: 80px;
48
+ border-right-color: rgba(0, 0, 0, .2);
49
+ border-left-color: rgba(0, 0, 0, .2);
50
+ -webkit-animation: pace-theme-corner-indicator-spin 3s linear infinite;
51
+ animation: pace-theme-corner-indicator-spin 3s linear infinite;
52
+ }
53
+
54
+ .pace .pace-activity::after {
55
+ bottom: 50px;
56
+ margin-left: -20px;
57
+ width: 40px;
58
+ height: 40px;
59
+ border-top-color: rgba(0, 0, 0, .2);
60
+ border-bottom-color: rgba(0, 0, 0, .2);
61
+ -webkit-animation: pace-theme-corner-indicator-spin 1s linear infinite;
62
+ animation: pace-theme-corner-indicator-spin 1s linear infinite;
63
+ }
64
+
65
+ @-webkit-keyframes pace-theme-corner-indicator-spin {
66
+ 0% { -webkit-transform: rotate(0deg); }
67
+ 100% { -webkit-transform: rotate(359deg); }
68
+ }
69
+ @keyframes pace-theme-corner-indicator-spin {
70
+ 0% { transform: rotate(0deg); }
71
+ 100% { transform: rotate(359deg); }
72
+ }
@@ -1 +1,76 @@
1
- .pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pace-inactive{display:none}.pace .pace-progress{background:#29d;position:fixed;z-index:2000;top:0;right:100%;width:100%;height:2px}.pace .pace-progress-inner{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px #29d,0 0 5px #29d;opacity:1;-webkit-transform:rotate(3deg) translate(0,-4px);-moz-transform:rotate(3deg) translate(0,-4px);-ms-transform:rotate(3deg) translate(0,-4px);-o-transform:rotate(3deg) translate(0,-4px);transform:rotate(3deg) translate(0,-4px)}.pace .pace-activity{display:block;position:fixed;z-index:2000;top:15px;right:15px;width:14px;height:14px;border:solid 2px transparent;border-top-color:#29d;border-left-color:#29d;border-radius:10px;-webkit-animation:pace-spinner .4s linear infinite;-moz-animation:pace-spinner .4s linear infinite;-ms-animation:pace-spinner .4s linear infinite;-o-animation:pace-spinner .4s linear infinite;animation:pace-spinner .4s linear infinite}@-webkit-keyframes pace-spinner{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-moz-keyframes pace-spinner{0%{-moz-transform:rotate(0);transform:rotate(0)}100%{-moz-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes pace-spinner{0%{-o-transform:rotate(0);transform:rotate(0)}100%{-o-transform:rotate(360deg);transform:rotate(360deg)}}@-ms-keyframes pace-spinner{0%{-ms-transform:rotate(0);transform:rotate(0)}100%{-ms-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes pace-spinner{0%{transform:rotate(0);transform:rotate(0)}100%{transform:rotate(360deg);transform:rotate(360deg)}}
1
+ .pace {
2
+ -webkit-pointer-events: none;
3
+ pointer-events: none;
4
+ -webkit-user-select: none;
5
+ -moz-user-select: none;
6
+ user-select: none;
7
+ }
8
+
9
+ .pace-inactive {
10
+ display: none;
11
+ }
12
+
13
+ .pace .pace-progress {
14
+ background: #29d;
15
+ position: fixed;
16
+ z-index: 2000;
17
+ top: 0;
18
+ right: 100%;
19
+ width: 100%;
20
+ height: 2px;
21
+ }
22
+
23
+ .pace .pace-progress-inner {
24
+ display: block;
25
+ position: absolute;
26
+ right: 0px;
27
+ width: 100px;
28
+ height: 100%;
29
+ box-shadow: 0 0 10px #29d, 0 0 5px #29d;
30
+ opacity: 1.0;
31
+ -webkit-transform: rotate(3deg) translate(0px, -4px);
32
+ -moz-transform: rotate(3deg) translate(0px, -4px);
33
+ -ms-transform: rotate(3deg) translate(0px, -4px);
34
+ -o-transform: rotate(3deg) translate(0px, -4px);
35
+ transform: rotate(3deg) translate(0px, -4px);
36
+ }
37
+
38
+ .pace .pace-activity {
39
+ display: block;
40
+ position: fixed;
41
+ z-index: 2000;
42
+ top: 15px;
43
+ right: 15px;
44
+ width: 14px;
45
+ height: 14px;
46
+ border: solid 2px transparent;
47
+ border-top-color: #29d;
48
+ border-left-color: #29d;
49
+ border-radius: 10px;
50
+ -webkit-animation: pace-spinner 400ms linear infinite;
51
+ -moz-animation: pace-spinner 400ms linear infinite;
52
+ -ms-animation: pace-spinner 400ms linear infinite;
53
+ -o-animation: pace-spinner 400ms linear infinite;
54
+ animation: pace-spinner 400ms linear infinite;
55
+ }
56
+
57
+ @-webkit-keyframes pace-spinner {
58
+ 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
59
+ 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
60
+ }
61
+ @-moz-keyframes pace-spinner {
62
+ 0% { -moz-transform: rotate(0deg); transform: rotate(0deg); }
63
+ 100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
64
+ }
65
+ @-o-keyframes pace-spinner {
66
+ 0% { -o-transform: rotate(0deg); transform: rotate(0deg); }
67
+ 100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
68
+ }
69
+ @-ms-keyframes pace-spinner {
70
+ 0% { -ms-transform: rotate(0deg); transform: rotate(0deg); }
71
+ 100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
72
+ }
73
+ @keyframes pace-spinner {
74
+ 0% { transform: rotate(0deg); transform: rotate(0deg); }
75
+ 100% { transform: rotate(360deg); transform: rotate(360deg); }
76
+ }
@@ -1 +1,86 @@
1
- .pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;position:fixed;top:0;left:0;z-index:2000;width:100%;height:12px;background:#fff}.pace-inactive{display:none}.pace .pace-progress{background-color:#0087e1;position:fixed;top:0;right:100%;width:100%;height:12px;overflow:hidden;-webkit-border-radius:0 0 4px 0;-moz-border-radius:0 0 4px 0;-o-border-radius:0 0 4px 0;border-radius:0 0 4px 0;-webkit-box-shadow:inset -1px 0 #00558f,inset 0 -1px #00558f,inset 0 2px rgba(255,255,255,.5),inset 0 6px rgba(255,255,255,.3);-moz-box-shadow:inset -1px 0 #00558f,inset 0 -1px #00558f,inset 0 2px rgba(255,255,255,.5),inset 0 6px rgba(255,255,255,.3);-o-box-shadow:inset -1px 0 #00558f,inset 0 -1px #00558f,inset 0 2px rgba(255,255,255,.5),inset 0 6px rgba(255,255,255,.3);box-shadow:inset -1px 0 #00558f,inset 0 -1px #00558f,inset 0 2px rgba(255,255,255,.5),inset 0 6px rgba(255,255,255,.3)}.pace .pace-activity{position:fixed;top:0;left:0;right:-28px;bottom:0;-webkit-background-image:radial-gradient(rgba(255,255,255,.65) 0,rgba(255,255,255,.15) 100%);-moz-background-image:radial-gradient(rgba(255,255,255,.65) 0,rgba(255,255,255,.15) 100%);-o-background-image:radial-gradient(rgba(255,255,255,.65) 0,rgba(255,255,255,.15) 100%);background-image:radial-gradient(rgba(255,255,255,.65) 0,rgba(255,255,255,.15) 100%);-webkit-background-size:28px 100%;-moz-background-size:28px 100%;-o-background-size:28px 100%;background-size:28px 100%;-webkit-animation:pace-theme-mac-osx-motion .5s linear infinite;-moz-animation:pace-theme-mac-osx-motion .5s linear infinite;-ms-animation:pace-theme-mac-osx-motion .5s linear infinite;-o-animation:pace-theme-mac-osx-motion .5s linear infinite;animation:pace-theme-mac-osx-motion .5s linear infinite}@-webkit-keyframes pace-theme-mac-osx-motion{0%{-webkit-transform:none;transform:none}100%{-webkit-transform:translate(-28px,0);transform:translate(-28px,0)}}@-moz-keyframes pace-theme-mac-osx-motion{0%{-moz-transform:none;transform:none}100%{-moz-transform:translate(-28px,0);transform:translate(-28px,0)}}@-o-keyframes pace-theme-mac-osx-motion{0%{-o-transform:none;transform:none}100%{-o-transform:translate(-28px,0);transform:translate(-28px,0)}}@-ms-keyframes pace-theme-mac-osx-motion{0%{-ms-transform:none;transform:none}100%{-ms-transform:translate(-28px,0);transform:translate(-28px,0)}}@keyframes pace-theme-mac-osx-motion{0%{transform:none;transform:none}100%{transform:translate(-28px,0);transform:translate(-28px,0)}}
1
+ .pace {
2
+ -webkit-pointer-events: none;
3
+ pointer-events: none;
4
+
5
+ -webkit-user-select: none;
6
+ -moz-user-select: none;
7
+ user-select: none;
8
+
9
+ overflow: hidden;
10
+ position: fixed;
11
+ top: 0;
12
+ left: 0;
13
+ z-index: 2000;
14
+ width: 100%;
15
+ height: 12px;
16
+ background: #fff;
17
+ }
18
+
19
+ .pace-inactive {
20
+ display: none;
21
+ }
22
+
23
+ .pace .pace-progress {
24
+ background-color: #0087E1;
25
+ position: fixed;
26
+ top: 0;
27
+ right: 100%;
28
+ width: 100%;
29
+ height: 12px;
30
+ overflow: hidden;
31
+
32
+ -webkit-border-radius: 0 0 4px 0;
33
+ -moz-border-radius: 0 0 4px 0;
34
+ -o-border-radius: 0 0 4px 0;
35
+ border-radius: 0 0 4px 0;
36
+
37
+ -webkit-box-shadow: inset -1px 0 #00558F, inset 0 -1px #00558F, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, .3);
38
+ -moz-box-shadow: inset -1px 0 #00558F, inset 0 -1px #00558F, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, .3);
39
+ -o-box-shadow: inset -1px 0 #00558F, inset 0 -1px #00558F, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, .3);
40
+ box-shadow: inset -1px 0 #00558F, inset 0 -1px #00558F, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, .3);
41
+ }
42
+
43
+ .pace .pace-activity {
44
+ position: fixed;
45
+ top: 0;
46
+ left: 0;
47
+ right: -28px;
48
+ bottom: 0;
49
+
50
+ -webkit-background-image: radial-gradient(rgba(255, 255, 255, .65) 0%, rgba(255, 255, 255, .15) 100%);
51
+ -moz-background-image: radial-gradient(rgba(255, 255, 255, .65) 0%, rgba(255, 255, 255, .15) 100%);
52
+ -o-background-image: radial-gradient(rgba(255, 255, 255, .65) 0%, rgba(255, 255, 255, .15) 100%);
53
+ background-image: radial-gradient(rgba(255, 255, 255, .65) 0%, rgba(255, 255, 255, .15) 100%);
54
+
55
+ -webkit-background-size: 28px 100%;
56
+ -moz-background-size: 28px 100%;
57
+ -o-background-size: 28px 100%;
58
+ background-size: 28px 100%;
59
+
60
+ -webkit-animation: pace-theme-mac-osx-motion 500ms linear infinite;
61
+ -moz-animation: pace-theme-mac-osx-motion 500ms linear infinite;
62
+ -ms-animation: pace-theme-mac-osx-motion 500ms linear infinite;
63
+ -o-animation: pace-theme-mac-osx-motion 500ms linear infinite;
64
+ animation: pace-theme-mac-osx-motion 500ms linear infinite;
65
+ }
66
+
67
+ @-webkit-keyframes pace-theme-mac-osx-motion {
68
+ 0% { -webkit-transform: none; transform: none; }
69
+ 100% { -webkit-transform: translate(-28px, 0); transform: translate(-28px, 0); }
70
+ }
71
+ @-moz-keyframes pace-theme-mac-osx-motion {
72
+ 0% { -moz-transform: none; transform: none; }
73
+ 100% { -moz-transform: translate(-28px, 0); transform: translate(-28px, 0); }
74
+ }
75
+ @-o-keyframes pace-theme-mac-osx-motion {
76
+ 0% { -o-transform: none; transform: none; }
77
+ 100% { -o-transform: translate(-28px, 0); transform: translate(-28px, 0); }
78
+ }
79
+ @-ms-keyframes pace-theme-mac-osx-motion {
80
+ 0% { -ms-transform: none; transform: none; }
81
+ 100% { -ms-transform: translate(-28px, 0); transform: translate(-28px, 0); }
82
+ }
83
+ @keyframes pace-theme-mac-osx-motion {
84
+ 0% { transform: none; transform: none; }
85
+ 100% { transform: translate(-28px, 0); transform: translate(-28px, 0); }
86
+ }
package/css/pace/pace.css CHANGED
@@ -1 +1,50 @@
1
- .pace{pointer-events:none;-moz-user-select:none;-webkit-user-select:none;user-select:none;z-index:2;position:fixed;margin:auto;top:4px;left:0;right:0;height:8px;border-radius:8px;width:6rem;background:#eaecf2;overflow:hidden}.pace-inactive .pace-progress{opacity:0;transition:.3s ease-in}.pace.pace-inactive{opacity:0;transition:.3s;top:-8px}.pace .pace-progress{box-sizing:border-box;transform:translate3d(0,0,0);position:fixed;z-index:2;display:block;position:absolute;top:0;right:100%;height:100%;width:100%;background:#49b1f5;background:linear-gradient(to right,#12c2e9,#c471ed,#f64f59);animation:gradient 2s ease infinite;background-size:200%}
1
+ .pace {
2
+ pointer-events: none;
3
+ -moz-user-select: none;
4
+ -webkit-user-select: none;
5
+ user-select: none;
6
+ z-index: 2;
7
+ position: fixed;
8
+ margin: auto;
9
+ top: 4px;
10
+ left: 0;
11
+ right: 0;
12
+ height: 8px;
13
+ border-radius: 8px;
14
+ width: 6rem;
15
+ background: #eaecf2;
16
+ overflow: hidden;
17
+ }
18
+
19
+ .pace-inactive .pace-progress {
20
+ opacity: 0;
21
+ transition: 0.3s ease-in;
22
+ }
23
+
24
+ .pace.pace-inactive {
25
+ opacity: 0;
26
+ transition: 0.3s;
27
+ top: -8px;
28
+ }
29
+
30
+ .pace .pace-progress {
31
+ box-sizing: border-box;
32
+ transform: translate3d(0, 0, 0);
33
+ position: fixed;
34
+ z-index: 2;
35
+ display: block;
36
+ position: absolute;
37
+ top: 0;
38
+ right: 100%;
39
+ height: 100%;
40
+ width: 100%;
41
+ background: #49b1f5;
42
+ background: linear-gradient(
43
+ to right,
44
+ rgb(18, 194, 233),
45
+ rgb(196, 113, 237),
46
+ rgb(246, 79, 89)
47
+ );
48
+ animation: gradient 2s ease infinite;
49
+ background-size: 200%;
50
+ }
package/css/plane.css CHANGED
@@ -1 +1,59 @@
1
- .planeOpt kbd{margin:0 3px;padding:3px 5px;border:1px solid #b4b4b4;border-radius:3px;background-color:#f8f8f8;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.25),0 2px 1px 0 rgba(255,255,255,.6) inset;box-shadow:0 1px 3px rgba(0,0,0,.25),0 2px 1px 0 rgba(255,255,255,.6) inset;color:#34495e;white-space:nowrap;font-weight:600;font-size:.9em;font-family:Monaco,'Ubuntu Mono',monospace;line-height:1em}.planeOpt button{cursor:pointer;font-family:inherit;font-size:12px;background:#49b1f5;color:#fff;padding:.5em 1em;display:flex;align-items:center;border:none;border-radius:8px;overflow:hidden;transition:all .2s}.planeOpt button span{display:block;margin-left:.3em;transition:all .3s ease-in-out}.planeOpt button svg{display:block;transform-origin:center center;transition:transform .3s ease-in-out}.planeOpt button:hover .svg-wrapper{animation:fly-1 .6s ease-in-out infinite alternate}.planeOpt button:hover svg{transform:translateX(1.2em) rotate(45deg) scale(1.1)}.planeOpt button:hover span{transform:translateX(5em)}.planeOpt button:active{transform:scale(.95)}
1
+ /* --------------------首页飞机操作样式-------------------- */
2
+ .planeOpt kbd {
3
+ margin: 0 3px;
4
+ padding: 3px 5px;
5
+ border: 1px solid #b4b4b4;
6
+ border-radius: 3px;
7
+ background-color: #f8f8f8;
8
+ -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .25), 0 2px 1px 0 rgba(255, 255, 255, .6) inset;
9
+ box-shadow: 0 1px 3px rgba(0, 0, 0, .25), 0 2px 1px 0 rgba(255, 255, 255, .6) inset;
10
+ color: #34495e;
11
+ white-space: nowrap;
12
+ font-weight: 600;
13
+ font-size: .9em;
14
+ font-family: Monaco, 'Ubuntu Mono', monospace;
15
+ line-height: 1em;
16
+ }
17
+
18
+ .planeOpt button {
19
+ cursor: pointer;
20
+ font-family: inherit;
21
+ font-size: 12px;
22
+ background: #49b1f5;
23
+ color: white;
24
+ padding: 0.5em 1em;
25
+ display: flex;
26
+ align-items: center;
27
+ border: none;
28
+ border-radius: 8px;
29
+ overflow: hidden;
30
+ transition: all 0.2s;
31
+ }
32
+
33
+ .planeOpt button span {
34
+ display: block;
35
+ margin-left: 0.3em;
36
+ transition: all 0.3s ease-in-out;
37
+ }
38
+
39
+ .planeOpt button svg {
40
+ display: block;
41
+ transform-origin: center center;
42
+ transition: transform 0.3s ease-in-out;
43
+ }
44
+
45
+ .planeOpt button:hover .svg-wrapper {
46
+ animation: fly-1 0.6s ease-in-out infinite alternate;
47
+ }
48
+
49
+ .planeOpt button:hover svg {
50
+ transform: translateX(1.2em) rotate(45deg) scale(1.1);
51
+ }
52
+
53
+ .planeOpt button:hover span {
54
+ transform: translateX(5em);
55
+ }
56
+
57
+ .planeOpt button:active {
58
+ transform: scale(0.95);
59
+ }