Browse Source
perf(ConfigProvider): 配置antdv主题色, 使其与modifyVars配置一致 (#3219)
* perf(ConfigProvider): 配置antdv主题, 使其与modifyVars配置一致
* fix(dark): 修正颜色写法
* fix(dark): 修正app-content-background-color深色颜色
* style(BasicTable): row striped style add important
---------
Co-authored-by: 苗大 <caoshengmiao@hypergryph.com>
pull/3227/head
苗大
3 years ago
committed by
GitHub
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with
21 additions and
6 deletions
-
src/App.vue
-
src/components/Table/src/BasicTable.vue
-
src/logics/theme/dark.ts
|
|
|
@ -1,5 +1,5 @@ |
|
|
|
<template> |
|
|
|
<ConfigProvider :locale="getAntdLocale" :theme="isDark ? darkTheme : {}"> |
|
|
|
<ConfigProvider :locale="getAntdLocale" :theme="themeConfig"> |
|
|
|
<AppProvider> |
|
|
|
<RouterView /> |
|
|
|
</AppProvider> |
|
|
|
@ -7,19 +7,34 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script lang="ts" setup> |
|
|
|
import { ConfigProvider } from 'ant-design-vue'; |
|
|
|
import { AppProvider } from '@/components/Application'; |
|
|
|
import { useTitle } from '@/hooks/web/useTitle'; |
|
|
|
import { useLocale } from '@/locales/useLocale'; |
|
|
|
import { ConfigProvider } from 'ant-design-vue'; |
|
|
|
|
|
|
|
import 'dayjs/locale/zh-cn'; |
|
|
|
import { useDarkModeTheme } from '@/hooks/setting/useDarkModeTheme'; |
|
|
|
import 'dayjs/locale/zh-cn'; |
|
|
|
import { computed } from 'vue'; |
|
|
|
|
|
|
|
// support Multi-language |
|
|
|
const { getAntdLocale } = useLocale(); |
|
|
|
|
|
|
|
const { isDark, darkTheme } = useDarkModeTheme(); |
|
|
|
|
|
|
|
const themeConfig = computed(() => |
|
|
|
Object.assign( |
|
|
|
{ |
|
|
|
token: { |
|
|
|
colorPrimary: '#0960bd', |
|
|
|
colorSuccess: '#55D187', |
|
|
|
colorWarning: '#EFBD47', |
|
|
|
colorError: '#ED6F6F', |
|
|
|
colorInfo: '#0960bd', |
|
|
|
}, |
|
|
|
}, |
|
|
|
isDark.value ? darkTheme : {}, |
|
|
|
), |
|
|
|
); |
|
|
|
// Listening to page changes and dynamically changing site titles |
|
|
|
useTitle(); |
|
|
|
</script> |
|
|
|
|
|
|
|
@ -379,7 +379,7 @@ |
|
|
|
|
|
|
|
&-row__striped { |
|
|
|
td { |
|
|
|
background-color: @app-content-background; |
|
|
|
background-color: @app-content-background !important; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
@ -14,7 +14,7 @@ export type CustomColorType = { |
|
|
|
export const customColorList: CustomColorType[] = [ |
|
|
|
{ |
|
|
|
name: '--text-color', |
|
|
|
light: 'rgb(0,0,0,85%)', |
|
|
|
light: 'rgba(0 0 0 85%)', |
|
|
|
dark: '#c9d1d9', |
|
|
|
}, |
|
|
|
{ |
|
|
|
@ -30,7 +30,7 @@ export const customColorList: CustomColorType[] = [ |
|
|
|
{ |
|
|
|
name: '--app-content-background-color', |
|
|
|
light: '#fafafa', |
|
|
|
dark: '#151515', |
|
|
|
dark: '#1e1e1e', |
|
|
|
}, |
|
|
|
// custom example
|
|
|
|
{ |
|
|
|
|