ocpview-plus/src/plugins/theme/theme-variable.css

A high quality Service UI components Library with Vue.js

html.default-theme {
    /* 主色变量 */
    --amp-primary-color: #1890ff;
    --amp-primary-1: #e6f7ff;
    --amp-primary-2: #bae7ff;
    --amp-primary-3: #91d5ff;
    --amp-primary-4: #69c0ff;
    --amp-primary-5: #40a9ff;
    --amp-primary-6: #1890ff;
    --amp-primary-7: #096dd9;
    --amp-primary-color-hover: #40a9ff;
    --amp-primary-color-active: #096dd9;
    --amp-primary-color-outline: rgba(24, 144, 255, 0.2);
    --amp-success-color: #52c41a;
    --amp-success-color-hover: #73d13d;
    --amp-success-color-active: #389e0d;
    --amp-error-color: #ff4d4f;
    --amp-error-color-hover: #ff7875;
    --amp-error-color-active: #d9363e;
    --amp-warning-color: #faad14;
    --amp-warning-color-hover: #ffc53d;
    --amp-warning-color-active: #d48806;
    --amp-info-color: #1890ff;
}

html.red-theme {
    /* 主色变量 */
    --amp-primary-color: #af292e;
    --amp-primary-1: #fbf4f4;
    --amp-primary-2: #fbf4f4;
    --amp-primary-3: #fbf4f4;
    --amp-primary-4: #fbf4f4;
    --amp-primary-5: #df8181;
    --amp-primary-6: #fbf4f4;
    --amp-primary-7: #fbf4f4;
    --amp-primary-color-hover: #df8181;
    --amp-primary-color-active: #7a2531;
    --amp-primary-color-outline: rgba(250, 244, 244, 0.2);
    --amp-success-color: #9dc56a;
    --amp-success-color-hover: #d0eeaa;
    --amp-success-color-active: #739943;
    --amp-error-color: #ef6e73;
    --amp-error-color-hover: #ffb5b8;
    --amp-error-color-active: #df3d43;
    --amp-warning-color: #f3b352;
    --amp-warning-color-hover: #ffdca7;
    --amp-warning-color-active: #ffdca7;
    --amp-info-color: #4d4e53;

    /* 表格复写 */
    .vxe-table--render-default .vxe-body--row.row--current {
        color: var(--amp-primary-color);
    }
}

html:root {
    --vxe-font-family: "PingFang SC", "Helvetica Neue", "Microsoft YaHei", Arial, -apple-system, BlinkMacSystemFont,
        "Segoe UI", Roboto, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
        "Noto Color Emoji";
    --vxe-primary-color: var(--amp-primary-color);
    --vxe-primary-lighten-color: var(--amp-primary-color-hover);
    --vxe-success-color: var(--amp-success-color);
    --vxe-info-color: var(--amp-info-color);
    --vxe-warning-color: var(--amp-warning-color);
    --vxe-danger-color: var(--amp-error-color);
    --vxe-table-row-current-background-color: var(--amp-primary-1);
    --vxe-table-row-hover-background-color: var(--amp-primary-1);
    --vxe-table-row-hover-current-background-color: var(--amp-primary-1);

    /* 表头背景色 */
    --vxe-table-header-background-color: #f6f7fa;
    /* 斑马线背景色 */
    --vxe-table-row-striped-background-color: #fbfcff;
    /* 字体大小 */
    --vxe-font-size: 13px;
    --vxe-font-size-mini: 13px;
    --vxe-font-size-medium: 13px;
    --vxe-font-size-small: 13px;
    /* 加载中 */
    --vxe-loading-color: var(--amp-primary-color);
    --vxe-table-header-font-color: #303133;
    --vxe-table-header-font-weight: bold;
    --vxe-table-cell-padding-left: 8px;
    --vxe-table-cell-padding-right: 8px;
    --vxe-font-color: #303133;
}

.efu-stable-footer-row {
    background-color: rgb(245, 247, 250);
}

.vxe-table--render-default .vxe-table--border-line {
    border: 0;
}

/* .col--valid-error .ivu-input {
    border-color: var(--amp-error-color);
} */

.col--valid-error > .vxe-cell .ivu-input-wrapper .ivu-input,
.col--valid-error > .vxe-cell .ivu-auto-complete .ivu-input,
.col--valid-error > .vxe-cell .ivu-input-number,
.col--valid-error > .vxe-cell .ivu-select .ivu-select-selection,
.col--valid-error > .vxe-cell .ivu-cascader .ivu-input,
.col--valid-error > .vxe-cell .ivu-date-picker .ivu-input,
.col--valid-error > .vxe-tree-cell .ivu-input-wrapper .ivu-input,
.col--valid-error > .vxe-tree-cell .ivu-auto-complete .ivu-input,
.col--valid-error > .vxe-tree-cell .ivu-input-number,
.col--valid-error > .vxe-tree-cell .ivu-select .ivu-select-selection,
.col--valid-error > .vxe-tree-cell .ivu-cascader .ivu-input,
.col--valid-error > .vxe-tree-cell .ivu-date-picker .ivu-input {
    border-color: var(--amp-error-color);
    box-shadow: none;
}