github_mirrors/vue-vben-admin
1
0
Fork 0
mirror of https://github.com/vbenjs/vue-vben-admin.git synced 2025-01-24 10:33:50 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

fix(vxe-table): theme dark is not work (#3239)

Browse Source
This commit is contained in:
zhang 2023-11-06 18:24:23 +08:00 committed by GitHub
parent b6f8379e93
commit 031d613b18
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 55 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/VxeTable/src/css/component.scss
View File

@ -52,7 +52,6 @@
& > .ant-input-number,
& > .ant-cascader-picker .ant-cascader-input,
& > .ant-calendar-picker .ant-calendar-picker-input {
// border-color: $vxe-table-validate-error-color;
box-shadow: none;
}
}

1
src/components/VxeTable/src/css/index.scss
View File

@ -1,6 +1,5 @@
@import './common';
@import './variable';
@import './scrollbar';
@import './toolbar';
@import './component';
@import 'vxe-table/styles/index';

29
src/components/VxeTable/src/css/scrollbar.scss
View File

@ -1,29 +0,0 @@
.vxe-grid_scrollbar {
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background-color: #fff;
}
::-webkit-scrollbar-thumb {
border: 1px solid #f1f1f1;
border-radius: 5px;
background-color: rgb(0 0 0 / 10%);
box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
}
::-webkit-scrollbar-thumb:hover {
background-color: #a8a8a8;
}
::-webkit-scrollbar-thumb:active {
background-color: #a8a8a8;
}
::-webkit-scrollbar-corner {
background-color: #fff;
}
}

2
src/components/VxeTable/src/css/toolbar.scss
View File

@ -22,5 +22,5 @@
.vxe-toolbar .vxe-tools--wrapper,
.vxe-toolbar .vxe-tools--operate .vxe-custom--wrapper .vxe-button {
margin-left: 1px;
margin-left: 10px;
}

60
src/components/VxeTable/src/css/variable.scss
View File

@ -1,6 +1,54 @@
$vxe-primary-color: rgb(9 96 189) !default;
$vxe-table-row-current-background-color: rgb(9 96 189 / 30%);
$vxe-table-row-hover-current-background-color: rgb(9 96 189 / 20%);
$vxe-table-column-hover-background-color: rgb(9 96 189 / 30%);
$vxe-table-column-current-background-color: rgb(9 96 189 / 20%);
$vxe-table-validate-error-color: #f56c6c;
/* stylelint-disable scss/no-global-function-names */
html[data-theme='dark'] {
// $bg-color: #151515;
// $tooltip-bg-color: #303133;
// $text-color: #c9d1d9;
// $border-color: #303030;
// $selected-bg-color: #1e1e1e;
// $striped-bg-color: #1e1e1e;
--vxe-form-background-color: #151515;
--vxe-toolbar-background-color: #151515;
--vxe-pager-background-color: #151515;
--vxe-button-default-background-color: lighten(#151515, 15%);
--vxe-table-header-background-color: lighten(#151515, 5%);
--vxe-font-color: darken(#c9d1d9, 12%);
--vxe-table-header-font-color: #c9d1d9;
--vxe-table-footer-font-color: #c9d1d9;
--vxe-table-body-background-color: #151515;
--vxe-table-footer-background-color: #151515;
--vxe-table-row-striped-background-color: #1e1e1e;
--vxe-table-border-color: #303030;
--vxe-table-row-hover-background-color: #1e1e1e;
--vxe-table-row-hover-striped-background-color: darken(#1e1e1e, 10%);
--vxe-table-row-current-background-color: fade(#1e1e1e, 20%);
--vxe-table-row-hover-current-background-color: fade(#1e1e1e, 20%);
--vxe-table-column-hover-background-color: fade(#1e1e1e, 20%);
--vxe-table-column-current-background-color: fade(#1e1e1e, 20%);
--vxe-table-row-checkbox-checked-background-color: fade(#1e1e1e, 15%);
--vxe-table-row-hover-checkbox-checked-background-color: fade(#1e1e1e, 20%);
--vxe-table-menu-background-color: lighten(#303133, 10%);
--vxe-table-filter-panel-background-color: lighten(#151515, 5%);
--vxe-grid-maximize-background-color: #151515;
--vxe-pager-perfect-background-color: #151515;
--vxe-pager-perfect-button-background-color: lighten(#151515, 15%);
--vxe-input-background-color: #151515;
--vxe-input-border-color: #303030;
--vxe-select-panel-background-color: #151515;
--vxe-table-popup-border-color: #303030;
--vxe-select-option-hover-background-color: lighten(#1e1e1e, 15%);
--vxe-pulldown-panel-background-color: #151515;
--vxe-table-fixed-left-scrolling-box-shadow: 8px 0px 10px -5px rgb(255 255 255 / 12%);
--vxe-table-fixed-right-scrolling-box-shadow: -8px 0px 10px -5px rgb(255 255 255 / 12%);
--vxe-loading-background-color: rgb(0 0 0 / 50%);
--vxe-tooltip-dark-background-color: lighten(#303133, 25%);
--vxe-modal-header-background-color: #1e1e1e;
--vxe-modal-body-background-color: #303133;
--vxe-modal-border-color: #303030;
--vxe-toolbar-panel-background-color: #151515;
--vxe-input-disabled-color: lighten(#1e1e1e, 20%);
--vxe-input-disabled-background-color: lighten(#1e1e1e, 25%);
--vxe-checkbox-icon-background-color: lighten(#1e1e1e, 15%);
--vxe-checkbox-checked-icon-border-color: #303030;
--vxe-checkbox-indeterminate-icon-background-color: lighten(#1e1e1e, 15%);
}