pref:移除黑夜模式
This commit is contained in:
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user