From 1336fc6ad214606e7b99c40c0e22c8074562e2f6 Mon Sep 17 00:00:00 2001 From: kang Date: Fri, 15 May 2026 16:33:17 +0800 Subject: [PATCH] auto-save 2026-05-15 16:33 (~4) --- .memory/worklog.json | 14 +- docs/source-analysis.html | 10 ++ web/app/globals.css | 139 ++++++++++++++++-- .../login/animated-login-characters.tsx | 18 ++- 4 files changed, 158 insertions(+), 23 deletions(-) diff --git a/.memory/worklog.json b/.memory/worklog.json index 222387b..97be9f4 100644 --- a/.memory/worklog.json +++ b/.memory/worklog.json @@ -1,12 +1,5 @@ { "entries": [ - { - "files_changed": 7, - "hash": "3684917", - "message": "auto-save 2026-05-14 01:05 (+4, ~3)", - "ts": "2026-05-14T01:06:06+08:00", - "type": "commit" - }, { "files_changed": 8, "hash": "4610ef8", @@ -3251,6 +3244,13 @@ "type": "session-heartbeat", "message": "Codex 会话活跃 · 最近命令：codex · 1 项未提交变更 · 最近提交：auto-save 2026-05-15 16:22 (~1)", "files_changed": 1 + }, + { + "ts": "2026-05-15T16:27:46+08:00", + "type": "commit", + "message": "auto-save 2026-05-15 16:27 (~3)", + "hash": "ecc5894", + "files_changed": 3 } ] } diff --git a/docs/source-analysis.html b/docs/source-analysis.html index b8a8287..d139252 100644 --- a/docs/source-analysis.html +++ b/docs/source-analysis.html @@ -942,6 +942,16 @@ SubjectAsset {

变更记录

这个记录不是 git log 的替代品。它记录“产品理解发生了什么变化、影响了哪些源码、你以后描述需求时该怎么说”。后续每次改功能都要补一条。

+
+
+

2026-05-15 · 登录页角色视觉样式升级

+ UI +
+
+

改动：在保留四个几何角色结构的基础上，增加底座阴影、发光边、玻璃高光、内部面板和状态点，让角色更像 SKG 内容工作台里的小模块，而不是纯色几何块。

+

影响：web/components/login/animated-login-characters.tsx、web/app/globals.css、docs/source-analysis.html。

+
+

2026-05-15 · 登录页角色取消默认上下浮动

diff --git a/web/app/globals.css b/web/app/globals.css index 9c30a60..ef2c9f7 100644 --- a/web/app/globals.css +++ b/web/app/globals.css @@ -205,46 +205,104 @@ transform: translateX(-50%) scale(0.74); transform-origin: bottom center; } +.login-character-base { + position: absolute; + left: 28px; + right: 18px; + bottom: -12px; + height: 28px; + border-radius: 999px; + background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.48), rgba(0, 0, 0, 0) 72%); + filter: blur(1px); +} .login-figure { position: absolute; bottom: 0; transform-origin: bottom center; + overflow: hidden; + border: 1px solid rgba(255, 255, 255, 0.16); transition: transform 0.7s cubic-bezier(0.4, 0, 0.2, 1), height 0.55s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease; will-change: transform; - filter: drop-shadow(0 28px 34px rgba(0, 0, 0, 0.32)); + filter: drop-shadow(0 28px 34px rgba(0, 0, 0, 0.34)); } .login-figure::after { content: ""; position: absolute; inset: 0; - background: linear-gradient(105deg, rgba(255, 255, 255, 0.16), transparent 34%, rgba(0, 0, 0, 0.12)); + background: + linear-gradient(105deg, rgba(255, 255, 255, 0.2), transparent 30%, rgba(0, 0, 0, 0.15)), + linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 28%); pointer-events: none; } -.login-figure--purple { - left: 70px; - width: 180px; - height: 400px; +.login-figure__rim { + position: absolute; + inset: 8px; z-index: 1; - background: #6c3ff5; - border-radius: 0; + border: 1px solid rgba(255, 255, 255, 0.16); + border-radius: inherit; + opacity: 0.85; + pointer-events: none; +} +.login-figure__shine { + position: absolute; + z-index: 1; + left: 18%; + top: 18%; + width: 42%; + height: 11%; + border-radius: 999px; + background: rgba(255, 255, 255, 0.22); + transform: rotate(-14deg); + pointer-events: none; +} +.login-figure__panel { + position: absolute; + z-index: 1; + border: 1px solid rgba(255, 255, 255, 0.13); + background: rgba(255, 255, 255, 0.1); + pointer-events: none; +} +.login-figure__signal { + position: absolute; + z-index: 2; + display: flex; + gap: 6px; + pointer-events: none; +} +.login-figure__signal span { + width: 7px; + height: 7px; + border-radius: 999px; + background: rgba(255, 255, 255, 0.56); + box-shadow: 0 0 12px rgba(255, 255, 255, 0.24); +} +.login-figure--purple { + left: 72px; + width: 176px; + height: 392px; + z-index: 1; + background: linear-gradient(165deg, #9b7bff 0%, #6c3ff5 46%, #3e1eb8 100%); + border-radius: 22px 22px 8px 8px; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.26); } .login-figure--black { left: 240px; width: 120px; height: 310px; z-index: 2; - background: #2d2d2d; - border-radius: 0; + background: linear-gradient(165deg, #34343a 0%, #202126 48%, #111217 100%); + border-radius: 18px 18px 6px 6px; + border-color: rgba(170, 160, 255, 0.18); } .login-figure--orange { left: 0; width: 240px; height: 150px; z-index: 3; - background: #ff9b6b; + background: linear-gradient(160deg, #ffb27f 0%, #ff8f61 56%, #dc6f48 100%); border-radius: 120px 120px 0 0; } .login-figure--yellow { @@ -252,9 +310,66 @@ width: 140px; height: 230px; z-index: 4; - background: #e8d754; + background: linear-gradient(160deg, #fff17a 0%, #e8d754 58%, #bfa73a 100%); border-radius: 70px 70px 0 0; } +.login-figure--purple .login-figure__panel { + left: 22px; + bottom: 88px; + width: 36px; + height: 152px; + border-radius: 999px; +} +.login-figure--purple .login-figure__signal { + left: 26px; + bottom: 46px; +} +.login-figure--black .login-figure__panel { + right: 16px; + bottom: 40px; + width: 12px; + height: 190px; + border-radius: 999px; + background: rgba(255, 255, 255, 0.08); +} +.login-figure--black .login-figure__signal { + right: 18px; + top: 88px; + flex-direction: column; +} +.login-figure--orange .login-figure__panel { + left: 42px; + bottom: 24px; + width: 88px; + height: 18px; + border-radius: 999px; + background: rgba(255, 255, 255, 0.16); +} +.login-figure--orange .login-figure__signal { + right: 54px; + bottom: 28px; +} +.login-figure--yellow .login-figure__panel { + left: 24px; + bottom: 44px; + width: 92px; + height: 24px; + border-radius: 999px; + background: rgba(45, 45, 45, 0.08); + border-color: rgba(45, 45, 45, 0.12); +} +.login-figure--yellow .login-figure__shine { + background: rgba(255, 255, 255, 0.3); +} +.login-figure--yellow .login-figure__signal { + left: 34px; + top: 124px; +} +.login-figure--yellow .login-figure__signal span, +.login-figure--orange .login-figure__signal span { + background: rgba(45, 45, 45, 0.36); + box-shadow: none; +} .login-eyes { position: absolute; z-index: 2; diff --git a/web/components/login/animated-login-characters.tsx b/web/components/login/animated-login-characters.tsx index 5641ab7..e84b24f 100644 --- a/web/components/login/animated-login-characters.tsx +++ b/web/components/login/animated-login-characters.tsx @@ -8,13 +8,14 @@ type FigureSpec = { id: "purple" | "black" | "orange" | "yellow" eyeKind: EyeKind mouth?: "purple" | "orange" | "yellow" + marks?: number } const FIGURES: FigureSpec[] = [ - { id: "purple", eyeKind: "eye", mouth: "purple" }, - { id: "black", eyeKind: "small-eye" }, - { id: "orange", eyeKind: "pupil", mouth: "orange" }, - { id: "yellow", eyeKind: "pupil", mouth: "yellow" }, + { id: "purple", eyeKind: "eye", mouth: "purple", marks: 3 }, + { id: "black", eyeKind: "small-eye", marks: 2 }, + { id: "orange", eyeKind: "pupil", mouth: "orange", marks: 2 }, + { id: "yellow", eyeKind: "pupil", mouth: "yellow", marks: 3 }, ] function Eyes({ figure, kind }: { figure: FigureSpec["id"]; kind: EyeKind }) { @@ -45,6 +46,14 @@ function Mouth({ type }: { type: NonNullable }) { function Figure({ spec }: { spec: FigureSpec }) { return (
+ + + + + {Array.from({ length: spec.marks ?? 0 }).map((_, index) => ( + + ))} + {spec.mouth ? : null}
@@ -72,6 +81,7 @@ export function AnimatedLoginCharacters({ >
+
{FIGURES.map((spec) => (
))}