vxe-table 4.4.1 → 4.4.2-beta.1

package/es/table/style.css

@@ -276,7 +276,7 @@
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
-  background-color: rgba(255, 255, 255, 0.5);
+  background-color: var(--vxe-loading-background-color);
 }
 .vxe-loading.is--visible {
   display: block;
@@ -288,7 +288,7 @@
   left: 0;
   transform: translateY(-50%);
   text-align: center;
-  color: #409eff;
+  color: var(--vxe-loading-color);
 }
 .vxe-loading .vxe-loading--default-icon {
   font-size: 1.4em;
@@ -307,7 +307,7 @@
   width: 100%;
   height: 100%;
   border-radius: 50%;
-  background-color: #409eff;
+  background-color: var(--vxe-primary-color);
   opacity: 0.6;
   position: absolute;
   top: 0;
@@ -344,25 +344,25 @@
 .vxe-table--render-default .vxe-header--column.col--ellipsis,
 .vxe-table--render-default .vxe-body--column.col--ellipsis,
 .vxe-table--render-default .vxe-footer--column.col--ellipsis, .vxe-table--render-default.vxe-editable .vxe-body--column {
-  height: 48px;
+  height: --vxe-table-row-height-default;
 }
 
 .vxe-table--render-default.size--medium .vxe-header--column.col--ellipsis,
 .vxe-table--render-default.size--medium .vxe-body--column.col--ellipsis,
 .vxe-table--render-default.size--medium .vxe-footer--column.col--ellipsis, .vxe-table--render-default.vxe-editable.size--medium .vxe-body--column {
-  height: 44px;
+  height: --vxe-table-row-height-medium;
 }
 
 .vxe-table--render-default.size--small .vxe-header--column.col--ellipsis,
 .vxe-table--render-default.size--small .vxe-body--column.col--ellipsis,
 .vxe-table--render-default.size--small .vxe-footer--column.col--ellipsis, .vxe-table--render-default.vxe-editable.size--small .vxe-body--column {
-  height: 40px;
+  height: --vxe-table-row-height-small;
 }
 
 .vxe-table--render-default.size--mini .vxe-header--column.col--ellipsis,
 .vxe-table--render-default.size--mini .vxe-body--column.col--ellipsis,
 .vxe-table--render-default.size--mini .vxe-footer--column.col--ellipsis, .vxe-table--render-default.vxe-editable.size--mini .vxe-body--column {
-  height: 36px;
+  height: var(--vxe-table-row-height-mini);
 }
 
 .vxe-table-slots,
@@ -395,7 +395,7 @@
 .vxe-cell .vxe-default-textarea,
 .vxe-table--filter-wrapper .vxe-default-input,
 .vxe-table--filter-wrapper .vxe-default-textarea {
-  background-color: #ffffff;
+  background-color: var(--vxe-table-body-background-color);
 }
 .vxe-cell .vxe-default-input,
 .vxe-cell .vxe-default-textarea,
@@ -406,9 +406,9 @@
   outline: 0;
   padding: 0 2px;
   width: 100%;
-  color: #606266;
-  border-radius: 4px;
-  border: 1px solid #dcdfe6;
+  color: var(--vxe-table-font-color);
+  border-radius: var(--vxe-border-radius);
+  border: 1px solid var(--vxe-input-border-color);
 }
 .vxe-cell .vxe-default-input:focus,
 .vxe-cell .vxe-default-textarea:focus,
@@ -416,7 +416,7 @@
 .vxe-table--filter-wrapper .vxe-default-input:focus,
 .vxe-table--filter-wrapper .vxe-default-textarea:focus,
 .vxe-table--filter-wrapper .vxe-default-select:focus {
-  border: 1px solid #409eff;
+  border: 1px solid var(--vxe-primary-color);
 }
 .vxe-cell .vxe-default-input[disabled],
 .vxe-cell .vxe-default-textarea[disabled],
@@ -425,7 +425,7 @@
 .vxe-table--filter-wrapper .vxe-default-textarea[disabled],
 .vxe-table--filter-wrapper .vxe-default-select[disabled] {
   cursor: not-allowed;
-  background-color: #f3f3f3;
+  background-color: var(--vxe-input-disabled-background-color);
 }
 .vxe-cell .vxe-default-input,
 .vxe-cell .vxe-default-textarea,
