sinzmise-cetastories-en 2.0.0-1734701235115 → 2.0.0-1734702124573
Sign up to get free protection for your applications and to get access to all the features.
- package/404.html +1 -1
- package/archives/2023/12/index.html +1 -1
- package/archives/2023/index.html +1 -1
- package/archives/index.html +1 -1
- package/atom.xml +2 -2
- package/categories/Test/index.html +1 -1
- package/categories/index.html +1 -1
- package/comments/index.html +1 -1
- package/css/coin.css +1 -190
- package/css/hbe.style.css +1 -749
- package/css/index.css +1 -14564
- package/css/kslink.css +1 -38
- package/css/plane.css +1 -59
- package/css/tags.css +1 -3516
- package/cw.js +1 -1
- package/index.html +1 -1
- package/js/webmention.js +3 -0
- package/package.json +1 -1
- package/posts/46521/index.html +1 -1
- package/sitemap.xml +2 -2
- package/swpp/update.json +1 -1
- package/tags/Test/index.html +1 -1
- package/tags/index.html +1 -1
- package/coin.css +0 -1
- package/hbe.style.css +0 -1
- package/index.css +0 -1
- package/kslink.css +0 -1
- package/plane.css +0 -1
- package/tags.css +0 -1
- package/var.css +0 -0
package/css/coin.css
CHANGED
|
@@ -1,190 +1 @@
|
|
|
1
|
-
.tip-button {
|
|
2
|
-
border: 0;
|
|
3
|
-
border-radius: 0.25rem;
|
|
4
|
-
cursor: pointer;
|
|
5
|
-
font-size: 20px;
|
|
6
|
-
font-weight: 600;
|
|
7
|
-
height: 2.6rem;
|
|
8
|
-
margin-bottom: -4rem;
|
|
9
|
-
outline: 0;
|
|
10
|
-
position: relative;
|
|
11
|
-
top: 0;
|
|
12
|
-
transform-origin: 0% 100%;
|
|
13
|
-
transition: transform 50ms ease-in-out;
|
|
14
|
-
width: auto;
|
|
15
|
-
-webkit-tap-highlight-color: transparent;
|
|
16
|
-
}
|
|
17
|
-
.tip-button:active {
|
|
18
|
-
transform: rotate(4deg);
|
|
19
|
-
}
|
|
20
|
-
.tip-button.clicked {
|
|
21
|
-
animation: 150ms ease-in-out 1 shake;
|
|
22
|
-
pointer-events: none;
|
|
23
|
-
}
|
|
24
|
-
.tip-button.clicked .tip-button__text {
|
|
25
|
-
opacity: 0;
|
|
26
|
-
transition: opacity 100ms linear 200ms;
|
|
27
|
-
}
|
|
28
|
-
.tip-button.clicked::before {
|
|
29
|
-
height: 0.5rem;
|
|
30
|
-
width: 60%;
|
|
31
|
-
background: var(button-hover-color);
|
|
32
|
-
}
|
|
33
|
-
.tip-button.clicked .coin {
|
|
34
|
-
transition: margin-bottom 1s linear 200ms;
|
|
35
|
-
margin-bottom: 0;
|
|
36
|
-
}
|
|
37
|
-
.tip-button.shrink-landing::before {
|
|
38
|
-
transition: width 200ms ease-in;
|
|
39
|
-
width: 0;
|
|
40
|
-
}
|
|
41
|
-
.tip-button.coin-landed::after {
|
|
42
|
-
opacity: 1;
|
|
43
|
-
transform: scale(1);
|
|
44
|
-
transform-origin: 50% 100%;
|
|
45
|
-
}
|
|
46
|
-
.tip-button.coin-landed .coin-wrapper {
|
|
47
|
-
background: radial-gradient(circle at 35% 97%, rgba(3, 16, 50, 0.4) 0.04rem, transparent 0.04rem), radial-gradient(circle at 45% 92%, rgba(3, 16, 50, 0.4) 0.04rem, transparent 0.02rem), radial-gradient(circle at 55% 98%, rgba(3, 16, 50, 0.4) 0.04rem, transparent 0.04rem), radial-gradient(circle at 65% 96%, rgba(3, 16, 50, 0.4) 0.06rem, transparent 0.06rem);
|
|
48
|
-
background-position: center bottom;
|
|
49
|
-
background-size: 100%;
|
|
50
|
-
bottom: -1rem;
|
|
51
|
-
opacity: 0;
|
|
52
|
-
transform: scale(2) translateY(-10px);
|
|
53
|
-
}
|
|
54
|
-
.tip-button__text {
|
|
55
|
-
color: #fff;
|
|
56
|
-
margin-right: 1.8rem;
|
|
57
|
-
opacity: 1;
|
|
58
|
-
position: relative;
|
|
59
|
-
transition: opacity 100ms linear 500ms;
|
|
60
|
-
z-index: 3;
|
|
61
|
-
}
|
|
62
|
-
.tip-button::before {
|
|
63
|
-
border-radius: 0.25rem;
|
|
64
|
-
bottom: 0;
|
|
65
|
-
content: '';
|
|
66
|
-
display: block;
|
|
67
|
-
height: 100%;
|
|
68
|
-
left: 50%;
|
|
69
|
-
position: absolute;
|
|
70
|
-
transform: translateX(-50%);
|
|
71
|
-
transition: height 250ms ease-in-out 400ms, width 250ms ease-in-out 300ms;
|
|
72
|
-
width: 100%;
|
|
73
|
-
z-index: 2;
|
|
74
|
-
}
|
|
75
|
-
.tip-button::after {
|
|
76
|
-
bottom: -1rem;
|
|
77
|
-
color: white;
|
|
78
|
-
content: 'ヾ(≧O≦)〃嗷~'; /*点击后显示的内容*/
|
|
79
|
-
height: 110%;
|
|
80
|
-
left: 0;
|
|
81
|
-
opacity: 0;
|
|
82
|
-
position: absolute;
|
|
83
|
-
pointer-events: none;
|
|
84
|
-
text-align: center;
|
|
85
|
-
transform: scale(0);
|
|
86
|
-
transform-origin: 50% 20%;
|
|
87
|
-
transition: transform 200ms cubic-bezier(0, 0, 0.35, 1.43);
|
|
88
|
-
width: 100%;
|
|
89
|
-
z-index: 1;
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
.coin-wrapper {
|
|
93
|
-
background: none;
|
|
94
|
-
bottom: 0;
|
|
95
|
-
height: 18rem;
|
|
96
|
-
left: 0;
|
|
97
|
-
opacity: 1;
|
|
98
|
-
overflow: hidden;
|
|
99
|
-
pointer-events: none;
|
|
100
|
-
position: absolute;
|
|
101
|
-
transform: none;
|
|
102
|
-
transform-origin: 50% 100%;
|
|
103
|
-
transition: opacity 200ms linear 100ms, transform 300ms ease-out;
|
|
104
|
-
width: 100%;
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
.coin {
|
|
108
|
-
--front-y-multiplier: 0;
|
|
109
|
-
--back-y-multiplier: 0;
|
|
110
|
-
--coin-y-multiplier: 0;
|
|
111
|
-
--coin-x-multiplier: 0;
|
|
112
|
-
--coin-scale-multiplier: 0;
|
|
113
|
-
--coin-rotation-multiplier: 0;
|
|
114
|
-
--shine-opacity-multiplier: 0.4;
|
|
115
|
-
--shine-bg-multiplier: 50%;
|
|
116
|
-
bottom: calc(var(--coin-y-multiplier) * 1rem - 3.5rem);
|
|
117
|
-
height: 3.5rem;
|
|
118
|
-
margin-bottom: 3.05rem;
|
|
119
|
-
position: absolute;
|
|
120
|
-
right: calc(var(--coin-x-multiplier) * 34% + 16%);
|
|
121
|
-
transform: translateX(50%) scale(calc(0.4 + var(--coin-scale-multiplier))) rotate(calc(var(--coin-rotation-multiplier) * -1deg));
|
|
122
|
-
transition: opacity 100ms linear 200ms;
|
|
123
|
-
width: 3.5rem;
|
|
124
|
-
z-index: 3;
|
|
125
|
-
}
|
|
126
|
-
.coin__front, .coin__middle, .coin__back, .coin::before, .coin__front::after, .coin__back::after {
|
|
127
|
-
border-radius: 50%;
|
|
128
|
-
box-sizing: border-box;
|
|
129
|
-
height: 100%;
|
|
130
|
-
left: 0;
|
|
131
|
-
position: absolute;
|
|
132
|
-
width: 100%;
|
|
133
|
-
z-index: 3;
|
|
134
|
-
}
|
|
135
|
-
.coin__front {
|
|
136
|
-
background: radial-gradient(circle at 50% 50%, transparent 50%, rgba(115, 124, 153, 0.4) 54%, #c2cadf 54%), linear-gradient(210deg, #8590b3 32%, transparent 32%), linear-gradient(150deg, #8590b3 32%, transparent 32%), linear-gradient(to right, #8590b3 22%, transparent 22%, transparent 78%, #8590b3 78%), linear-gradient(to bottom, #fcfaf9 44%, transparent 44%, transparent 65%, #fcfaf9 65%, #fcfaf9 71%, #8590b3 71%), linear-gradient(to right, transparent 28%, #fcfaf9 28%, #fcfaf9 34%, #8590b3 34%, #8590b3 40%, #fcfaf9 40%, #fcfaf9 47%, #8590b3 47%, #8590b3 53%, #fcfaf9 53%, #fcfaf9 60%, #8590b3 60%, #8590b3 66%, #fcfaf9 66%, #fcfaf9 72%, transparent 72%);
|
|
137
|
-
background-color: #8590b3;
|
|
138
|
-
background-size: 100% 100%;
|
|
139
|
-
transform: translateY(calc(var(--front-y-multiplier) * 0.3181818182rem / 2)) scaleY(var(--front-scale-multiplier));
|
|
140
|
-
}
|
|
141
|
-
.coin__front::after {
|
|
142
|
-
background: rgba(0, 0, 0, 0.2);
|
|
143
|
-
content: '';
|
|
144
|
-
opacity: var(--front-y-multiplier);
|
|
145
|
-
}
|
|
146
|
-
.coin__middle {
|
|
147
|
-
background: #737c99;
|
|
148
|
-
transform: translateY(calc(var(--middle-y-multiplier) * 0.3181818182rem / 2)) scaleY(var(--middle-scale-multiplier));
|
|
149
|
-
}
|
|
150
|
-
.coin__back {
|
|
151
|
-
background: radial-gradient(circle at 50% 50%, transparent 50%, rgba(115, 124, 153, 0.4) 54%, #c2cadf 54%), radial-gradient(circle at 50% 40%, #fcfaf9 23%, transparent 23%), radial-gradient(circle at 50% 100%, #fcfaf9 35%, transparent 35%);
|
|
152
|
-
background-color: #8590b3;
|
|
153
|
-
background-size: 100% 100%;
|
|
154
|
-
transform: translateY(calc(var(--back-y-multiplier) * 0.3181818182rem / 2)) scaleY(var(--back-scale-multiplier));
|
|
155
|
-
}
|
|
156
|
-
.coin__back::after {
|
|
157
|
-
background: rgba(0, 0, 0, 0.2);
|
|
158
|
-
content: '';
|
|
159
|
-
opacity: var(--back-y-multiplier);
|
|
160
|
-
}
|
|
161
|
-
.coin::before {
|
|
162
|
-
background: radial-gradient(circle at 25% 65%, transparent 50%, rgba(255, 255, 255, 0.9) 90%), linear-gradient(55deg, transparent calc(var(--shine-bg-multiplier) + 0%), #e9f4ff calc(var(--shine-bg-multiplier) + 0%), transparent calc(var(--shine-bg-multiplier) + 50%));
|
|
163
|
-
content: '';
|
|
164
|
-
opacity: var(--shine-opacity-multiplier);
|
|
165
|
-
transform: translateY(calc(var(--middle-y-multiplier) * 0.3181818182rem / -2)) scaleY(var(--middle-scale-multiplier)) rotate(calc(var(--coin-rotation-multiplier) * 1deg));
|
|
166
|
-
z-index: 10;
|
|
167
|
-
}
|
|
168
|
-
.coin::after {
|
|
169
|
-
background: #737c99;
|
|
170
|
-
content: '';
|
|
171
|
-
height: 0.3181818182rem;
|
|
172
|
-
left: 0;
|
|
173
|
-
position: absolute;
|
|
174
|
-
top: 50%;
|
|
175
|
-
transform: translateY(-50%);
|
|
176
|
-
width: 100%;
|
|
177
|
-
z-index: 2;
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
@keyframes shake {
|
|
181
|
-
0% {
|
|
182
|
-
transform: rotate(4deg);
|
|
183
|
-
}
|
|
184
|
-
66% {
|
|
185
|
-
transform: rotate(-4deg);
|
|
186
|
-
}
|
|
187
|
-
100% {
|
|
188
|
-
transform: rotate();
|
|
189
|
-
}
|
|
190
|
-
}
|
|
1
|
+
.tip-button{border:0;border-radius:.25rem;cursor:pointer;font-size:20px;font-weight:600;height:2.6rem;margin-bottom:-4rem;outline:0;position:relative;top:0;transform-origin:0 100%;transition:transform 50ms ease-in-out;width:auto;-webkit-tap-highlight-color:transparent}.tip-button:active{transform:rotate(4deg)}.tip-button.clicked{animation:150ms ease-in-out 1 shake;pointer-events:none}.tip-button.clicked .tip-button__text{opacity:0;transition:opacity .1s linear .2s}.tip-button.clicked::before{height:.5rem;width:60%;background:var(button-hover-color)}.tip-button.clicked .coin{transition:margin-bottom 1s linear .2s;margin-bottom:0}.tip-button.shrink-landing::before{transition:width .2s ease-in;width:0}.tip-button.coin-landed::after{opacity:1;transform:scale(1);transform-origin:50% 100%}.tip-button.coin-landed .coin-wrapper{background:radial-gradient(circle at 35% 97%,rgba(3,16,50,.4) .04rem,transparent .04rem),radial-gradient(circle at 45% 92%,rgba(3,16,50,.4) .04rem,transparent .02rem),radial-gradient(circle at 55% 98%,rgba(3,16,50,.4) .04rem,transparent .04rem),radial-gradient(circle at 65% 96%,rgba(3,16,50,.4) .06rem,transparent .06rem);background-position:center bottom;background-size:100%;bottom:-1rem;opacity:0;transform:scale(2) translateY(-10px)}.tip-button__text{color:#fff;margin-right:1.8rem;opacity:1;position:relative;transition:opacity .1s linear .5s;z-index:3}.tip-button::before{border-radius:.25rem;bottom:0;content:'';display:block;height:100%;left:50%;position:absolute;transform:translateX(-50%);transition:height 250ms ease-in-out .4s,width 250ms ease-in-out .3s;width:100%;z-index:2}.tip-button::after{bottom:-1rem;color:#fff;content:'ヾ(≧O≦)〃嗷~';height:110%;left:0;opacity:0;position:absolute;pointer-events:none;text-align:center;transform:scale(0);transform-origin:50% 20%;transition:transform .2s cubic-bezier(0,0,.35,1.43);width:100%;z-index:1}.coin-wrapper{background:0 0;bottom:0;height:18rem;left:0;opacity:1;overflow:hidden;pointer-events:none;position:absolute;transform:none;transform-origin:50% 100%;transition:opacity .2s linear .1s,transform .3s ease-out;width:100%}.coin{--front-y-multiplier:0;--back-y-multiplier:0;--coin-y-multiplier:0;--coin-x-multiplier:0;--coin-scale-multiplier:0;--coin-rotation-multiplier:0;--shine-opacity-multiplier:0.4;--shine-bg-multiplier:50%;bottom:calc(var(--coin-y-multiplier) * 1rem - 3.5rem);height:3.5rem;margin-bottom:3.05rem;position:absolute;right:calc(var(--coin-x-multiplier) * 34% + 16%);transform:translateX(50%) scale(calc(.4 + var(--coin-scale-multiplier))) rotate(calc(var(--coin-rotation-multiplier) * -1deg));transition:opacity .1s linear .2s;width:3.5rem;z-index:3}.coin::before,.coin__back,.coin__back::after,.coin__front,.coin__front::after,.coin__middle{border-radius:50%;box-sizing:border-box;height:100%;left:0;position:absolute;width:100%;z-index:3}.coin__front{background:radial-gradient(circle at 50% 50%,transparent 50%,rgba(115,124,153,.4) 54%,#c2cadf 54%),linear-gradient(210deg,#8590b3 32%,transparent 32%),linear-gradient(150deg,#8590b3 32%,transparent 32%),linear-gradient(to right,#8590b3 22%,transparent 22%,transparent 78%,#8590b3 78%),linear-gradient(to bottom,#fcfaf9 44%,transparent 44%,transparent 65%,#fcfaf9 65%,#fcfaf9 71%,#8590b3 71%),linear-gradient(to right,transparent 28%,#fcfaf9 28%,#fcfaf9 34%,#8590b3 34%,#8590b3 40%,#fcfaf9 40%,#fcfaf9 47%,#8590b3 47%,#8590b3 53%,#fcfaf9 53%,#fcfaf9 60%,#8590b3 60%,#8590b3 66%,#fcfaf9 66%,#fcfaf9 72%,transparent 72%);background-color:#8590b3;background-size:100% 100%;transform:translateY(calc(var(--front-y-multiplier) * .3181818182rem / 2)) scaleY(var(--front-scale-multiplier))}.coin__front::after{background:rgba(0,0,0,.2);content:'';opacity:var(--front-y-multiplier)}.coin__middle{background:#737c99;transform:translateY(calc(var(--middle-y-multiplier) * .3181818182rem / 2)) scaleY(var(--middle-scale-multiplier))}.coin__back{background:radial-gradient(circle at 50% 50%,transparent 50%,rgba(115,124,153,.4) 54%,#c2cadf 54%),radial-gradient(circle at 50% 40%,#fcfaf9 23%,transparent 23%),radial-gradient(circle at 50% 100%,#fcfaf9 35%,transparent 35%);background-color:#8590b3;background-size:100% 100%;transform:translateY(calc(var(--back-y-multiplier) * .3181818182rem / 2)) scaleY(var(--back-scale-multiplier))}.coin__back::after{background:rgba(0,0,0,.2);content:'';opacity:var(--back-y-multiplier)}.coin::before{background:radial-gradient(circle at 25% 65%,transparent 50%,rgba(255,255,255,.9) 90%),linear-gradient(55deg,transparent calc(var(--shine-bg-multiplier) + 0),#e9f4ff calc(var(--shine-bg-multiplier) + 0),transparent calc(var(--shine-bg-multiplier) + 50%));content:'';opacity:var(--shine-opacity-multiplier);transform:translateY(calc(var(--middle-y-multiplier) * .3181818182rem / -2)) scaleY(var(--middle-scale-multiplier)) rotate(calc(var(--coin-rotation-multiplier) * 1deg));z-index:10}.coin::after{background:#737c99;content:'';height:.3181818182rem;left:0;position:absolute;top:50%;transform:translateY(-50%);width:100%;z-index:2}@keyframes shake{0%{transform:rotate(4deg)}66%{transform:rotate(-4deg)}100%{transform:rotate()}}
|