feat(core): Wave 1 part1 — 浮层进场动画/ESC + Toast 归正 + 账户表横线
S4 浮层: overlays.tsx 新增共享 useOverlayTransition(挂载→下一帧上 .show 触发 scale(.96→1)/translateX 进场过渡;关闭先撤 .show 播退场再卸载)+ 统一 ESC 关闭, 应用 TeamModal/ConfirmModal/SuccessModal/Drawer;EmptyPanel 补 .ic-empty 灰 icon S3 Toast: ToastLike 改用设计系统 .toast(右下/单橙 ic-t/shadow-floating/滑入), 不再随 success/error 变绿红边;auth login-toast → .toast S9 表格: account-page.css 删 tbody td border-bottom(对照 V1 account.html 确认应无行线) 验证: tsc 0 · 交互走查 toast出现+ESC关弹窗 · 14 路由回归 boot 0 报错 · 登录 643ms Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.8
parent
8a0ae6a19d
commit
74e3c818c5
@@ -1,6 +1,6 @@
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { createPortal } from "react-dom";
|
||||
import { Check } from "lucide-react";
|
||||
import { AlertCircle, Check, Info } from "lucide-react";
|
||||
import { IconKitSvg } from "./IconKitSvg";
|
||||
import { useBodyScrollLock } from "./overlays";
|
||||
import type { Product, Project, Team, User } from "../types";
|
||||
@@ -261,9 +261,17 @@ export function CornerMarks() {
|
||||
}
|
||||
|
||||
export function ToastLike({ notice }: { notice: NonNullable<Notice> }) {
|
||||
// 右下角浮层:统一用设计系统 .toast(单橙 icon-box + --shadow-floating),不再随
|
||||
// success/error 变绿/红边(单一 accent 铁律)。挂载后下一帧上 .show 触发滑入进场。
|
||||
const [show, setShow] = useState(false);
|
||||
useEffect(() => {
|
||||
const raf = requestAnimationFrame(() => setShow(true));
|
||||
return () => cancelAnimationFrame(raf);
|
||||
}, []);
|
||||
const Icon = notice.type === "error" ? AlertCircle : notice.type === "info" ? Info : Check;
|
||||
return (
|
||||
<div className={`inline-toast ${notice.type}`}>
|
||||
<div className="ic-t"><Check size={12} /></div>
|
||||
<div className={`toast${show ? " show" : ""}`} role="status" aria-live="polite">
|
||||
<div className="ic-t"><Icon size={13} /></div>
|
||||
<div className="txt">{notice.text}<span className="mono">[ {notice.type.toUpperCase()} ]</span></div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user