@@ -433,7 +433,7 @@
 .vxe-table--filter-wrapper .vxe-default-input,
 .vxe-table--filter-wrapper .vxe-default-textarea,
 .vxe-table--filter-wrapper .vxe-default-select {
-  height: 34px;
+  height: var(--vxe-input-height-default);
 }
 .vxe-cell .vxe-default-input[type=date]::-webkit-inner-spin-button,
 .vxe-table--filter-wrapper .vxe-default-input[type=date]::-webkit-inner-spin-button {
@@ -445,11 +445,11 @@
   height: 24px;
 }
 .vxe-cell .vxe-default-input::-moz-placeholder, .vxe-table--filter-wrapper .vxe-default-input::-moz-placeholder {
-  color: #C0C4CC;
+  color: var(--vxe-input-placeholder-color);
 }
 .vxe-cell .vxe-default-input::placeholder,
 .vxe-table--filter-wrapper .vxe-default-input::placeholder {
-  color: #C0C4CC;
+  color: var(--vxe-input-placeholder-color);
 }
 .vxe-cell .vxe-default-textarea,
 .vxe-table--filter-wrapper .vxe-default-textarea {
@@ -508,7 +508,7 @@
   border-right: 0;
 }
 .vxe-table--fixed-left-wrapper .vxe-table--cell-copy-area[half="1"] {
-  background-size: 3px 12px, 0 12px, 12px 3px, 12px 3px;
+  background-size: var(--vxe-table-cell-copy-area-border-width) 12px, 0 12px, 12px var(--vxe-table-cell-copy-area-border-width), 12px var(--vxe-table-cell-copy-area-border-width);
 }
 
 .vxe-table--fixed-right-wrapper .vxe-table--cell-main-area[half="1"],
