pref:移除黑夜模式

This commit is contained in:
zdl
2025-11-24 15:07:13 +08:00
parent e201f35b18
commit 528e61b961
5 changed files with 36 additions and 171 deletions

View File

@@ -1,16 +1,22 @@
/**
* KLineChart 主题配置
* KLineChart 主题配置(仅浅色主题)
*
* 适配 klinecharts@10.0.0-beta1
* 参考: https://github.com/klinecharts/KLineChart/blob/main/docs/en-US/guide/styles.md
*
* ⚠️ 重要说明:
* - 本项目已移除深色模式支持2025-01
* - 应用通过 colorModeManager 强制使用浅色主题
* - 已删除 darkTheme 和 timelineThemeDark 配置
*/
/* eslint-disable @typescript-eslint/no-explicit-any */
// ⚠️ 使用 any 类型绕过 KLineChart 类型定义的限制beta 版本类型不完整)
import type { DeepPartial, Styles } from 'klinecharts';
// import type { DeepPartial, Styles } from 'klinecharts'; // ⚠️ 未使用(保留以便将来扩展)
/**
* 图表主题颜色配置
* 图表主题颜色配置(浅色主题)
* ⚠️ 已移除深色模式相关颜色常量
*/
export const CHART_COLORS = {
// 涨跌颜色(中国市场习惯:红涨绿跌)
@@ -22,20 +28,16 @@ export const CHART_COLORS = {
primary: '#1b3bbb', // Navy 500
secondary: '#728fea', // Navy 300
background: '#ffffff',
backgroundDark: '#1B254B',
// 文本颜色
text: '#333333',
textSecondary: '#888888',
textDark: '#ffffff',
// 网格颜色
grid: '#e0e0e0',
gridDark: '#2d3748',
// 边框颜色
border: '#e0e0e0',
borderDark: '#2d3748',
// 事件标记颜色
eventMarker: '#ff9800',
@@ -152,7 +154,7 @@ export const lightTheme: any = {
},
text: {
show: true,
color: CHART_COLORS.textDark,
color: '#ffffff', // 白色文字(十字线标签背景是深蓝色)
size: 12,
family: 'Helvetica, Arial, sans-serif',
weight: 'normal',
@@ -170,7 +172,7 @@ export const lightTheme: any = {
},
text: {
show: true,
color: CHART_COLORS.textDark,
color: '#ffffff', // 白色文字(十字线标签背景是深蓝色)
size: 12,
family: 'Helvetica, Arial, sans-serif',
weight: 'normal',
@@ -217,80 +219,7 @@ export const lightTheme: any = {
},
};
/**
* 深色主题配置
*/
export const darkTheme: any = {
...lightTheme,
candle: {
...lightTheme.candle,
tooltip: {
...lightTheme.candle?.tooltip,
text: {
...lightTheme.candle?.tooltip?.text,
color: CHART_COLORS.textDark,
},
},
},
indicator: {
...lightTheme.indicator,
tooltip: {
...lightTheme.indicator?.tooltip,
text: {
...lightTheme.indicator?.tooltip?.text,
color: CHART_COLORS.textDark,
},
},
},
xAxis: {
...lightTheme.xAxis,
axisLine: {
show: true,
color: CHART_COLORS.borderDark,
},
tickLine: {
show: true,
length: 3,
color: CHART_COLORS.borderDark,
},
tickText: {
...lightTheme.xAxis?.tickText,
color: CHART_COLORS.textDark,
},
},
yAxis: {
...lightTheme.yAxis,
axisLine: {
show: true,
color: CHART_COLORS.borderDark,
},
tickLine: {
show: true,
length: 3,
color: CHART_COLORS.borderDark,
},
tickText: {
...lightTheme.yAxis?.tickText,
color: CHART_COLORS.textDark,
},
},
grid: {
show: true,
horizontal: {
show: true,
size: 1,
color: CHART_COLORS.gridDark,
style: 'dashed',
},
vertical: {
show: false,
},
},
separator: {
size: 1,
color: CHART_COLORS.borderDark,
},
};
// ❌ 已删除 darkTheme 配置(不再支持深色模式)
/**
* 分时图专用主题配置
@@ -389,43 +318,26 @@ export const timelineTheme: any = {
},
};
// ❌ 已删除 timelineThemeDark 配置(不再支持深色模式)
/**
* 分时图深色主题
* 获取主题配置(固定返回浅色主题
* ⚠️ 已移除深色模式支持
* @deprecated colorMode 参数已废弃,始终返回浅色主题
*/
export const timelineThemeDark: any = {
...timelineTheme,
...darkTheme,
candle: {
...timelineTheme.candle,
tooltip: {
...timelineTheme.candle?.tooltip,
text: {
...timelineTheme.candle?.tooltip?.text,
color: CHART_COLORS.textDark,
},
},
},
grid: {
...timelineTheme.grid,
horizontal: {
...timelineTheme.grid?.horizontal,
color: CHART_COLORS.gridDark,
},
},
export const getTheme = (_colorMode?: 'light' | 'dark'): any => {
// ✅ 始终返回浅色主题
return lightTheme;
};
/**
* 获取主题配置(根据 Chakra UI colorMode
* 获取分时图主题配置(固定返回浅色主题
* ⚠️ 已移除深色模式支持
* @deprecated colorMode 参数已废弃,始终返回浅色主题
*/
export const getTheme = (colorMode: 'light' | 'dark' = 'light'): any => {
return colorMode === 'dark' ? darkTheme : lightTheme;
};
/**
* 获取分时图主题配置
*/
export const getTimelineTheme = (colorMode: 'light' | 'dark' = 'light'): any => {
const baseTheme = colorMode === 'dark' ? timelineThemeDark : timelineTheme;
export const getTimelineTheme = (_colorMode?: 'light' | 'dark'): any => {
// ✅ 始终使用浅色主题
const baseTheme = timelineTheme;
// ✅ 添加成交量指标样式(蓝色渐变柱状图)+ 成交量单位格式化
return {