kangwan/20260512-skg-tk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

auto-save 2026-05-15 16:10 (+1, ~4)

Browse Source
This commit is contained in:
kang
2026-05-15 16:11:10 +08:00
parent ac36c4e35d
commit 5ca9846748
5 changed files with 130 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
web/app/globals.css
View File

@@ -362,84 +362,84 @@
fill: none;
stroke-linecap: round;
}
.login-page[data-mood="typing"] .login-figure--purple {
.login-character-stage[data-mood="typing"] .login-figure--purple {
height: 430px;
transform: skewX(-10deg) translateX(36px);
}
.login-page[data-mood="typing"] .login-figure--black {
.login-character-stage[data-mood="typing"] .login-figure--black {
transform: skewX(7deg) translateX(6px);
}
.login-page[data-mood="typing"] .login-figure--orange {
.login-character-stage[data-mood="typing"] .login-figure--orange {
transform: skewX(-5deg);
}
.login-page[data-mood="typing"] .login-figure--yellow {
.login-character-stage[data-mood="typing"] .login-figure--yellow {
transform: skewX(4deg);
}
.login-page[data-mood="typing"] .login-mouth--purple {
.login-character-stage[data-mood="typing"] .login-mouth--purple {
width: 7px;
height: 32px;
border-radius: 0;
transform: translate(14px, -28px) skewX(10deg);
}
.login-page[data-mood="typing"] .login-mouth--orange {
.login-character-stage[data-mood="typing"] .login-mouth--orange {
width: 14px;
height: 14px;
border-radius: 50%;
transform: translateX(6px);
}
.login-page[data-mood="peek"] .login-figure--purple,
.login-page[data-mood="peek"] .login-figure--black {
.login-character-stage[data-mood="peek"] .login-figure--purple,
.login-character-stage[data-mood="peek"] .login-figure--black {
transform: skewX(0deg) translateY(-10px);
}
.login-page[data-mood="peek"] .login-eyes--purple {
.login-character-stage[data-mood="peek"] .login-eyes--purple {
left: 40px;
top: 14px;
}
.login-page[data-mood="peek"] .login-eyes--black {
.login-character-stage[data-mood="peek"] .login-eyes--black {
left: 2px;
top: 20px;
}
.login-page[data-mood="peek"] .login-eyes--orange {
.login-character-stage[data-mood="peek"] .login-eyes--orange {
left: 68px;
top: 48px;
}
.login-page[data-mood="peek"] .login-eyes--yellow {
.login-character-stage[data-mood="peek"] .login-eyes--yellow {
left: 10px;
top: 28px;
}
.login-page[data-mood="peek"] .login-eye::after,
.login-page[data-mood="peek"] .login-pupil::after {
.login-character-stage[data-mood="peek"] .login-eye::after,
.login-character-stage[data-mood="peek"] .login-pupil::after {
transform: translate(-8px, -6px);
}
.login-page[data-mood="error"] .login-characters-container {
.login-character-stage[data-mood="error"] .login-characters-container {
animation: login-stage-breathe 7s ease-in-out infinite, login-shake 0.28s ease-in-out 2;
}
.login-page[data-mood="error"] .login-eye {
.login-character-stage[data-mood="error"] .login-eye {
height: 10px;
margin-top: 4px;
}
.login-page[data-mood="error"] .login-mouth--purple,
.login-page[data-mood="error"] .login-mouth--orange {
.login-character-stage[data-mood="error"] .login-mouth--purple,
.login-character-stage[data-mood="error"] .login-mouth--orange {
border-radius: 12px 12px 0 0;
transform: translateY(10px);
}
.login-page[data-mood="error"] .login-yellow-mouth path {
.login-character-stage[data-mood="error"] .login-yellow-mouth path {
d: path("M0 10 Q10 2, 20 10 Q30 18, 40 10 Q50 2, 60 10 Q70 18, 80 10");
}
.login-page[data-mood="success"] .login-characters-container {
.login-character-stage[data-mood="success"] .login-characters-container {
animation: login-stage-success 0.75s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
.login-page[data-mood="success"] .login-mouth--purple {
.login-character-stage[data-mood="success"] .login-mouth--purple {
width: 30px;
height: 16px;
border-radius: 0 0 15px 15px;
}
.login-page[data-mood="success"] .login-mouth--orange {
.login-character-stage[data-mood="success"] .login-mouth--orange {
width: 32px;
height: 18px;
border-radius: 0 0 16px 16px;
}
.login-page[data-mood="success"] .login-yellow-mouth path {
.login-character-stage[data-mood="success"] .login-yellow-mouth path {
d: path("M0 6 Q20 18, 40 18 Q60 18, 80 6");
}
@keyframes login-stage-breathe {
@@ -466,8 +466,8 @@
}
@media (prefers-reduced-motion: reduce) {
.login-characters-container,
.login-page[data-mood="error"] .login-characters-container,
.login-page[data-mood="success"] .login-characters-container {
.login-character-stage[data-mood="error"] .login-characters-container,
.login-character-stage[data-mood="success"] .login-characters-container {
animation: none;
}
}