vue-easytable/packages/theme-dark/var.less

Vue table component

@ve-primary-color: #121212;
@ve-secondary-color: #363636;
@ve-dark-text-color: #ffffffd9;
@ve-default-font-size: 14px;

/* ve-table */
@ve-fixed-body-cell-index: 10;
@ve-fixed-cell-selection-border-index: 10;
@ve-fixed-cell-selection-corner-index: 11;
@ve-fixed-header-index: 20;
@ve-fixed-foot-index: 20;
@ve-fixed-header-cell-index: 30;
@ve-fixed-foot-cell-index: 30;
@ve-table-head-row-height: 40px;
@ve-table-body-row-height: 40px;
@ve-table-foot-row-height: 40px;
@ve-table-td-editing-line-height: 30px;
@ve-table-head-row-td-padding: 10px;
@ve-table-body-row-td-padding: 10px;
@ve-table-body-row-expand-content-padding: 0 10px;
@ve-table-foot-row-td-padding: 10px;
@ve-table-border-color: #000;
@ve-table-column-fixed-border-color: #434343;
@ve-table-td-editing-font-color: #fff;
@ve-table-td-editing-border-color: #2196f3;
@ve-table-td-editing-background-color: #434343;
@ve-table-td-editing-box-shadow-color: #5e5c5c;
@ve-table-selection-border-color: #4b89ff;
@ve-table-selection-autofill-border-color: #ff000085;
@ve-table-selection-corner-border-color: #ffffff;
@ve-table-selection-corner-background-color: #4b89ff;
@ve-table-selection-area-layer-background-color: #0d65eb;
@ve-table-td-operation-column-background-color: #1d1d1d;
@ve-table-body-background-color: #141414;
@ve-table-body-row-stripe-background-color: @ve-primary-color;
@ve-table-body-row-hover-background-color: @ve-primary-color;
@ve-table-body-row-highlight-background-color: #000;
@ve-table-body-row-row-scrolling-background-color: #141414;
@ve-table-header-background-color: #1d1d1d;
@ve-table-head-text-color: @ve-dark-text-color;
@ve-table-head-indicator-active-text-color: #fff;
@ve-table-body-text-color: @ve-dark-text-color;
@ve-table-body-indicator-active-text-color: #fff;
@ve-table-foot-background-color: #1d1d1d;
@ve-table-foot-text-color: @ve-dark-text-color;
@ve-table-sort-icon-default-color: #bfbfbf;
@ve-table-sort-icon-active-color: #108ee9;
@ve-table-head-text-font-size: @ve-default-font-size;
@ve-table-body-text-font-size: @ve-default-font-size;
@ve-table-foot-text-font-size: @ve-default-font-size;
@ve-table-header-filter-icon-color: #eee;
@ve-table-header-cell-indicator-background-color: #434343;
@ve-table-header-cell-indicator-active-background-color: #666;
@ve-table-body-cell-indicator-background-color: #434343;
@ve-table-body-cell-indicator-active-background-color: #666;
@ve-table-column-resizer-handler-background-color: #4d90fe;
@ve-table-column-resizer-line-background-color: #4d90fe;

/* ve-pagination */
@ve-pagination-background-color: @ve-primary-color;
@ve-pagination-item-border-color: #434343;
@ve-pagination-item-background-color: @ve-primary-color;
@ve-pagination-item-text-color: @ve-dark-text-color;
@ve-pagination-li-color: @ve-dark-text-color;
@ve-pagination-jump-hover-color: @ve-dark-text-color;
@ve-pagination-goto-background-color: #141414;
@ve-pagination-goto-input-color: @ve-dark-text-color;
@ve-pagination-goto-input-hover-color: @ve-dark-text-color;

/* ve-checkbox */
@ve-checkbox-checked-background-color: #108ee9;
@ve-checkbox-checked-border-color: #108ee9;
@ve-checkbox-label-text-color: @ve-dark-text-color;

/* ve-radio */
@ve-radio-checked-background-color: #108ee9;
@ve-radio-checked-border-color: #108ee9;
@ve-radio-label-text-color: @ve-dark-text-color;

/* ve-select */
@ve-select-text-color: @ve-dark-text-color;

/* ve-dropdown */
@ve-dropdown-z-index: 999;
@ve-dropdown-background-color: @ve-secondary-color;
@ve-dropdown-border-color: #434343;
@ve-dropdown-text-color: @ve-dark-text-color;
@ve-dropdown-item-background-color: @ve-secondary-color;
@ve-dropdown-item-border-color: @ve-secondary-color;
@ve-dropdown-item-active-background-color: #666666;
@ve-dropdown-item-hover-background-color: #464646;
@ve-dropdown-item-hover-text-color: @ve-dark-text-color;
@ve-dropdown-active-text-color: @ve-dark-text-color;
@ve-dropdown-operation-item-text-color: @ve-dark-text-color;
@ve-dropdown-operation-item-hover-text-color: #2196f3;

/* ve-contextmenu */
@ve-contextmenu-background-color: @ve-secondary-color;
@ve-contextmenu-border-color: @ve-secondary-color;
@ve-contextmenu-border-radius: 4px;
@ve-contextmenu-box-shadow-color: #0000001a;
@ve-contextmenu-min-width: 180px;
@ve-contextmenu-min-height: 50px;
@ve-contextmenu-node-separator-line-color: hsla(0, 0%, 100%, 0.12);
@ve-contextmenu-node-hover-background-color: #666666;
@ve-contextmenu-node-text-color: @ve-dark-text-color;
@ve-contextmenu-node-hover-text-color: @ve-dark-text-color;
@ve-contextmenu-node-active-text-color: @ve-dark-text-color;
@ve-contextmenu-node-disabled-text-color: #c0c4cc;
@ve-contextmenu-node-icon-postfix-color: @ve-dark-text-color;
@ve-contextmenu-node-disabled-icon-postfix-color: #c0c4cc;