refactor(StockOverview): 迁移毛玻璃效果到统一配置 - 批次4

- index.js: 使用 GLASS_BLUR.lg 替代 blur(20px)
- glassTheme.js: 从全局 glassConfig 导入配置
- FlexScreen/index.tsx: 使用 GLASS_BLUR.lg
- QuoteTile.tsx: 使用 GLASS_BLUR.sm
- AlertDetailDrawer.js: 使用 GLASS_BLUR.xs/lg

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
zdl
2025-12-25 16:33:45 +08:00
parent 54ed9c5701
commit ae445ee234
5 changed files with 29 additions and 21 deletions

View File

@@ -3,8 +3,12 @@
*
* 设计理念:打造漂浮在深空中的半透明玻璃态数据终端
* 强调光影深度、弥散背景光和极致圆角
*
* 注意: 毛玻璃效果配置已迁移至全局 @/constants/glassConfig.ts
*/
import { GLASS_BLUR, GLASS_BG, GLASS_BORDER, GLASS_SHADOW } from '@/constants/glassConfig';
// 极光背景渐变配置
export const auroraGradients = {
// 主背景 - 深空极光
@@ -27,42 +31,42 @@ export const auroraGradients = {
`,
};
// 毛玻璃效果配置
// 毛玻璃效果配置 - 使用全局统一配置
export const glassEffect = {
// 标准玻璃卡片
card: {
bg: 'rgba(255, 255, 255, 0.03)',
backdropFilter: 'blur(20px) saturate(180%)',
border: '1px solid rgba(255, 255, 255, 0.08)',
bg: GLASS_BG.medium,
backdropFilter: `${GLASS_BLUR.lg} saturate(180%)`,
border: GLASS_BORDER.light,
borderRadius: '24px',
boxShadow: `
0 8px 32px rgba(0, 0, 0, 0.3),
inset 0 1px 0 rgba(255, 255, 255, 0.05)
${GLASS_SHADOW.md},
${GLASS_SHADOW.inset}
`,
},
// 轻量玻璃 - 用于内部元素
light: {
bg: 'rgba(255, 255, 255, 0.02)',
backdropFilter: 'blur(12px)',
border: '1px solid rgba(255, 255, 255, 0.05)',
bg: GLASS_BG.light,
backdropFilter: GLASS_BLUR.md,
border: GLASS_BORDER.subtle,
borderRadius: '16px',
},
// 强调玻璃 - 用于重要元素
accent: {
bg: 'rgba(139, 92, 246, 0.1)',
backdropFilter: 'blur(16px) saturate(200%)',
backdropFilter: `${GLASS_BLUR.md} saturate(200%)`,
border: '1px solid rgba(139, 92, 246, 0.2)',
borderRadius: '20px',
boxShadow: '0 4px 24px rgba(139, 92, 246, 0.15)',
},
// 悬浮玻璃 - 用于弹出层
floating: {
bg: 'rgba(20, 20, 30, 0.9)',
backdropFilter: 'blur(24px) saturate(200%)',
border: '1px solid rgba(255, 255, 255, 0.1)',
bg: GLASS_BG.overlay,
backdropFilter: `${GLASS_BLUR.lg} saturate(200%)`,
border: GLASS_BORDER.light,
borderRadius: '20px',
boxShadow: `
0 25px 50px -12px rgba(0, 0, 0, 0.5),
${GLASS_SHADOW.lg},
0 0 0 1px rgba(255, 255, 255, 0.05)
`,
},
@@ -259,8 +263,8 @@ export const presets = {
export const tooltipStyles = {
container: {
bg: 'rgba(15, 15, 25, 0.95)',
backdropFilter: 'blur(16px)',
border: '1px solid rgba(255, 255, 255, 0.1)',
backdropFilter: GLASS_BLUR.md,
border: GLASS_BORDER.light,
borderRadius: '12px',
boxShadow: '0 20px 40px rgba(0, 0, 0, 0.5)',
p: 3,