style: ajust dark theme

This commit is contained in:
jialin
2025-04-28 10:05:06 +08:00
parent 60d0750695
commit 3fb3381a19
26 changed files with 275 additions and 222 deletions
+2 -90
View File
@@ -4,14 +4,6 @@
@import url('./overrides.less');
html {
// --font-family: 'noto sans', sans-serif;
// --ant-color-text-secondary: rgba(0, 0, 0, 65%);
// --ant-color-text-tertiary: rgba(0, 0, 0, 45%);
// --ant-color-text-quaternary: rgba(0, 0, 0, 25%);
// --ant-color-fill: rgba(223, 168, 168, 15%);
// --ant-color-fill-secondary: rgba(0, 0, 0, 6%);
// --ant-color-fill-tertiary: rgba(0, 0, 0, 4%);
// --ant-color-fill-quaternary: rgba(0, 0, 0, 2%);
--color-text-light-1: rgba(255, 255, 255, 90%);
--color-fill-1: var(--ant-color-bg-container);
--color-scrollbar-thumb: rgba(193, 193, 193, 80%);
@@ -71,22 +63,15 @@ html {
--ant-color-error: #ff4d4f;
--ant-box-shadow-secondary: 0 6px 16px 0 rgba(0, 0, 0, 8%),
0 3px 6px -4px rgba(0, 0, 0, 12%), 0 9px 28px 8px rgba(0, 0, 0, 5%);
// --table-cell-padding-inline: var(--ant-table-cell-padding-inline);
// --table-cell-padding-block: var(--ant-table-cell-padding-block);
// --table-header-border-radius: var(--ant-table-header-border-radius);
// --table-header-split-color: var(--ant-table-header-split-color);
// --table-row-selected-bg: var(--ant-table-row-selected-bg);
// --table-row-selected-hover-bg: var(--ant-table-row-selected-hover-bg);
// --table-row-hover-bg: var(--ant-table-row-hover-bg);
--color-chart-red: rgba(255, 77, 79, 80%);
--color-chart-green: rgb(84, 204, 152, 80%);
--color-chart-glod: rgba(250, 173, 20, 80%);
--seal-transition-func: cubic-bezier(0, 0, 1, 1);
--color-progress-green: rgba(84, 204, 152, 100%);
--color-green-fill-light: rgb(243 251 248);
--ant-rate-star-color: #fadb14;
--color-fill-mask: rgba(255, 255, 255, 60%);
--width-tooltip-max: 300px;
--color-bg-tooltip: '#fff';
// ======== input ============
--ant-input-active-shadow: 0 0 0 2px rgba(5, 255, 105, 6%);
--ant-input-active-border-color: #007bff;
@@ -97,63 +82,6 @@ html {
--ant-color-border: #d9d9d9;
--ant-line-type: solid;
--ant-line-width: 1px;
.css-var-rf {
--ant-font-size: var(--font-size-base);
}
.css-var-r0 {
--ant-font-size-sm: var(--font-size-base);
--ant-font-size-lg: var(--font-size-base);
--ant-font-size-xl: 20px;
--ant-font-size: var(--font-size-base);
// --ant-padding-sm: 14px;
// --ant-border-radius-lg: 4px;
// --ant-color-text: #000;
// --ant-color-error: #ff4d4f;
// --ant-color-bg-mask: rgba(0, 0, 0, 35%);
// --ant-color-border: blue;
&.ant-popover {
--ant-popover-inner-padding: 26px;
--ant-popover-title-margin-bottom: 22px;
}
&.ant-btn {
--ant-button-content-font-size-lg: 12px;
--ant-button-content-font-size: 12px;
--ant-button-content-font-size-sm: 12px;
}
&.ant-table-css-var {
// --ant-table-row-hover-bg: rgb(249 249 249);
}
&.ant-progress {
--ant-progress-line-border-radius: 2px;
}
&.ant-modal-css-var {
--ant-modal-title-font-size: 14px;
--ant-modal-header-margin-bottom: 20px;
--ant-modal-footer-margin-top: 30px;
--ant-modal-content-padding: 20px 24px 24px;
--ant-modal-title-color: var(--ant-color-text);
}
}
.css-var-rf.ant-menu-css-var,
.css-var-ri.ant-menu-css-var,
.css-var-rh.ant-menu-css-var {
--ant-menu-item-color: var(--ant-color-text);
}
.css-var-r0.ant-input-css-var {
--ant-input-input-font-size: var(--font-size-base);
--ant-input-input-font-size-lg: var(--font-size-base);
--ant-input-input-font-size-sm: var(--font-size-base);
--ant-input-padding-inline-lg: 14px;
}
}
html[data-theme='realDark'] {
@@ -163,6 +91,7 @@ html[data-theme='realDark'] {
--color-editor-dark: #141414;
--color-editor-light: #fafafa;
--color-fill-mask: rgba(255, 255, 255, 10%);
--color-bg-tooltip: #424242;
background: #141414;
}
@@ -334,10 +263,6 @@ body {
}
.ant-table-content table {
.ant-table-thead > tr > th {
// background-color: unset;
}
.ant-table-tbody {
.ant-table-row {
border-radius: var(--table-td-radius);
@@ -690,19 +615,6 @@ body {
z-index: 1;
}
.login-wrapper {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
min-height: 100vh;
z-index: -1;
background: url('@/assets/images/bg-2.png') center center no-repeat;
background-size: cover;
opacity: 0.6;
}
.ant-pro-page-container {
.ant-page-header-heading {
min-width: max-content;