AIoT前端公共UI

element.scss 6.2KB

    // dropdown .el-dropdown-menu { display: inline-block; min-width: 120px; } // cascader .el-cascader-menu__list { .el-cascader-node:hover { background: #e8f5ff; color: var(--el-color-primary); } } // table .el-table { font-size: 12px; font-weight: 400; .el-table__inner-wrapper { } } // radio .el-radio { .el-radio__input { .el-radio__inner { width: 12px; height: 12px; } } .el-radio__input.is-checked { .el-radio__inner { width: 12px; height: 12px; background: white; } .el-radio__inner:after { width: 6px; height: 6px; background: var(--el-color-primary); } } .el-radio__label { font-size: 12px !important; } } .el-checkbox { .el-checkbox__input { .el-checkbox__inner { width: 12px; height: 12px; } } .el-checkbox__label { font-size: 12px !important; } } .el-radio-button { .el-radio-button__inner:hover { background: var(--el-color-primary-light-9); border: 1px solid var(--el-color-primary); } } .el-radio-button.is-active { .el-radio-button__inner:hover { background: var(--el-color-primary); } } // checkbox .el-checkbox-button { .el-checkbox-button__inner:hover { background: var(--el-color-primary-light-9); border: 1px solid var(--el-color-primary); } } .el-checkbox-button.is-checked { .el-checkbox-button__inner:hover { background: var(--el-color-primary); } } // slider .el-slider { .el-slider__button-wrapper { .el-slider__button { background: var(--el-color-primary); } } } // pager .el-pager li.is-active { background: var(--el-color-primary); color: #ffffff; border-radius: 3px; } .el-pagination.is-background { padding: 0 10px; .btn-prev:disabled, .btn-next:disabled { background: transparent; } .btn-prev, .btn-next { border: 1px solid #ebebeb; } .btn-prev:hover, .btn-next:hover { border: 1px solid var(--el-color-primary); } .el-pager { li { border: 1px solid #ebebeb; } li:hover { border: 1px solid var(--el-color-primary); } .is-active.number { border: 1px solid var(--el-color-primary); } .more.btn-quicknext.el-icon { border: none; } } } // menu .el-menu.el-menu--horizontal.el-menu-demo { .el-sub-menu { .el-sub-menu__title:hover { background: transparent; } } .is-active { border-bottom: 2px solid #2a2b3c; .el-sub-menu__title { border-bottom: 2px solid #2a2b3c; } } .el-menu-item { background: transparent !important; } .el-menu-item:hover { background: transparent; } } // tabs .el-tabs.el-tabs--card { .el-tabs__header { .el-tabs__nav-wrap { .el-tabs__nav-scroll { .el-tabs__nav { border-top: 1px solid transparent; border-left: none; border-right: none; .el-tabs__item { margin-right: 10px; border: 1px solid #ebebeb; border-radius: 4px 4px 0px 0px; background: #f9f9f9; } .el-tabs__item.is-top.is-active { border-bottom: 1px solid #fff; background: #ffffff; } } } } } } // message .el-message { padding: 12px 16px !important; .el-icon.el-message__closeBtn { width: 12px; height: 12px; } } // pagination .el-pagination { .el-pagination__sizes { flex: 1; justify-content: flex-start !important; } } // transfer .el-transfer { .el-transfer-panel { .el-transfer-panel__header { .el-checkbox { .el-checkbox__input { .el-checkbox__inner { width: 12px; height: 12px; } } .el-checkbox__label { font-size: 12px !important; } } } .el-transfer-panel__body { .el-checkbox { .el-checkbox__input { .el-checkbox__inner { width: 12px; height: 12px; } } } } } .el-transfer__buttons { width: 46px; .el-button.el-button--primary.el-transfer__button:last-child { margin: 10px 0 0 !important; } .el-button.el-button--primary.is-disabled.el-transfer__button { background: #f9f9f9; border: 1px solid #ebebeb; span { color: #bfbfbf; } } } } // dialog .el-dialog{ border-radius: 4px; .el-dialog__header{ padding: 10px 16px; line-height: 20px; color:#2D3E53; font-weight: 500; border-bottom: 1px solid #EBEBEB; .el-dialog__headerbtn{ top: 0; font-size: 16px; } } .el-dialog__footer{ padding-top: 10px; padding-bottom: 10px; border-top: 1px solid #EBEBEB; } } // table__inner :deep(.el-table__inner-wrapper) { font-size: 14px; .el-table__header-wrapper { font-size: 14px; thead tr { font-size: 14px; } } } .el-table { width: 100%; } // .el-button.is-text { // padding: 0; // } .el-empty__description { margin-top: 0px!important; } :deep(.current-row) { position: relative; background: rgba(25, 130, 255, 0.04); &:after { content: ''; position: absolute; left: 0; width: 4px; height: 100%; background: #2d98ff; z-index: 1000; } } .aiot-table-line { margin-left: 8px; font-size: 12px; color: rgba(0, 0, 0, 0.2); font-weight: 800; } :deep(.el-tooltip) { display: flex; } .aiot-table-drop { margin-left: 10px; } .aiot-el-form-item { width: calc(100% - 24px); // margin-bottom: 10 !important; margin-bottom: 0 !important; margin-top: 18px !important; } .form-last-btns{ width: calc(100%)!important; } .aiot-form-el { width: 100%; display: block; } // common compoenents .el-main { padding: 0 0px; } :deep(.el-tree-node) { line-height: 32px; } :deep(.el-tree-node__label) { width: 100%; } :deep(.el-tree-node__content) { height: 32px; } :deep(.el-input .el-input__wrapper){ width: 100%!important; }