mirror of
https://github.com/Tencent/tdesign-vue-next-starter.git
synced 2024-12-22 16:36:32 +08:00
chore: optimize color
This commit is contained in:
parent
f8aef31369
commit
a1fad315e2
2
.gitignore
vendored
2
.gitignore
vendored
|
@ -19,4 +19,4 @@ yarn-error.log
|
|||
.history
|
||||
.stylelintcache
|
||||
yarn.lock
|
||||
package-lock.lock
|
||||
package-lock.json
|
||||
|
|
17361
package-lock.json
generated
17361
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
|
@ -189,12 +189,14 @@ export const LIGHT_CHART_COLORS: ColorToken = {
|
|||
textColor: 'rgba(0, 0, 0, 0.9)',
|
||||
placeholderColor: 'rgba(0, 0, 0, 0.35)',
|
||||
borderColor: '#dcdcdc',
|
||||
containerColor: '#fff',
|
||||
};
|
||||
|
||||
export const DARK_CHART_COLORS: ColorToken = {
|
||||
textColor: 'rgba(255, 255, 255, 0.9)',
|
||||
placeholderColor: 'rgba(255, 255, 255, 0.35)',
|
||||
borderColor: '#5e5e5e',
|
||||
containerColor: '#242424',
|
||||
};
|
||||
|
||||
function toUnderline(name: string): string {
|
||||
|
|
|
@ -116,7 +116,7 @@ import SettingLightIcon from '@/assets/assets-setting-light.svg';
|
|||
import SettingAutoIcon from '@/assets/assets-setting-auto.svg';
|
||||
|
||||
const LAYOUT_OPTION = ['side', 'top', 'mix'];
|
||||
const COLOR_OPTIONS = ['default', 'purple', 'cyan', 'green', 'yellow', 'orange', 'red', 'pink', 'dynamic'];
|
||||
const COLOR_OPTIONS = ['default', 'cyan', 'green', 'yellow', 'orange', 'red', 'pink', 'purple', 'dynamic'];
|
||||
const MODE_OPTIONS = [
|
||||
{ type: 'light', text: '明亮' },
|
||||
{ type: 'dark', text: '暗黑' },
|
||||
|
|
|
@ -87,6 +87,7 @@ const actions = {
|
|||
if (theme !== state.mode) {
|
||||
document.documentElement.setAttribute('theme-mode', isDarkMode ? 'dark' : '');
|
||||
}
|
||||
|
||||
commit('changeChartColor', isDarkMode ? DARK_CHART_COLORS : LIGHT_CHART_COLORS);
|
||||
},
|
||||
changeBrandTheme({ state }: { state: IStateType }, payload: IStateType) {
|
||||
|
|
|
@ -1,15 +1,14 @@
|
|||
:root[theme-color='green'] {
|
||||
--td-brand-color: #00a870;
|
||||
--td-brand-color-1: #8dffd9;
|
||||
--td-brand-color-2: #00f2a2;
|
||||
--td-brand-color-3: #00dc92;
|
||||
--td-brand-color-4: #00c583;
|
||||
--td-brand-color-1: #e8f8f2;
|
||||
--td-brand-color-2: #bcebdc;
|
||||
--td-brand-color-3: #85dbbe;
|
||||
--td-brand-color-4: #48c79c;
|
||||
--td-brand-color-5: #00a870;
|
||||
--td-brand-color-6: #009a5d;
|
||||
--td-brand-color-7: #00c583;
|
||||
--td-brand-color-6: #078d5c;
|
||||
--td-brand-color-7: #067945;
|
||||
--td-brand-color-8: #00a870;
|
||||
--td-brand-color-9: #009a5d;
|
||||
--td-brand-color-10: #004a14;
|
||||
--td-brand-color-9: #044f2a;
|
||||
--td-brand-color-10: #033017;
|
||||
}
|
||||
|
||||
:root[theme-color='green'][theme-mode='dark'] {
|
||||
|
|
|
@ -15,13 +15,13 @@
|
|||
|
||||
:root[theme-color='orange'][theme-mode='dark'] {
|
||||
--td-brand-color: #ed7b2f;
|
||||
--td-brand-color-1: #7f0a02;
|
||||
--td-brand-color-2: #9b1804;
|
||||
--td-brand-color-3: #b62a07;
|
||||
--td-brand-color-4: #d03e0b;
|
||||
--td-brand-color-5: #e75510;
|
||||
--td-brand-color-6: #ed7b2f;
|
||||
--td-brand-color-7: #d03e0b;
|
||||
--td-brand-color-1: #692204;
|
||||
--td-brand-color-2: #873105;
|
||||
--td-brand-color-3: #a24006;
|
||||
--td-brand-color-4: #c25110;
|
||||
--td-brand-color-5: #d66724;
|
||||
--td-brand-color-6: #ed8139;
|
||||
--td-brand-color-7: #ff9852;
|
||||
--td-brand-color-8: #ed7b2f;
|
||||
--td-brand-color-9: #ed7b2f;
|
||||
--td-brand-color-10: #fce5d7;
|
||||
|
|
|
@ -13,15 +13,15 @@
|
|||
}
|
||||
|
||||
:root[theme-color='pink'][theme-mode='dark'] {
|
||||
--td-brand-color: #f172c5;
|
||||
--td-brand-color-1: #8f025e;
|
||||
--td-brand-color-2: #ac0572;
|
||||
--td-brand-color-3: #ca0987;
|
||||
--td-brand-color-4: #e80f9d;
|
||||
--td-brand-color-5: #ed49b4;
|
||||
--td-brand-color-6: #f172c5;
|
||||
--td-brand-color-7: #ed49b4;
|
||||
--td-brand-color-8: #f172c5;
|
||||
--td-brand-color-9: #f491d2;
|
||||
--td-brand-color-10: #fce5f4;
|
||||
--td-brand-color: #ff70cf;
|
||||
--td-brand-color-1: #5b374f;
|
||||
--td-brand-color-2: #9b066d;
|
||||
--td-brand-color-3: #bc088a;
|
||||
--td-brand-color-4: #d435a0;
|
||||
--td-brand-color-5: #ed53b7;
|
||||
--td-brand-color-6: #ff70cf;
|
||||
--td-brand-color-7: #ff99e4;
|
||||
--td-brand-color-8: #ff70cf;
|
||||
--td-brand-color-9: #ffdbfd;
|
||||
--td-brand-color-10: #fff2ff;
|
||||
}
|
||||
|
|
|
@ -13,15 +13,15 @@
|
|||
}
|
||||
|
||||
:root[theme-color='red'][theme-mode='dark'] {
|
||||
--td-brand-color: #ea7b84;
|
||||
--td-brand-color-1: #8d0309;
|
||||
--td-brand-color-2: #ac0911;
|
||||
--td-brand-color-3: #cc111c;
|
||||
--td-brand-color-4: #e42c3a;
|
||||
--td-brand-color-5: #e34d59;
|
||||
--td-brand-color-6: #ea7b84;
|
||||
--td-brand-color-7: #e34d59;
|
||||
--td-brand-color-8: #ea7b84;
|
||||
--td-brand-color-9: #ef989f;
|
||||
--td-brand-color-10: #fbe5e7;
|
||||
--td-brand-color: #fb6e77;
|
||||
--td-brand-color-1: #4f3335;
|
||||
--td-brand-color-2: #960627;
|
||||
--td-brand-color-3: #b01c37;
|
||||
--td-brand-color-4: #c9384a;
|
||||
--td-brand-color-5: #e35661;
|
||||
--td-brand-color-6: #fb6e77;
|
||||
--td-brand-color-7: #ff9195;
|
||||
--td-brand-color-8: #fb6e77;
|
||||
--td-brand-color-9: #ffd6d8;
|
||||
--td-brand-color-10: #fff2f2;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue
Block a user