@@ -517,13 +517,13 @@
   border-left: 0;
 }
 .vxe-table--fixed-right-wrapper .vxe-table--cell-copy-area[half="1"] {
-  background-size: 0 12px, 3px 12px, 12px 3px, 12px 3px;
+  background-size: 0 12px, var(--vxe-table-cell-copy-area-border-width) 12px, 12px var(--vxe-table-cell-copy-area-border-width), 12px var(--vxe-table-cell-copy-area-border-width);
 }
 
 /*复选框-范围选择*/
 .vxe-table--checkbox-range {
-  background-color: rgba(50, 128, 252, 0.2);
-  border: 1px solid #006af1;
+  background-color: var(--vxe-table-checkbox-range-background-color);
+  border: var(--vxe-table-checkbox-range-border-width) solid var(--vxe-table-checkbox-range-border-color);
 }
 
 .vxe-table--cell-area {
@@ -532,8 +532,8 @@
   display: none;
 }
 .vxe-table--cell-area > .vxe-table--cell-main-area {
-  background-color: rgba(64, 158, 255, 0.2);
-  border: 1px solid #409eff;
+  background-color: var(--vxe-table-cell-area-background-color);
+  border: var(--vxe-table-cell-area-border-width) solid var(--vxe-table-cell-area-border-color);
 }
 .vxe-table--cell-area .vxe-table--cell-main-area-btn {
   display: none;
@@ -543,14 +543,14 @@
   width: 7px;
   height: 7px;
   border-style: solid;
-  border-color: #fff;
+  border-color: var(--vxe-table-cell-main-area-extension-border-color);
   border-width: 1px 0 0 1px;
-  background-color: #409eff;
+  background-color: var(--vxe-table-cell-main-area-extension-background-color);
   pointer-events: auto;
   cursor: crosshair;
 }
 .vxe-table--cell-area .vxe-table--cell-extend-area {
-  border: 2px solid #409eff;
+  border: var(--vxe-table-cell-extend-area-border-width) solid var(--vxe-table-cell-extend-area-border-color);
 }
 
 @keyframes moveCopyCellBorder {
@@ -566,48 +566,48 @@
 }
 
 .vxe-table--cell-active-area {
-  border: 2px solid #409eff;
+  border: var(--vxe-table-cell-active-area-border-width) solid var(--vxe-table-cell-active-area-border-color);
 }
 
 .vxe-table--cell-multi-area > .vxe-table--cell-main-area {
-  background-color: rgba(64, 158, 255, 0.2);
+  background-color: var(--vxe-table-cell-area-background-color);
 }
 
 /*圆角*/
 .vxe-table--render-default.is--round:not(.is--header):not(.is--footer) .vxe-table--body-wrapper.body--wrapper, .vxe-table--render-default.is--round .vxe-table--border-line, .vxe-table--render-default.is--round .vxe-table--render-default.is--round {
-  border-radius: 4px;
+  border-radius: var(--vxe-table-border-radius);
 }
 .vxe-table--render-default.is--round.is--footer:not(.is--header) .vxe-table--body-wrapper.body--wrapper, .vxe-table--render-default.is--round.is--header .vxe-table--header-wrapper.body--wrapper {
-  border-radius: 4px 4px 0 0;
+  border-radius: var(--vxe-table-border-radius) var(--vxe-table-border-radius) 0 0;
 }
 .vxe-table--render-default.is--round.is--header .vxe-table--header-wrapper.fixed-left--wrapper {
-  border-radius: 4px 0 0 0;
+  border-radius: var(--vxe-table-border-radius) 0 0 0;
 }
 .vxe-table--render-default.is--round.is--header .vxe-table--header-wrapper.fixed-right--wrapper {
-  border-radius: 0 4px 0 0;
+  border-radius: 0 var(--vxe-table-border-radius) 0 0;
 }
 .vxe-table--render-default.is--round.is--footer .vxe-table--footer-wrapper.body--wrapper, .vxe-table--render-default.is--round.is--header:not(.is--footer) .vxe-table--body-wrapper.body--wrapper {
-  border-radius: 0 0 4px 4px;
+  border-radius: 0 0 var(--vxe-table-border-radius) var(--vxe-table-border-radius);
 }
 .vxe-table--render-default.is--round.is--footer .vxe-table--footer-wrapper.fixed-left--wrapper, .vxe-table--render-default.is--round.is--footer:not(.is--header) .vxe-table--body-wrapper.fixed-left--wrapper, .vxe-table--render-default.is--round.is--header:not(.is--footer) .vxe-table--body-wrapper.fixed-left--wrapper {
-  border-radius: 0 0 0 4px;
+  border-radius: 0 0 0 var(--vxe-table-border-radius);
 }
 .vxe-table--render-default.is--round.is--footer .vxe-table--footer-wrapper.fixed-right--wrapper, .vxe-table--render-default.is--round.is--footer:not(.is--header) .vxe-table--body-wrapper.fixed-right--wrapper, .vxe-table--render-default.is--round.is--header:not(.is--footer) .vxe-table--body-wrapper.fixed-right--wrapper {
-  border-radius: 0 0 4px 0;
+  border-radius: 0 0 var(--vxe-table-border-radius) 0;
 }
 /*header*/
 .vxe-table {
   /*排序*/
 }
 .vxe-table .vxe-table--header-wrapper {
-  color: #606266;
+  color: var(--vxe-table-header-font-color);
 }
 .vxe-table .vxe-table--header-wrapper .vxe-table--header-border-line {
   position: absolute;
   left: 0;
   bottom: 0;
   height: 0;
-  border-bottom: 1px solid #e8eaec;
+  border-bottom: var(--vxe-table-border-width) solid var(--vxe-table-border-color);
 }
 .vxe-table .vxe-cell--sort {
   width: 1.5em;
@@ -621,7 +621,7 @@
 .vxe-table .vxe-sort--desc-btn {
   position: absolute;
   left: 0.2em;
-  color: #c0c4cc;
+  color: var(--vxe-table-column-icon-border-color);
   width: 1em;
   text-align: center;
   height: 0.8em;
@@ -630,11 +630,11 @@
 }
 .vxe-table .vxe-sort--asc-btn:hover,
 .vxe-table .vxe-sort--desc-btn:hover {
-  color: #606266;
+  color: var(--vxe-table-font-color);
 }
 .vxe-table .vxe-sort--asc-btn.sort--active,
 .vxe-table .vxe-sort--desc-btn.sort--active {
-  color: #409eff;
+  color: var(--vxe-primary-color);
 }
 .vxe-table .vxe-sort--asc-btn {
   top: -0.1em;
@@ -645,7 +645,7 @@
 
 .vxe-header--column {
   position: relative;
-  font-weight: 700;
+  font-weight: var(--vxe-table-header-font-weight);
 }
 .vxe-header--column.col--ellipsis > .vxe-cell {
   display: flex;
@@ -661,11 +661,11 @@
 }
 .vxe-header--column .vxe-cell--required-icon {
   display: inline-block;
-  color: #f56c6c;
+  color: var(--vxe-table-validate-error-color);
   width: 0.8em;
   height: 1em;
   line-height: 1em;
-  font-family: Verdana, Arial, Tahoma;
+  font-family: var(--vxe-icon-font-family);
   font-weight: normal;
   position: relative;
 }
@@ -703,7 +703,7 @@
 .vxe-header--column .vxe-resizable.is--line:before {
   width: 1px;
   height: 50%;
-  background-color: #D9DDDF;
+  background-color: var(--vxe-table-resizable-line-color);
 }
 .vxe-header--column .vxe-resizable.is--line:after {
   width: 0;
@@ -718,9 +718,9 @@
 /*table*/
 .vxe-table--render-default {
   position: relative;
-  font-size: 14px;
-  color: #606266;
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  font-size: var(--vxe-font-size);
+  color: var(--vxe-table-font-color);
+  font-family: var(--vxe-font-family);
   direction: ltr;
   /*边框*/
   /*列宽线*/
@@ -735,10 +735,10 @@
   /*可编辑*/
 }
 .vxe-table--render-default .vxe-table--body-wrapper {
-  background-color: #ffffff;
+  background-color: var(--vxe-table-body-background-color);
 }
 .vxe-table--render-default .vxe-table--footer-wrapper {
-  background-color: #ffffff;
+  background-color: var(--vxe-table-footer-background-color);
 }
 .vxe-table--render-default .vxe-table--header,
 .vxe-table--render-default .vxe-table--body,
@@ -757,31 +757,31 @@
   overflow-x: scroll;
 }
 .vxe-table--render-default .vxe-body--row.row--stripe {
-  background-color: #fafafa;
+  background-color: var(--vxe-table-row-striped-background-color);
 }
 .vxe-table--render-default .vxe-body--row.row--radio {
-  background-color: #fff3e0;
+  background-color: var(--vxe-table-row-radio-checked-background-color);
 }
 .vxe-table--render-default .vxe-body--row.row--checked {
-  background-color: #fff3e0;
+  background-color: var(--vxe-table-row-checkbox-checked-background-color);
 }
 .vxe-table--render-default .vxe-body--row.row--current {
-  background-color: #e6f7ff;
+  background-color: var(--vxe-table-row-current-background-color);
 }
 .vxe-table--render-default .vxe-body--row.row--hover {
-  background-color: #f5f7fa;
+  background-color: var(--vxe-table-row-hover-background-color);
 }
 .vxe-table--render-default .vxe-body--row.row--hover.row--stripe {
-  background-color: #f5f7fa;
+  background-color: var(--vxe-table-row-hover-striped-background-color);
 }
 .vxe-table--render-default .vxe-body--row.row--hover.row--radio {
-  background-color: #ffebbc;
+  background-color: var(--vxe-table-row-hover-radio-checked-background-color);
 }
 .vxe-table--render-default .vxe-body--row.row--hover.row--checked {
-  background-color: #ffebbc;
+  background-color: var(--vxe-table-row-hover-checkbox-checked-background-color);
 }
 .vxe-table--render-default .vxe-body--row.row--hover.row--current {
-  background-color: #d7effb;
+  background-color: var(--vxe-table-row-hover-current-background-color);
 }
 .vxe-table--render-default.drag--resize .vxe-table--main-wrapper *,
 .vxe-table--render-default.drag--resize .vxe-table--fixed-left-wrapper *,
@@ -801,7 +801,7 @@
   cursor: crosshair;
 }
 .vxe-table--render-default.column--highlight .vxe-header--column:not(.col--seq):hover {
-  background-color: #d7effb;
+  background-color: var(--vxe-table-column-hover-background-color);
 }
 .vxe-table--render-default.cell--area .vxe-table--main-wrapper {
   -webkit-user-select: none;
@@ -812,18 +812,18 @@
 .vxe-table--render-default .vxe-body--column,
 .vxe-table--render-default .vxe-footer--column {
   position: relative;
-  line-height: 22px;
+  line-height: var(--vxe-table-row-line-height);
   text-align: left;
 }
 .vxe-table--render-default .vxe-header--column:not(.col--ellipsis),
 .vxe-table--render-default .vxe-body--column:not(.col--ellipsis),
 .vxe-table--render-default .vxe-footer--column:not(.col--ellipsis) {
-  padding: 13px 0;
+  padding: var(--vxe-table-column-padding-default);
 }
 .vxe-table--render-default .vxe-header--column.col--current,
 .vxe-table--render-default .vxe-body--column.col--current,
 .vxe-table--render-default .vxe-footer--column.col--current {
-  background-color: #e6f7ff;
+  background-color: var(--vxe-table-column-current-background-color);
 }
 .vxe-table--render-default .vxe-header--column.col--center,
 .vxe-table--render-default .vxe-body--column.col--center,
@@ -849,10 +849,10 @@
           user-select: none;
 }
 .vxe-table--render-default .vxe-table--footer-wrapper {
-  border-top: 1px solid #e8eaec;
+  border-top: var(--vxe-table-border-width) solid var(--vxe-table-border-color);
 }
 .vxe-table--render-default.border--default .vxe-table--header-wrapper, .vxe-table--render-default.border--full .vxe-table--header-wrapper, .vxe-table--render-default.border--outer .vxe-table--header-wrapper {
-  background-color: #f8f8f9;
+  background-color: var(--vxe-table-header-background-color);
 }
 .vxe-table--render-default.border--default .vxe-header--column,
 .vxe-table--render-default.border--default .vxe-body--column,
@@ -861,7 +861,7 @@
 .vxe-table--render-default.border--inner .vxe-footer--column {
   background-image: linear-gradient(#e8eaec, #e8eaec);
   background-repeat: no-repeat;
-  background-size: 100% 1px;
+  background-size: 100% var(--vxe-table-border-width);
   background-position: right bottom;
 }
 .vxe-table--render-default.border--full .vxe-header--column,
@@ -869,20 +869,20 @@
 .vxe-table--render-default.border--full .vxe-footer--column {
   background-image: linear-gradient(#e8eaec, #e8eaec), linear-gradient(#e8eaec, #e8eaec);
   background-repeat: no-repeat;
-  background-size: 1px 100%, 100% 1px;
+  background-size: var(--vxe-table-border-width) 100%, 100% var(--vxe-table-border-width);
   background-position: right top, right bottom;
 }
 .vxe-table--render-default.border--full .vxe-table--fixed-left-wrapper .vxe-body--column {
-  border-right-color: #e8eaec;
+  border-right-color: var(--vxe-table-border-color);
 }
 .vxe-table--render-default.border--default .vxe-table--header-wrapper .vxe-header--row:last-child .vxe-header--gutter, .vxe-table--render-default.border--full .vxe-table--header-wrapper .vxe-header--row:last-child .vxe-header--gutter, .vxe-table--render-default.border--outer .vxe-table--header-wrapper .vxe-header--row:last-child .vxe-header--gutter, .vxe-table--render-default.border--inner .vxe-table--header-wrapper .vxe-header--row:last-child .vxe-header--gutter {
   background-image: linear-gradient(#e8eaec, #e8eaec);
   background-repeat: no-repeat;
-  background-size: 100% 1px;
+  background-size: 100% var(--vxe-table-border-width);
   background-position: right bottom;
 }
 .vxe-table--render-default.border--inner .vxe-table--header-wrapper, .vxe-table--render-default.border--none .vxe-table--header-wrapper {
-  background-color: #f8f8f9;
+  background-color: var(--vxe-table-header-background-color);
 }
 .vxe-table--render-default.border--inner .vxe-table--fixed-left-wrapper, .vxe-table--render-default.border--none .vxe-table--fixed-left-wrapper {
   border-right: 0;
@@ -897,61 +897,61 @@
   display: none;
 }
 .vxe-table--render-default.size--medium {
-  font-size: 14px;
+  font-size: var(--vxe-font-size-medium);
 }
 .vxe-table--render-default.size--medium .vxe-table--empty-placeholder,
 .vxe-table--render-default.size--medium .vxe-table--empty-block {
-  min-height: 44px;
+  min-height: var(--vxe-table-row-height-medium);
 }
 .vxe-table--render-default.size--medium .vxe-header--column:not(.col--ellipsis),
 .vxe-table--render-default.size--medium .vxe-body--column:not(.col--ellipsis),
 .vxe-table--render-default.size--medium .vxe-footer--column:not(.col--ellipsis) {
-  padding: 11px 0;
+  padding: var(--vxe-table-column-padding-medium);
 }
 .vxe-table--render-default.size--medium .vxe-cell .vxe-default-input,
 .vxe-table--render-default.size--medium .vxe-cell .vxe-default-textarea,
 .vxe-table--render-default.size--medium .vxe-cell .vxe-default-select {
-  height: 32px;
+  height: var(--vxe-input-height-medium);
 }
 .vxe-table--render-default.size--medium .vxe-cell .vxe-default-input[type=date]::-webkit-inner-spin-button {
   margin-top: 3px;
 }
 .vxe-table--render-default.size--small {
-  font-size: 13px;
+  font-size: var(--vxe-font-size-small);
 }
 .vxe-table--render-default.size--small .vxe-table--empty-placeholder,
 .vxe-table--render-default.size--small .vxe-table--empty-block {
-  min-height: 40px;
+  min-height: var(--vxe-table-row-height-small);
 }
 .vxe-table--render-default.size--small .vxe-header--column:not(.col--ellipsis),
 .vxe-table--render-default.size--small .vxe-body--column:not(.col--ellipsis),
 .vxe-table--render-default.size--small .vxe-footer--column:not(.col--ellipsis) {
-  padding: 9px 0;
+  padding: var(--vxe-table-column-padding-small);
 }
 .vxe-table--render-default.size--small .vxe-cell .vxe-default-input,
 .vxe-table--render-default.size--small .vxe-cell .vxe-default-textarea,
 .vxe-table--render-default.size--small .vxe-cell .vxe-default-select {
-  height: 30px;
+  height: var(--vxe-input-height-small);
 }
 .vxe-table--render-default.size--small .vxe-cell .vxe-default-input[type=date]::-webkit-inner-spin-button {
   margin-top: 2px;
 }
 .vxe-table--render-default.size--mini {
-  font-size: 12px;
+  font-size: var(--vxe-font-size-mini);
 }
 .vxe-table--render-default.size--mini .vxe-table--empty-placeholder,
 .vxe-table--render-default.size--mini .vxe-table--empty-block {
-  min-height: 36px;
+  min-height: var(--vxe-table-row-height-mini);
 }
 .vxe-table--render-default.size--mini .vxe-header--column:not(.col--ellipsis),
 .vxe-table--render-default.size--mini .vxe-body--column:not(.col--ellipsis),
 .vxe-table--render-default.size--mini .vxe-footer--column:not(.col--ellipsis) {
-  padding: 7px 0;
+  padding: var(--vxe-table-column-padding-mini);
 }
 .vxe-table--render-default.size--mini .vxe-cell .vxe-default-input,
 .vxe-table--render-default.size--mini .vxe-cell .vxe-default-textarea,
 .vxe-table--render-default.size--mini .vxe-cell .vxe-default-select {
-  height: 28px;
+  height: var(--vxe-input-height-mini);
 }
 .vxe-table--render-default.size--mini .vxe-cell .vxe-default-input[type=date]::-webkit-inner-spin-button {
   margin-top: 1px;
@@ -959,11 +959,11 @@
 .vxe-table--render-default .vxe-cell {
   white-space: pre-line;
   word-break: break-all;
-  padding-left: 10px;
-  padding-right: 10px;
+  padding-left: var(--vxe-table-cell-padding-left);
+  padding-right: var(--vxe-table-cell-padding-right);
 }
 .vxe-table--render-default .vxe-cell--placeholder {
-  color: #C0C4CC;
+  color: var(--vxe-table-cell-placeholder-color);
 }
 .vxe-table--render-default .fixed--hidden {
   visibility: hidden;
@@ -994,13 +994,13 @@
   width: 200px;
 }
 .vxe-table--render-default .vxe-table--fixed-left-wrapper.scrolling--middle {
-  box-shadow: 8px 0px 10px -5px rgba(0, 0, 0, 0.12);
+  box-shadow: var(--vxe-table-fixed-left-scrolling-box-shadow);
 }
 .vxe-table--render-default .vxe-table--fixed-right-wrapper {
   right: 0;
 }
 .vxe-table--render-default .vxe-table--fixed-right-wrapper.scrolling--middle {
-  box-shadow: -8px 0px 10px -5px rgba(0, 0, 0, 0.12);
+  box-shadow: var(--vxe-table-fixed-right-scrolling-box-shadow);
 }
 .vxe-table--render-default .vxe-table--header-wrapper,
 .vxe-table--render-default .vxe-table--body-wrapper,
@@ -1049,7 +1049,7 @@
   content: "";
   display: block;
   height: 100%;
-  background-color: #409eff;
+  background-color: var(--vxe-table-resizable-drag-line-color);
 }
 .vxe-table--render-default .vxe-table--border-line {
   position: absolute;
@@ -1059,7 +1059,7 @@
   height: 100%;
   z-index: 10;
   pointer-events: none;
-  border: 1px solid #e8eaec;
+  border: var(--vxe-table-border-width) solid var(--vxe-table-border-color);
 }
 .vxe-table--render-default.is--tree-line .vxe-body--row:first-child .vxe-tree--line {
   border-width: 0 0 1px 0;
@@ -1078,8 +1078,8 @@
   bottom: -0.9em;
   width: 0.8em;
   border-width: 0 0 1px 1px;
-  border-style: dotted;
-  border-color: #909399;
+  border-style: var(--vxe-table-tree-node-line-style);
+  border-color: var(--vxe-table-tree-node-line-color);
   pointer-events: none;
 }
 .vxe-table--render-default .vxe-cell--tree-node {
@@ -1103,7 +1103,7 @@
   color: #939599;
 }
 .vxe-table--render-default .vxe-tree--node-btn:hover {
-  color: #606266;
+  color: var(--vxe-table-font-color);
 }
 .vxe-table--render-default .vxe-tree-cell {
   display: block;
@@ -1128,13 +1128,13 @@
   color: #939599;
 }
 .vxe-table--render-default .vxe-table--expanded .vxe-table--expand-btn:hover {
-  color: #606266;
+  color: var(--vxe-table-font-color);
 }
 .vxe-table--render-default .vxe-table--expanded + .vxe-table--expand-label {
   padding-left: 0.5em;
 }
 .vxe-table--render-default .vxe-body--expanded-column {
-  border-bottom: 1px solid #e8eaec;
+  border-bottom: var(--vxe-table-border-width) solid var(--vxe-table-border-color);
 }
 .vxe-table--render-default .vxe-body--expanded-column.col--ellipsis > .vxe-body--expanded-cell {
   overflow: hidden;
@@ -1151,44 +1151,44 @@
 .vxe-table--render-default .vxe-header--column.col--ellipsis > .vxe-cell,
 .vxe-table--render-default .vxe-body--column.col--ellipsis > .vxe-cell,
 .vxe-table--render-default .vxe-footer--column.col--ellipsis > .vxe-cell {
-  max-height: 48px;
+  max-height: var(--vxe-table-row-height-default);
 }
 .vxe-table--render-default.size--medium .vxe-header--column.col--ellipsis > .vxe-cell,
 .vxe-table--render-default.size--medium .vxe-body--column.col--ellipsis > .vxe-cell,
 .vxe-table--render-default.size--medium .vxe-footer--column.col--ellipsis > .vxe-cell {
-  max-height: 44px;
+  max-height: var(--vxe-table-row-height-medium);
 }
 .vxe-table--render-default.size--medium .vxe-cell--checkbox {
-  font-size: 14px;
+  font-size: var(--vxe-checkbox-font-size-medium);
 }
 .vxe-table--render-default.size--medium .vxe-cell--radio {
-  font-size: 14px;
+  font-size: var(--vxe-radio-font-size-medium);
 }
 .vxe-table--render-default.size--small .vxe-header--column.col--ellipsis > .vxe-cell,
 .vxe-table--render-default.size--small .vxe-body--column.col--ellipsis > .vxe-cell,
 .vxe-table--render-default.size--small .vxe-footer--column.col--ellipsis > .vxe-cell {
-  max-height: 40px;
+  max-height: var(--vxe-table-row-height-small);
 }
 .vxe-table--render-default.size--small .vxe-cell--checkbox {
-  font-size: 13px;
+  font-size: var(--vxe-checkbox-font-size-small);
 }
 .vxe-table--render-default.size--small .vxe-cell--radio {
-  font-size: 13px;
+  font-size: var(--vxe-radio-font-size-small);
 }
 .vxe-table--render-default.size--mini .vxe-header--column.col--ellipsis > .vxe-cell,
 .vxe-table--render-default.size--mini .vxe-body--column.col--ellipsis > .vxe-cell,
 .vxe-table--render-default.size--mini .vxe-footer--column.col--ellipsis > .vxe-cell {
-  max-height: 36px;
+  max-height: var(--vxe-table-row-height-mini);
 }
 .vxe-table--render-default.size--mini .vxe-cell--checkbox {
-  font-size: 12px;
+  font-size: var(--vxe-checkbox-font-size-mini);
 }
 .vxe-table--render-default.size--mini .vxe-cell--radio {
-  font-size: 12px;
+  font-size: var(--vxe-radio-font-size-mini);
 }
 .vxe-table--render-default .vxe-table--empty-placeholder,
 .vxe-table--render-default .vxe-table--empty-block {
-  min-height: 48px;
+  min-height: var(--vxe-table-row-height-default);
   justify-content: center;
   align-items: center;
   text-align: center;
@@ -1216,7 +1216,7 @@
   display: flex;
 }
 .vxe-table--render-default .vxe-body--column.col--selected {
-  box-shadow: inset 0px 0px 0px 2px #409eff;
+  box-shadow: inset 0px 0px 0px 2px var(--vxe-primary-color);
 }
 .vxe-table--render-default .vxe-body--column.col--actived, .vxe-table--render-default .vxe-body--column.col--selected {
   position: relative;
@@ -1233,19 +1233,19 @@
 }
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-cell--valid .vxe-cell--valid-msg {
   display: inline-block;
-  border-radius: 4px;
+  border-radius: var(--vxe-border-radius);
   padding: 8px 12px;
-  color: #fff;
-  background-color: #f56c6c;
+  color: var(--vxe-table-validate-tooltip-error-color);
+  background-color: var(--vxe-table-validate-tooltip-error-background-color);
   pointer-events: auto;
 }
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-default-input,
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-default-textarea,
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-default-select {
-  border-color: #f56c6c;
+  border-color: var(--vxe-table-validate-error-color);
 }
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-input > .vxe-input--inner {
-  border-color: #f56c6c;
+  border-color: var(--vxe-table-validate-error-color);
 }
 .vxe-table--render-default .vxe-body--row:first-child .vxe-cell--valid {
   bottom: auto;
@@ -1264,9 +1264,9 @@
   top: -5px;
   left: -5px;
   position: absolute;
-  border-width: 5px;
+  border-width: var(--vxe-table-cell-dirty-width);
   border-style: solid;
-  border-color: transparent #19A15F transparent transparent;
+  border-color: transparent var(--vxe-table-cell-dirty-insert-color) transparent transparent;
   transform: rotate(45deg);
 }
 .vxe-table--render-default .vxe-body--column.col--dirty {
@@ -1277,16 +1277,16 @@
   top: -5px;
   left: -5px;
   position: absolute;
-  border-width: 5px;
+  border-width: var(--vxe-table-cell-dirty-width);
   border-style: solid;
-  border-color: transparent #f56c6c transparent transparent;
+  border-color: transparent var(--vxe-table-cell-dirty-update-color) transparent transparent;
   transform: rotate(45deg);
 }
 .vxe-table--render-default.vxe-editable.cell--highlight .vxe-body--column.col--actived {
-  box-shadow: inset 0px 0px 0px 2px #409eff;
+  box-shadow: inset 0px 0px 0px 2px var(--vxe-primary-color);
 }
 .vxe-table--render-default.vxe-editable.cell--highlight .vxe-body--column.col--actived.col--valid-error {
-  box-shadow: inset 0px 0px 0px 2px #f56c6c;
+  box-shadow: inset 0px 0px 0px 2px var(--vxe-table-validate-error-color);
 }
 .vxe-table--render-default.vxe-editable.cell--highlight .vxe-body--column.col--actived .vxe-cell .vxe-default-input,
 .vxe-table--render-default.vxe-editable.cell--highlight .vxe-body--column.col--actived .vxe-cell .vxe-default-textarea {
@@ -1294,14 +1294,14 @@
   padding: 0;
 }
 .vxe-table--render-default.vxe-editable.cell--highlight .vxe-body--column.col--actived .vxe-cell .vxe-default-input {
-  height: 22px;
+  height: var(--vxe-table-row-line-height);
 }
 .vxe-table--render-default.vxe-editable.cell--highlight .vxe-body--column.col--actived .vxe-cell .vxe-input .vxe-input--inner {
   border: 0;
   padding-left: 0;
 }
 .vxe-table--render-default.vxe-editable.cell--highlight .vxe-body--column.col--actived .vxe-cell .vxe-textarea {
-  height: 21px;
+  height: var(--vxe-table-row-line-height)-1;
 }
 .vxe-table--render-default.vxe-editable.cell--highlight .vxe-body--column.col--actived .vxe-cell .vxe-textarea .vxe-textarea--inner {
   border: 0;
@@ -1315,7 +1315,7 @@
 
 /*footer*/
 .vxe-table--footer-wrapper {
-  color: #606266;
+  color: var(--vxe-table-footer-font-color);
   margin-top: -1px;
 }
 .vxe-table--footer-wrapper.body--wrapper {