feat(web): 采用 UI UX Pro Max Soft UI Evolution 设计系统

从 Pinterest 风格切换到 Soft UI Evolution 设计系统,使用 UI UX Pro Max
推理引擎生成适合跨行业 ERP 业务用户的专业设计方案。

设计变更:
- 主色从 Pinterest Red (#e60023) 切换到 Trust Blue (#2563EB)
- 字体从系统默认切换到 Noto Sans SC(中文优先)
- 圆角从 16-20px 调整到 10-12px(专业但不夸张)
- 中性色从暖橄榄调切换到 Slate 石板蓝调
- 成功色 #103c25 → #059669,警告色 #b56e1a → #d97706
- 暗色模式从暖黑 (#1a1a18) 切换到深海军蓝 (#0f172a)

涉及文件:DESIGN.md + index.css + App.tsx + 24 个组件文件
This commit is contained in:
iven
2026-04-20 23:27:24 +08:00
parent 85e732cf12
commit 89fc482d99
27 changed files with 598 additions and 588 deletions

View File

@@ -50,7 +50,7 @@ export default function NotificationPanel() {
<Button
type="text"
size="small"
style={{ fontSize: 12, color: '#e60023' }}
style={{ fontSize: 12, color: '#2563eb' }}
onClick={() => navigate('/messages')}
>
@@ -76,7 +76,7 @@ export default function NotificationPanel() {
cursor: 'pointer',
transition: 'background 0.15s ease',
border: 'none',
background: !item.is_read ? (isDark ? '#211922' : '#fef0f0') : 'transparent',
background: !item.is_read ? (isDark ? '#0f172a' : '#eff6ff') : 'transparent',
}}
onClick={() => {
if (!item.is_read) {
@@ -85,7 +85,7 @@ export default function NotificationPanel() {
}}
onMouseEnter={(e) => {
if (item.is_read) {
e.currentTarget.style.background = isDark ? '#211922' : '#fafaf8';
e.currentTarget.style.background = isDark ? '#0f172a' : '#f1f5f9';
}
}}
onMouseLeave={(e) => {
@@ -109,7 +109,7 @@ export default function NotificationPanel() {
width: 6,
height: 6,
borderRadius: '50%',
background: '#e60023',
background: '#2563eb',
flexShrink: 0,
}} />
)}
@@ -132,12 +132,12 @@ export default function NotificationPanel() {
textAlign: 'center',
paddingTop: 8,
marginTop: 4,
borderTop: `1px solid ${isDark ? '#211922' : '#f6f6f3'}`,
borderTop: `1px solid ${isDark ? '#0f172a' : '#f8fafc'}`,
}}>
<Button
type="text"
onClick={() => navigate('/messages')}
style={{ fontSize: 13, color: '#e60023', fontWeight: 500 }}
style={{ fontSize: 13, color: '#2563eb', fontWeight: 500 }}
>
</Button>
@@ -166,7 +166,7 @@ export default function NotificationPanel() {
position: 'relative',
}}
onMouseEnter={(e) => {
e.currentTarget.style.background = isDark ? '#211922' : '#f6f6f3';
e.currentTarget.style.background = isDark ? '#0f172a' : '#f8fafc';
}}
onMouseLeave={(e) => {
e.currentTarget.style.background = 'transparent';
@@ -175,7 +175,7 @@ export default function NotificationPanel() {
<Badge count={unreadCount} size="small" offset={[4, -4]}>
<BellOutlined style={{
fontSize: 16,
color: isDark ? '#91918c' : '#62625b',
color: isDark ? '#94a3b8' : '#475569',
}} />
</Badge>
</div>