hy-dispatch-ui-v3 0.2.14 → 0.2.16

package/lib/style/element/hy-element.scss

@@ -1,981 +0,0 @@
-// 测试
-:root {
-  --hy-el-fill-color-light: rgba(var(--hy-background-2), 1);
-  --hy-el-fill-color-lighter: rgba(var(--hy-background-4), 1);
-  --hy-el-fill-color-blank: rgba(var(--hy-background-2), 1);
-  --hy-el-color-info: rgba(var(--hy-info), 1);
-  --hy-el-border: var(--hy-el-border-width) var(--hy-el-border-style) rgba(var(--hy-border), 1);
-  --hy-el-disabled-border-color: rgba(var(--hy-border), 1);
-  --hy-el-bg-color: rgba(var(--hy-background), 1);
-  --hy-el-text-color-secondary: rgba(var(--hy-auxiliary), 1);
-  --hy-el-text-color-regular: rgba(var(--hy-auxiliary), 1);
-  --hy-el-border-color-light: rgba(var(--hy-border), 1);
-  --hy-el-border-color-lighter: rgba(var(--hy-border), 1);
-  --hy-el-color-primary: rgba(var(--hy-theme), 1);
-  --hy-el-text-color-placeholder: rgba(var(--hy-info), 1);
-  --hy-el-text-color-primary: rgba(var(--hy-auxiliary), 1);
-  --hy-el-color-danger: rgba(var(--hy-danger), 1);
-}
-
-// 表格
-.hy-el-table {
-  --hy-el-table-border-color: rgba(var(--hy-border), 1);
-  --hy-el-table-border: 1px solid rgba(var(--hy-border), 0.5);
-  --hy-el-table-text-color: rgba(var(--hy-main), 1);
-  --hy-el-table-header-text-color: rgba(var(--hy-main), 1);
-  --hy-el-table-row-hover-bg-color: rgba(var(--hy-background-2-50), 1);
-  --hy-el-table-current-row-bg-color: rgba(var(--hy-background-2-50), 1);
-  --hy-el-table-header-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-table-fixed-box-shadow: var(--hy-el-box-shadow-light);
-  --hy-el-table-bg-color: rgba(var(--hy-background), 1);
-  --hy-el-table-tr-bg-color: rgba(var(--hy-background), 1);
-  --hy-el-table-expanded-cell-bg-color: rgba(var(--hy-background), 1);
-  --hy-el-table-fixed-left-column: inset 10px 0 10px -10px rgba(var(--hy-background-3), 1);
-  --hy-el-table-fixed-right-column: inset -10px 0 10px -10px rgba(var(--hy-background-3), 1);
-  --hy-el-table-index: var(--hy-el-index-normal);
-  position: relative;
-  overflow: hidden;
-  box-sizing: border-box;
-  height: -moz-fit-content;
-  height: fit-content;
-  width: 100%;
-  max-width: 100%;
-  background-color: var(--hy-el-table-bg-color);
-  font-size: var(--hy-el-font-size-base);
-  color: var(--hy-el-table-text-color);
-}
-
-.hy-el-table__expand-icon {
-  color: rgba(var(--hy-main), 1);
-  font-size: 12px;
-  line-height: 12px;
-  font-weight: 700;
-  width: min(23px, 100%);
-  height: 23px;
-}
-
-.hy-el-table__expand-icon>.hy-el-icon {
-  font-size: 12px;
-}
-
-.hy-el-table tr:hover td:first-child {
-  box-shadow: inset 10px 0 10px -10px rgba(var(--hy-theme), 0.2), inset 0 10px 10px -10px rgba(var(--hy-theme), 0.2), inset 0 -10px 10px -10px rgba(var(--hy-theme), 0.2);
-}
-
-.hy-el-table tr:hover td:last-child {
-  box-shadow: inset -10px 0 10px -10px rgba(var(--hy-theme), 0.2), inset 0 10px 10px -10px rgba(var(--hy-theme), 0.2), inset 0 -10px 10px -10px rgba(var(--hy-theme), 0.2);
-}
-
-.hy-el-table tr:hover td:not(:first-child):not(:last-child) {
-  box-shadow: inset 0 10px 10px -10px rgba(var(--hy-theme), 0.2), inset 0 -10px 10px -10px rgba(var(--hy-theme), 0.2);
-}
-
-.hy-el-scrollbar__view {
-  height: 100%;
-}
-
-// 虚拟表格
-.hy-el-table-v2 {
-  --hy-el-table-border-color: rgba(var(--hy-border), 1);
-  --hy-el-table-border: 1px solid rgba(var(--hy-border), 0.5);
-  --hy-el-table-text-color: rgba(var(--hy-main), 1);
-  --hy-el-table-header-text-color: rgba(var(--hy-main), 1);
-  --hy-el-table-row-hover-bg-color: rgba(var(--hy-background-2-50), 1);
-  --hy-el-table-current-row-bg-color: rgba(var(--hy-background-2-50), 1);
-  --hy-el-table-header-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-table-fixed-box-shadow: var(--hy-el-box-shadow-light);
-  --hy-el-table-bg-color: rgba(var(--hy-background), 1);
-  --hy-el-table-tr-bg-color: rgba(var(--hy-background), 1);
-  --hy-el-table-expanded-cell-bg-color: rgba(var(--hy-background), 1);
-  --hy-el-table-fixed-left-column: inset 10px 0 10px -10px rgba(var(--hy-background-3), 1);
-  --hy-el-table-fixed-right-column: inset -10px 0 10px -10px rgba(var(--hy-background-3), 1);
-  --hy-el-table-index: var(--hy-el-index-normal);
-  font-size: var(--hy-el-font-size-base);
-}
-
-.hy-el-table-v2__table .hy-el-table-v2__row:hover .hy-el-table-v2__row-cell:first-child {
-  box-shadow: inset 10px 0 10px -10px rgba(var(--hy-theme), 0.2), inset 0 10px 10px -10px rgba(var(--hy-theme), 0.2), inset 0 -10px 10px -10px rgba(var(--hy-theme), 0.2);
-}
-
-.hy-el-table-v2__table .hy-el-table-v2__row:hover .hy-el-table-v2__row-cell:last-child {
-  box-shadow: inset -10px 0 10px -10px rgba(var(--hy-theme), 0.2), inset 0 10px 10px -10px rgba(var(--hy-theme), 0.2), inset 0 -10px 10px -10px rgba(var(--hy-theme), 0.2);
-}
-
-.hy-el-table-v2__table .hy-el-table-v2__row:hover .hy-el-table-v2__row-cell:not(:first-child):not(:last-child) {
-  box-shadow: inset 0 10px 10px -10px rgba(var(--hy-theme), 0.2), inset 0 -10px 10px -10px rgba(var(--hy-theme), 0.2);
-}
-
-.hy-el-table-v2__right {
-  display: flex;
-  flex-direction: column-reverse;
-  position: absolute;
-  overflow: hidden;
-  top: 0;
-  background-color: var(--hy-el-bg-color);
-  right: 0;
-  box-shadow: -2px 0 4px 0 rgba(var(--hy-background-3), 1);
-}
-
-.hy-el-table-v2__left {
-  display: flex;
-  flex-direction: column-reverse;
-  position: absolute;
-  overflow: hidden;
-  top: 0;
-  background-color: var(--hy-el-bg-color);
-  left: 0;
-  box-shadow: 2px 0 4px 0 rgba(var(--hy-background-3), 1);
-}
-
-.hy-el-empty__image svg {
-  color: rgba(var(--hy-auxiliary), 1);
-  fill: currentColor;
-  width: 100%;
-  height: 100%;
-  vertical-align: top;
-}
-
-// input输入框
-.hy-el-input {
-  --hy-el-input-text-color: rgba(var(--hy-main), 1);
-  --hy-el-input-border: rgba(var(--hy-border), 1);
-  --hy-el-input-hover-border: rgba(var(--hy-theme), 1);
-  --hy-el-input-focus-border: rgba(var(--hy-theme), 1);
-  --hy-el-input-transparent-border: 0 0 0 1px transparent inset;
-  --hy-el-input-border-color: rgba(var(--hy-border), 1);
-  --hy-el-input-border-radius: var(--hy-el-border-radius-base);
-  --hy-el-input-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-input-icon-color: var(--hy-el-text-color-placeholder);
-  --hy-el-input-placeholder-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-input-hover-border-color: rgba(var(--hy-theme), 1);
-  --hy-el-input-clear-hover-color: var(--hy-el-text-color-secondary);
-  --hy-el-input-focus-border-color: rgba(var(--hy-theme), 1);
-  --hy-el-input-width: 100%;
-  --hy-el-input-height: var(--hy-el-component-size);
-  position: relative;
-  font-size: var(--hy-el-font-size-base);
-  display: inline-flex;
-  width: var(--hy-el-input-width);
-  line-height: var(--hy-el-input-height);
-  box-sizing: border-box;
-  vertical-align: middle;
-}
-
-.hy-el-input-group__prepend {
-  border-top-right-radius: 0 !important;
-  border-bottom-right-radius: 0 !important;
-}
-
-.hy-el-input-group__append {
-  border-top-left-radius: 0 !important;
-  border-bottom-left-radius: 0 !important;
-}
-
-.hy-el-input.is-disabled .hy-el-input__wrapper {
-  background-color: rgba(var(--hy-background-2), 1);
-  // background-color: var(--hy-el-input-bg-color);
-  cursor: not-allowed;
-  box-shadow: 0 0 0 1px rgba(var(--hy-border), 1) inset;
-}
-
-.hy-el-textarea {
-  --hy-el-input-text-color: rgba(var(--hy-main), 1);
-  --hy-el-input-border: rgba(var(--hy-border), 1);
-  --hy-el-input-hover-border: rgba(var(--hy-theme), 1);
-  --hy-el-input-focus-border: rgba(var(--hy-theme), 1);
-  --hy-el-input-transparent-border: 0 0 0 1px transparent inset;
-  --hy-el-input-border-color: rgba(var(--hy-border), 1);
-  --hy-el-input-border-radius: var(--hy-el-border-radius-base);
-  --hy-el-input-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-input-icon-color: var(--hy-el-text-color-placeholder);
-  --hy-el-input-placeholder-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-input-hover-border-color: rgba(var(--hy-theme), 1);
-  --hy-el-input-clear-hover-color: var(--hy-el-text-color-secondary);
-  --hy-el-input-focus-border-color: rgba(var(--hy-theme), 1);
-  --hy-el-input-width: 100%;
-  position: relative;
-  display: inline-block;
-  width: 100%;
-  vertical-align: bottom;
-  font-size: var(--hy-el-font-size-base);
-}
-
-.hy-el-input-group__append,
-.hy-el-input-group__prepend {
-  background-color: var(--hy-el-fill-color-light);
-  color: rgba(var(--hy-auxiliary), 1);
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-height: 100%;
-  border-radius: var(--hy-el-input-border-radius);
-  padding: 0 20px;
-  white-space: nowrap;
-}
-
-// 日期选择器
-.hy-el-popper.hy-el-tooltip.hy-el-picker__popper {
-  --hy-el-border-color-light: rgba(var(--hy-auxiliary), 1);
-}
-
-.hy-el-popper {
-  --hy-el-popper-border-radius: var(--hy-el-popover-border-radius, 4px);
-  --hy-el-popper-bg-color-light: rgba(var(--hy-background-2), 1);
-  --hy-el-popper-bg-color-dark: rgba(var(--hy-background-2), 1);
-  position: absolute;
-  border-radius: var(--hy-el-popper-border-radius);
-  padding: 5px 11px;
-  z-index: 2000;
-  font-size: 12px;
-  line-height: 20px;
-  min-width: 10px;
-  overflow-wrap: break-word;
-  word-break: normal;
-  visibility: visible;
-}
-
-.hy-el-date-picker {
-  --hy-el-datepicker-text-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-datepicker-off-text-color: rgba(var(--hy-info), 1);
-  --hy-el-datepicker-header-text-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-datepicker-icon-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-datepicker-border-color: var(--hy-el-disabled-border-color);
-  --hy-el-datepicker-inner-border-color: var(--hy-el-border-color-light);
-  --hy-el-datepicker-inrange-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-datepicker-inrange-hover-bg-color: rgba(var(--hy-background-3), 1);
-  --hy-el-datepicker-active-color: rgba(var(--hy-background-3), 1);
-  --hy-el-datepicker-hover-text-color: rgba(var(--hy-theme), 1);
-  --hy-el-datepicker-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-fill-color-blank: rgba(var(--hy-background-2), 1);
-}
-
-.hy-el-date-table td.selected .hy-el-date-table-cell__text {
-  background-color: var(--hy-el-datepicker-active-color);
-  color: rgba(var(--hy-theme), 1);
-}
-
-.hy-el-button.is-plain {
-  --hy-el-button-hover-text-color: rgba(var(--hy-theme), 1);
-  --hy-el-button-hover-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-button-hover-border-color: rgba(var(--hy-theme), 1);
-}
-
-.hy-el-button {
-  --hy-el-button-font-weight: var(--hy-el-font-weight-primary);
-  --hy-el-button-border-color: rgba(var(--hy-border), 1);
-  --hy-el-button-bg-color: var(--hy-el-fill-color-blank);
-  --hy-el-button-text-color: var(--hy-el-text-color-regular);
-  --hy-el-button-disabled-text-color: var(--hy-el-disabled-text-color);
-  --hy-el-button-disabled-bg-color: var(--hy-el-fill-color-blank);
-  --hy-el-button-disabled-border-color: var(--hy-el-border-color-light);
-  --hy-el-button-divide-border-color: rgba(255, 255, 255, 0.5);
-  --hy-el-button-hover-text-color: var(--hy-el-color-primary);
-  --hy-el-button-hover-bg-color: var(--hy-el-color-primary-light-9);
-  --hy-el-button-hover-border-color: var(--hy-el-color-primary-light-7);
-  --hy-el-button-active-text-color: var(--hy-el-button-hover-text-color);
-  --hy-el-button-active-border-color: var(--hy-el-color-primary);
-  --hy-el-button-active-bg-color: var(--hy-el-button-hover-bg-color);
-  --hy-el-button-outline-color: var(--hy-el-color-primary-light-5);
-  --hy-el-button-hover-link-text-color: var(--hy-el-text-color-secondary);
-  --hy-el-button-active-color: var(--hy-el-text-color-primary);
-}
-
-.hy-el-date-table.is-week-mode .hy-el-date-table__row.current .hy-el-date-table-cell {
-  background-color: rgba(var(--hy-background-3), 1);
-}
-
-.hy-el-date-table td.start-date .hy-el-date-table-cell__text,
-.hy-el-date-table td.end-date .hy-el-date-table-cell__text {
-  background-color: rgba(var(--hy-background-2), 1);
-}
-
-.hy-el-date-table td.start-date .hy-el-date-table-cell,
-.hy-el-date-table td.end-date .hy-el-date-table-cell {
-  color: rgba(var(--hy-theme), 1);
-}
-
-.hy-el-year-table td.current:not(.disabled) .hy-el-date-table-cell__text {
-  color: rgba(var(--hy-theme), 1);
-  background-color: var(--hy-el-datepicker-active-color);
-}
-
-.hy-el-month-table td.current:not(.disabled) .hy-el-date-table-cell__text {
-  color: rgba(var(--hy-theme), 1);
-  background-color: var(--hy-el-datepicker-active-color);
-}
-
-.hy-el-date-table td.current:not(.disabled) .hy-el-date-table-cell__text {
-  color: rgba(var(--hy-theme), 1);
-  background-color: var(--hy-el-datepicker-active-color);
-}
-
-.hy-el-date-range-picker {
-  --hy-el-datepicker-text-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-datepicker-off-text-color: rgba(var(--hy-info), 1);
-  --hy-el-datepicker-header-text-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-datepicker-icon-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-datepicker-border-color: rgba(var(--hy-border), 1);
-  --hy-el-datepicker-inner-border-color: rgba(var(--hy-border), 1);
-  --hy-el-datepicker-inrange-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-datepicker-inrange-hover-bg-color: rgba(var(--hy-background-3), 1);
-  --hy-el-datepicker-active-color: rgba(var(--hy-background-3), 1);
-  --hy-el-datepicker-hover-text-color: rgba(var(--hy-theme), 1);
-  --hy-el-datepicker-bg-color: rgba(var(--hy-background-2), 1);
-}
-
-.hy-el-date-table td.in-range .hy-el-date-table-cell {
-  background-color: rgba(var(--hy-background-3), 1);
-}
-
-.hy-el-date-editor.hy-el-input__wrapper {
-  box-shadow: 0 0 0 1px rgba(var(--hy-border), 1) inset;
-}
-
-.hy-el-date-editor {
-  --hy-el-input-icon-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-input-placeholder-color: rgba(var(--hy-auxiliary), 1);
-  --hy-el-input-hover-border: rgba(var(--hy-theme), 1);
-  --hy-el-input-hover-border-color: rgba(var(--hy-theme), 1);
-  --hy-el-text-color-placeholder: rgba(var(--hy-auxiliary), 1);
-  --hy-el-text-color-regular: rgba(var(--hy-main), 1);
-}
-
-.hy-el-date-editor .hy-el-range__icon {
-  color: rgba(var(--hy-auxiliary), 1);
-}
-
-.hy-el-date-picker__editor-wrap .hy-el-input__wrapper {
-  background-color: rgba(var(--hy-background-2), 1);
-}
-
-.hy-el-scrollbar__wrap .hy-el-time-spinner__list .hy-el-time-spinner__item:hover {
-  background-color: rgba(var(--hy-background-3), 1);
-}
-
-.hy-el-button.is-text:not(.is-disabled):hover {
-  background-color: rgba(var(--hy-background-3), 1);
-}
-
-// 单选框
-.hy-el-radio__inner {
-  background-color: rgba(var(--hy-background), 1);
-}
-
-.hy-el-radio__input.is-checked .hy-el-radio__inner::after {
-  background-color: rgba(var(--hy-theme), 1);
-}
-
-.hy-el-radio__input.is-checked .hy-el-radio__inner {
-  border-color: var(--hy-el-color-primary);
-  background: rgba(var(--hy-background), 1);
-}
-
-// 多选框
-.hy-el-checkbox__inner {
-  background-color: rgba(var(--hy-background), 1)
-}
-
-.hy-el-checkbox__input.is-checked .hy-el-checkbox__inner,
-.hy-el-checkbox__input.is-indeterminate .hy-el-checkbox__inner {
-  background: rgba(var(--hy-theme), .5);
-  box-shadow: 0 0 4px 0 rgba(var(--hy-theme), 1);
-  border-color: rgba(var(--hy-theme), 1);
-}
-
-.hy-el-checkbox__input.is-disabled .hy-el-checkbox__inner {
-  background-color: rgba(var(--hy-background), 1);
-  border-color: rgba(var(--hy-info), 1);
-  cursor: not-allowed;
-}
-
-.hy-el-checkbox__input.is-disabled.is-checked .hy-el-checkbox__inner {
-  background-color: rgba(var(--hy-background), 1);
-  border-color: rgba(var(--hy-info), 1);
-  box-shadow: 0 0 4px 0 rgba(var(--hy-info), 1);
-}
-
-.hy-el-checkbox__input.is-disabled.is-checked .hy-el-checkbox__inner::after {
-  border-color: rgba(var(--hy-info), 1);
-}
-
-.hy-el-checkbox-button.is-checked .hy-el-checkbox-button__inner {
-  color: var(--hy-el-checkbox-button-checked-text-color);
-  // background: linear-gradient(180deg, rgba(var(--hy-auxiliary), .5), rgba(var(--hy-auxiliary), .8) 53%, rgba(var(--hy-theme), .9));
-  background: rgba(var(--hy-theme), .5);
-  // border: 1px solid rgba(var(--hy-theme), 1);
-  box-shadow: inset 0px 0px 0px 1px rgba(var(--hy-theme), 1) !important;
-  position: relative;
-  z-index: 99;
-  // &::after {
-  //   content: '';
-  //   position: absolute;
-  //   bottom: 0px;
-  //   left: 0px;
-  //   width: 100%;
-  //   height: 2px;
-  //   background: linear-gradient( 90deg, rgba(var(--hy-theme), 0) 0%, rgba(var(--hy-theme), 1) 49.31%, rgba(var(--hy-theme), 0) 100%);
-  // }
-}
-
-// 选择框
-.hy-el-popper.hy-el-tooltip.hy-el-select__popper {
-  --hy-el-border-color-light: rgba(var(--hy-border), 1);
-}
-
-.hy-el-select__wrapper {
-  box-shadow: 0 0 0 1px rgba(var(--hy-border), 1) inset;
-}
-
-.hy-el-select__wrapper.is-hovering:not(.is-focused) {
-  box-shadow: 0 0 0 1px rgba(var(--hy-theme), 1) inset;
-}
-
-.hy-el-select__placeholder.is-transparent {
-  color: rgba(var(--hy-auxiliary), 1);
-}
-
-.hy-el-select__placeholder {
-  color: rgba(var(--hy-main), 1);
-}
-
-.hy-el-select__caret {
-  color: rgba(var(--hy-main), 1);
-}
-
-.hy-el-select-dropdown__item.is-selected {
-  background-color: rgba(var(--hy-background-2), 1);
-}
-
-.hy-el-select-dropdown__item.is-hovering:hover {
-  background-color: rgba(var(--hy-background-3), 1);
-  color: rgba(var(--hy-theme), 1);
-}
-
-.hy-el-select__wrapper.is-disabled {
-  box-shadow: 0 0 0 1px rgba(var(--hy-info), 1) inset !important;
-}
-
-.hy-el-tag.hy-el-tag--info {
-  --hy-el-tag-bg-color: rgba(var(--hy-background-2), 1);
-  --hy-el-tag-border-color: rgba(var(--hy-border), 1);
-  --hy-el-tag-hover-color: var(--hy-el-color-info);
-}
-
-.hy-el-select__selection .hy-el-tag {
-  border-color: rgba(var(--hy-border), 1);
-}
-
-.hy-el-tag.hy-el-tag--info {
-  --hy-el-tag-text-color: rgba(var(--hy-main), 1);
-}
-
-.hy-el-tag .hy-el-tag__close {
-  background-color: rgba(var(--hy-danger-2), 1) !important;
-}
-
-// 消息提示框
-.hy-el-popper,
-.hy-el-tooltip {
-  --hy-el-border-color-light: rgba(var(--hy-theme), 1);
-}
-
-.hy-el-popper.is-dark {
-  --hy-el-border-color-light: rgba(var(--hy-theme), 1);
-  --hy-el-text-color-primary: rgba(var(--hy-theme), 1);
-  color: rgba(var(--hy-main), 1);
-  background: var(--hy-el-popper-bg-color-dark);
-  border: 1px solid var(--hy-el-text-color-primary);
-}
-
-.hy-el-popover.hy-el-popper {
-  color: rgba(var(--hy-main), 1);
-  padding: 0px;
-}
-
-// 分页器
-.hy-el-pagination.is-background .btn-prev {
-  border-radius: 50%;
-  background: rgba(var(--hy-background-2), 1);
-  color: rgba(var(--hy-main), 1);
-
-  &:hover {
-    color: rgba(var(--hy-theme), 1);
-  }
-}
-
-.hy-el-pagination.is-background .btn-prev:disabled {
-  border-radius: 50%;
-
-  &:hover {
-    color: rgba(var(--hy-main), 1);
-  }
-}
-
-.hy-el-pagination.is-background .btn-next,
-.hy-el-pagination.is-background .hy-el-pager li {
-  border-radius: 50%;
-  background: rgba(var(--hy-background-2), 1);
-  color: rgba(var(--hy-main), 1);
-
-  &:hover {
-    color: rgba(var(--hy-theme), 1);
-  }
-}
-
-.hy-el-pagination.is-background .hy-el-pager li {
-  border-radius: 50%;
-  background: rgba(var(--hy-background-2), 1);
-  color: rgba(var(--hy-main), 1);
-
-  &:hover {
-    color: rgba(var(--hy-theme), 1);
-  }
-}
-
-.hy-el-pagination.is-background .btn-prev.is-active,
-.hy-el-pagination.is-background .btn-next.is-active,
-.hy-el-pagination.is-background .hy-el-pager li.is-active {
-  background: rgba(var(--hy-theme), .5);
-  box-shadow: 0 0 6px 0 rgba(var(--hy-theme), 1);
-  border: 1px solid rgba(var(--hy-theme), 1);
-  color: rgba(var(--hy-main), 1);
-
-}
-
-.hy-el-pagination__total {
-  color: rgba(var(--hy-main), 1);
-}
-
-.hy-el-pagination__jump {
-  color: rgba(var(--hy-main), 1);
-}
-
-.hy-el-pagination.is-background .btn-prev:disabled,
-.hy-el-pagination.is-background .btn-prev.is-disabled,
-.hy-el-pagination.is-background .btn-next:disabled,
-.hy-el-pagination.is-background .btn-next.is-disabled,
-.hy-el-pagination.is-background .hy-el-pager li:disabled,
-.hy-el-pagination.is-background .hy-el-pager li.is-disabled {
-  &:hover {
-    color: var(--hy-el-text-color-placeholder);
-  }
-}
-
-// 下拉框
-.hy-el-dropdown__popper.hy-el-popper {
-  --hy-el-border-color-light: rgba(var(--hy-border), 1);
-}
-
-.hy-el-dropdown-menu {
-  background-color: rgba(var(--hy-background-2), 1);
-
-  .hy-el-dropdown-menu__item {
-    &:hover {
-      background-color: rgba(var(--hy-background-3), 1);
-    }
-  }
-}
-
-.hy-el-dropdown-menu__item:not(.is-disabled):focus,
-.hy-el-dropdown-menu__item:not(.is-disabled):hover {
-  background-color: rgba(var(--hy-background-3), 1);
-}
-
-.hy-el-dialog {
-  --hy-el-dialog-bg-color: var(--hy-el-bg-color);
-  --hy-el-dialog-box-shadow: 0 0 12px 0 rgba(var(--hy-theme), 1);
-  box-shadow: 0 0 12px 0 transparent;
-  background-color: rgba(var(--hy-background), .7);
-  backdrop-filter: blur(2px);
-  border: 1px solid rgba(var(--hy-theme), 1);
-  padding: 0px;
-
-  &::before {
-    content: '';
-    position: absolute;
-    left: 2px;
-    top: 2px;
-    width: 24px;
-    height: 24px;
-    border-left: 1px solid;
-    border-top: 1px solid;
-    border-top-left-radius: 4px;
-    border-image: radial-gradient(circle at 16.27% 15.07%, rgba(var(--hy-theme), 1) 0%, rgba(56, 189, 227, 0) 100%) 1;
-    pointer-events: none;
-  }
-
-  &::after {
-    content: '';
-    position: absolute;
-    right: 2px;
-    top: 2px;
-    width: 24px;
-    height: 24px;
-    border-right: 1px solid;
-    border-top: 1px solid;
-    border-top-right-radius: 4px;
-    border-image: radial-gradient(circle at 83.73% 15.07%, rgba(var(--hy-theme), 1) 0%, rgba(56, 189, 227, 0) 100%) 1;
-    pointer-events: none;
-  }
-}
-
-.hy-el-dialog__body {
-  position: relative;
-  color: rgba(var(--hy-main), 1);
-
-  &::before {
-    content: '';
-    position: absolute;
-    left: 2px;
-    bottom: 2px;
-    width: 24px;
-    height: 24px;
-    border-left: 1px solid;
-    border-bottom: 1px solid;
-    border-bottom-left-radius: 4px;
-    border-image: radial-gradient(circle at 16.27% 84.93%, rgba(var(--hy-theme), 1) 0%, rgba(56, 189, 227, 0) 100%) 1;
-    pointer-events: none;
-  }
-
-  &::after {
-    content: '';
-    position: absolute;
-    right: 2px;
-    bottom: 2px;
-    width: 24px;
-    height: 24px;
-    border-right: 1px solid;
-    border-bottom: 1px solid;
-    border-bottom-right-radius: 4px;
-    border-image: radial-gradient(circle at 83.73% 84.93%, rgba(var(--hy-theme), 1) 0%, rgba(56, 189, 227, 0) 100%) 1;
-    pointer-events: none;
-  }
-}
-
-.hy-el-dialog__header {
-  padding: 0px !important;
-  position: relative;
-
-  &::after {
-    content: '';
-    position: absolute;
-    left: 50%;
-    top: 2px;
-    transform: translateX(-50%);
-    width: 36px;
-    height: 1px;
-    background: linear-gradient(90deg, rgba(45, 242, 255, 0) 0%, rgba(var(--hy-theme), 1) 10%, rgba(var(--hy-theme), 1) 90%, rgba(45, 242, 255, 0) 100%);
-    pointer-events: none;
-  }
-}
-
-.hy-el-dialog__title {
-  color: rgba(var(--hy-main), 1);
-}
-
-.hy-el-dialog__headerbtn .hy-el-dialog__close {
-  color: rgba(var(--hy-main), 1);
-}
-
-.hy-el-drawer__header {
-  color: rgba(var(--hy-main), 1);
-}
-
-//  .hy-el-drawer {
-//   --hy-el-drawer-bg-color: rgba(var(--hy-background-4), 1);
-//  }
-// 选项卡
-.hy-el-tabs {
-  border-radius: 6px 6px 0 0;
-  overflow: hidden;
-}
-
-.hy-el-tabs__nav-scroll {
-  background-color: rgba(var(--hy-background-2), 1);
-}
-
-.hy-el-tabs__nav-wrap::after {
-  background-color: rgba(var(--hy-background), 1);
-}
-
-.hy-el-tabs__active-bar {
-  background: transparent;
-}
-
-.hy-el-tabs .hy-el-tabs__item {
-  border-radius: 6px 6px 0 0;
-  border: 1px solid rgba(var(--hy-background-2), 1);
-  padding: 0 20px !important;
-
-  &:hover {
-    border-color: rgba(var(--hy-theme), .5);
-    box-shadow: inset 0 0 6px 0 rgba(var(--hy-theme), .5);
-  }
-}
-
-.hy-el-tabs__header {
-  margin: 0;
-}
-
-.hy-el-tabs__header .hy-el-tabs__item {
-  color: rgba(var(--hy-auxiliary), 1);
-  font-size: 14px;
-
-  &:hover {
-    color: rgba(var(--hy-main), 1);
-  }
-}
-
-.hy-el-tabs__content {
-  border-radius: 0 0 8px 8px;
-  overflow: hidden;
-  border: 1px solid rgba(var(--hy-background-2), 1);
-}
-
-.hy-el-tabs__item.is-active {
-  color: rgba(var(--hy-main), 1);
-  background-color: rgba(var(--hy-background-3), 1);
-  font-weight: 700;
-  position: relative;
-
-  &::after {
-    content: '';
-    position: absolute;
-    width: 100%;
-    height: 2px;
-    bottom: 0;
-    left: 0px;
-    border-radius: 999px;
-    background: linear-gradient(90deg,
-        rgba(45, 242, 255, 0) 0%,
-        rgba(var(--hy-theme), 1) 50%,
-        rgba(45, 242, 255, 0) 100%);
-    pointer-events: none;
-  }
-}
-
-.childrenTabs {
-  .hy-el-tabs {
-    border-radius: 6px 6px 0 0;
-    overflow: hidden;
-
-    .hy-el-tabs__nav-next,
-    .hy-el-tabs__nav-prev {
-      i::before {
-        top: 2px !important;
-      }
-    }
-
-    .hy-el-tabs__header {
-      margin: 0;
-
-      .hy-el-tabs__active-bar {
-        transform: translateX(0px);
-        height: 2px;
-        border-bottom: 3px solid;
-        border-image: linear-gradient(50deg,
-            rgba(0, 216, 247, 0) 0%,
-            rgba(var(--hy-theme), 1) 50%,
-            rgba(0, 216, 247, 0)) 2 2 2 2;
-        background: transparent;
-      }
-    }
-
-    .hy-el-tabs__content {
-      border-radius: 0 0 8px 8px;
-      overflow: hidden;
-      border: 0px solid rgba(var(--hy-border), 1);
-    }
-
-    .hy-el-tabs__item {
-      border-radius: 6px 6px 0px 0px;
-      border: 0px solid transparent;
-      padding: 0 20px !important;
-    }
-
-    .hy-el-tabs__item:hover {
-      color: #fff;
-      box-shadow: transparent 0px 1px 3px 0px inset;
-      border-bottom: 3px solid;
-      border-image: linear-gradient(50deg,
-          rgba(0, 216, 247, 0) 0%,
-          rgba(var(--hy-theme), 1) 40%,
-          rgba(0, 216, 247, 0) 80%) 2 2 2 2;
-    }
-
-    .is-active {
-      color: #fff !important;
-      background: transparent;
-      box-shadow: transparent 0px 1px 3px 0px inset;
-      border-bottom: 3px solid;
-      border-image: linear-gradient(50deg,
-          rgba(0, 216, 247, 0) 0%,
-          rgba(var(--hy-theme), 1) 40%,
-          rgba(0, 216, 247, 0) 80%) 2 2 2 2;
-
-      &::after {
-        content: '';
-        position: absolute;
-        width: 100%;
-        height: 0px;
-        bottom: 0;
-        left: 0px;
-      }
-    }
-
-    .hy-el-tabs__nav-wrap.is-scrollable,
-    .hy-el-tabs__nav-scroll {
-      background: transparent;
-    }
-  }
-}
-
-// 级联选择器
-.hy-el-cascader__dropdown {
-  --hy-el-border-color-light: rgba(var(--hy-border), 1);
-}
-
-.hy-el-cascader-panel {
-  --hy-el-cascader-menu-border: 1px solid rgba(var(--hy-border), 1);
-}
-
-// 表单
-.hy-el-form-item--label-top .hy-el-form-item__label {
-  width: 100%;
-  color: rgba(var(--hy-main), 1);
-}
-
-.hy-el-form-item.is-required:not(.is-no-asterisk).asterisk-left>.hy-el-form-item__label-wrap>.hy-el-form-item__label:before {
-  color: transparent;
-  margin-right: 0px;
-  display: none;
-}
-
-.hy-el-form-item.is-required:not(.is-no-asterisk).asterisk-left>.hy-el-form-item__label:before {
-  color: transparent;
-  margin-right: 0px;
-  display: none;
-}
-
-.hy-el-form-item.is-required:not(.is-no-asterisk).asterisk-left>.hy-el-form-item__label .form-label {
-  font-size: 14px;
-  color: rgba(var(--hy-main), 1);
-
-  &::after {
-    content: '*';
-    color: rgba(var(--hy-danger), 1);
-    margin-left: 4px;
-  }
-}
-
-
-
-// .hy-el-switch {
-//   // --hy-el-switch-on-color: rgba(var(--hy-success-2), 1);
-//   // --hy-el-switch-off-color: rgba(var(--hy-background-3), 1);
-// }
-
-// .hy-el-switch__core {
-//   border: 1px solid var(--hy-el-switch-border-color, rgba(var(--hy-border), 1));
-// }
-
-// .hy-el-switch.is-checked .hy-el-switch__core {
-//   border-color: var(--hy-el-switch-border-color, rgba(var(--hy-auxiliary), 1));
-
-//   .hy-el-switch__inner-wrapper {
-//     color: rgba(var(--hy-main), 1);
-//   }
-// }
-
-// .hy-el-switch__core .hy-el-switch__inner-wrapper {
-//   color: rgba(var(--hy-auxiliary), 1);
-// }
-
-/* 折叠 */
-.collapse-item__header_lightColor.hy-el-collapse {
-
-  border-bottom: 1px solid transparent;
-  border-top: 1px solid transparent;
-
-  .hy-el-collapse-item {
-    margin-top: 8px;
-    border-radius: 6px;
-    overflow: hidden;
-
-    .hy-el-collapse-item__header {
-      border-bottom: 1px solid transparent;
-      color: rgba(var(--hy-main), 1);
-      line-height: inherit;
-      text-align: left;
-      font-size: 14px;
-      font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
-      font-weight: 700;
-      display: flex;
-      justify-content: space-between;
-      position: relative;
-      height: 38px;
-      padding-left: 20px;
-    }
-
-    .hy-el-collapse-item__wrap {
-      border-bottom: 0px solid transparent;
-
-      .hy-el-collapse-item__content {
-        padding-bottom: 0px;
-      }
-    }
-
-  }
-}
-
-// 日历
-.hy-el-calendar {
-  background-color: rgba(var(--hy-background), 1);
-  --hy-el-calendar-border: var(--hy-el-table-border, 1px solid rgba(157, 167, 178, .5));
-
-  .hy-el-calendar__body {
-    padding: 0px;
-  }
-
-  .hy-el-calendar-table {
-    color: rgba(var(--hy-info), 1);
-
-    thead th {
-      color: rgba(var(--hy-main), 1);
-    }
-
-
-    td.is-selected {
-      box-shadow: 0px 0 12px 0px rgba(var(--hy-theme), 1) inset;
-      background: rgba(var(--hy-background-2), 1);
-      .hy-el-calendar-day {
-        border: 1px solid rgba(var(--hy-theme), 1);
-      }
-    }
-
-    td.is-today {
-      color: rgba(var(--hy-info), 1);
-    }
-
-    td.current {
-      background-color: rgba(var(--hy-background-2), 1);
-    }
-
-    .hy-el-calendar-day:hover {
-      border: 1px solid rgba(var(--hy-theme), 1);
-      box-shadow: 0px 0 12px 0px rgba(var(--hy-theme), 1) inset;
-      background: rgba(var(--hy-background-2), 1);
-    }
-
-    &:not(.is-range) td.next,
-    &:not(.is-range) td.prev {
-      background: rgba(var(--hy-background), 1);
-
-      .hy-el-calendar-day:hover {
-        background: rgba(var(--hy-background), 1);
-      }
-    }
-
-  }
-}