90 lines
2.6 KiB
Plaintext
90 lines
2.6 KiB
Plaintext
:root,
|
|
:root[theme-mode="light"] {
|
|
|
|
--oak-color-primary: #0052d9;
|
|
--oak-color-error: #e34d59;
|
|
--oak-color-warning: #ed7b2f;
|
|
--oak-color-success: #00a870;
|
|
--oak-color-info: #d4e3fc;
|
|
|
|
|
|
--oak-bg-color-page: #eee;
|
|
--oak-bg-color-container: #ffffff;
|
|
--oak-bg-color-component: #e7e7e7;
|
|
|
|
|
|
--oak-text-color-primary: rgba(0, 0, 0, 0.9);
|
|
--oak-text-color-secondary: rgba(0, 0, 0, 0.6);
|
|
--oak-text-color-placeholder: rgba(0, 0, 0, 0.4);
|
|
--oak-text-color-disabled: rgba(0, 0, 0, 0.26);
|
|
|
|
--oak-border-color: #e7e7e7;
|
|
}
|
|
|
|
// 黑暗主题色
|
|
:root[theme-mode="dark"] {
|
|
--oak-color-primary: #4582e6;
|
|
--oak-color-error: #c64751;
|
|
--oak-color-warning: #cf6e2d;
|
|
--oak-color-success: #059465;
|
|
--oak-color-info: #173463;
|
|
|
|
--oak-bg-color-page: #181818;
|
|
--oak-bg-color-container: #242424;
|
|
--oak-bg-color-component: #383838;
|
|
|
|
--oak-text-color-primary: #ffffff;
|
|
--oak-text-color-secondary: rgba(255, 255, 255, 0.55);
|
|
--oak-text-color-placeholder: rgba(255, 255, 255, 0.35);
|
|
--oak-text-color-disabled: rgba(255, 255, 255, 0.22);
|
|
|
|
--oak-border-color: #383838;
|
|
}
|
|
|
|
:root {
|
|
--oak-radius-small: 2px;
|
|
--oak-radius-default: 3px;
|
|
--oak-radius-medium: 6px;
|
|
--oak-radius-large: 9px;
|
|
--oak-radius-extraLarge: 12px;
|
|
--oak-radius-round: 999px;
|
|
--oak-radius-circle: 50%;
|
|
}
|
|
|
|
:root {
|
|
--oak-font-family: PingFang SC, Microsoft YaHei, Arial Regular;
|
|
--oak-font-family-medium: PingFang SC, Microsoft YaHei, Arial Medium;
|
|
--oak-font-size-link-small: 12px;
|
|
--oak-font-size-link-medium: 14px;
|
|
--oak-font-size-link-large: 16px;
|
|
--oak-font-size-mark-small: 12px;
|
|
--oak-font-size-mark-medium: 14px;
|
|
--oak-font-size-body-small: 12px;
|
|
--oak-font-size-body-medium: 14px;
|
|
--oak-font-size-body-large: 16px;
|
|
--oak-font-size-title-small: 14px;
|
|
--oak-font-size-title-medium: 16px;
|
|
--oak-font-size-title-large: 20px;
|
|
--oak-font-size-headline-small: 24px;
|
|
--oak-font-size-headline-medium: 28px;
|
|
--oak-font-size-headline-large: 36px;
|
|
--oak-font-size-display-medium: 48px;
|
|
--oak-font-size-display-large: 64px;
|
|
--oak-line-height-link-small: 20px;
|
|
--oak-line-height-link-medium: 22px;
|
|
--oak-line-height-link-large: 24px;
|
|
--oak-line-height-mark-small: 20px;
|
|
--oak-line-height-mark-medium: 22px;
|
|
--oak-line-height-body-small: 20px;
|
|
--oak-line-height-body-medium: 22px;
|
|
--oak-line-height-body-large: 24px;
|
|
--oak-line-height-title-small: 22px;
|
|
--oak-line-height-title-medium: 24px;
|
|
--oak-line-height-title-large: 28px;
|
|
--oak-line-height-headline-small: 32px;
|
|
--oak-line-height-headline-medium: 36px;
|
|
--oak-line-height-headline-large: 44px;
|
|
--oak-line-height-display-medium: 56px;
|
|
--oak-line-height-display-large: 72px;
|
|
|
|
} |