yuang-framework-ui-pc 1.0.19 → 1.2.1

package/es/ele-app/style/common/index.scss

@@ -0,0 +1,55 @@
+/* 表单组件宽度撑满 */
+.ele-fluid {
+  width: 100%;
+  box-sizing: border-box;
+
+  &.el-select,
+  &.el-input-number,
+  &.el-date-editor,
+  &.el-date-editor.el-input,
+  &.el-date-editor.el-input__wrapper,
+  &.el-date-editor > .el-input__wrapper {
+    width: 100%;
+    box-sizing: border-box;
+  }
+
+  /* 日期选择 */
+  &.el-date-editor {
+    &.el-input__wrapper {
+      width: 100%;
+      box-sizing: border-box;
+    }
+
+    .el-range-input {
+      flex: 1;
+      width: 100%;
+    }
+
+    .el-range-separator {
+      flex: 0;
+    }
+
+    & > .el-input__icon {
+      flex-shrink: 0;
+    }
+  }
+
+  /* 数字输入框 */
+  &.el-input-number.is-controls-right .el-input__inner {
+    text-align: left;
+  }
+}
+
+/* 隐藏滚动条 */
+.ele-scrollbar-hide,
+.ele-scrollbar-hover:not(:hover) {
+  scrollbar-width: none;
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+}
+
+.ele-scrollbar-hover {
+  overflow: auto;
+}

package/es/ele-app/style/css-var.scss

@@ -0,0 +1,11 @@
+@use '../../style/util.scss' as *;
+@use './message/css-var.scss' as *;
+@use './overwrite/css-var.scss' as *;
+@use './scrollbar/css-var.scss' as *;
+
+/* App 主题变量 */
+@mixin set-app-var($var) {
+  @include set-scrollbar-var($var);
+  @include set-overwrite-var($var);
+  @include set-message-var($var);
+}

package/es/ele-app/style/index.d.ts

@@ -0,0 +1 @@
+

package/es/ele-app/style/index.js

@@ -0,0 +1,4 @@
+import "./overwrite/index";
+import "./scrollbar/index";
+import "./common/index";
+import "./message/index";

package/es/ele-app/style/index.scss

@@ -0,0 +1,4 @@
+@use './overwrite/index.scss' as overwrite;
+@use './scrollbar/index.scss' as scrollbar;
+@use './common/index.scss' as common;
+@use './message/index.scss' as message;

package/es/ele-app/style/message/css-var.scss

@@ -0,0 +1,8 @@
+@use '../../../style/util.scss' as *;
+
+/* 消息提示主题变量 */
+@mixin set-message-var($var) {
+  .ele-message {
+    @include set-ele-var('message', $var);
+  }
+}

package/es/ele-app/style/message/index.d.ts

@@ -0,0 +1 @@
+

package/es/ele-app/style/message/index.js

@@ -0,0 +1,2 @@
+import "element-plus/es/components/message/style/index";
+import "./index.scss";

package/es/ele-app/style/message/index.scss

@@ -0,0 +1,261 @@
+@use '../../../style/themes/default.scss' as *;
+@use '../../../style/util.scss' as *;
+@use './css-var.scss' as *;
+
+@include set-message-var($ele);
+
+.ele-message.el-message {
+  gap: 0;
+  padding: 0;
+  border: none;
+  border-radius: 0;
+  background: none;
+  width: max-content;
+  pointer-events: auto;
+  align-items: flex-start;
+  margin: 0 auto eleVar('message', 'space') auto;
+  transition: margin-bottom 0.2s;
+  position: static !important;
+  left: auto !important;
+  top: auto !important;
+  transform: none;
+  opacity: 1;
+
+  & > .el-message__content {
+    display: none;
+  }
+
+  /* 徽章 */
+  & > .el-message__badge {
+    position: relative;
+    top: auto;
+    right: auto;
+    width: 0;
+    height: 0;
+    overflow: visible;
+    order: 2;
+    z-index: calc(#{eleVar('message', 'index')} + 2);
+    transition: (
+      margin-top 0.4s,
+      transform elVar('transition-duration'),
+      opacity elVar('transition-duration')
+    );
+
+    & > .el-badge__content {
+      position: absolute;
+      top: 8px;
+      right: -8px;
+      transform: translateY(-100%);
+    }
+  }
+
+  /* 主体 */
+  & > .el-message__icon {
+    width: auto;
+    height: auto;
+    max-width: 100%;
+    line-height: normal;
+    font-style: normal;
+    display: flex;
+    flex-shrink: 0;
+    color: eleVar('message', 'color');
+    font-size: eleVar('message', 'size');
+    padding: eleVar('message', 'padding');
+    box-shadow: eleVar('message', 'shadow');
+    border-radius: eleVar('message', 'radius');
+    background: elVar('color-primary', 'light-9');
+    border: 0 solid elVar('color-primary', 'light-8');
+    z-index: calc(#{eleVar('message', 'index')} + 1);
+    transition: (
+      margin-top 0.4s,
+      transform elVar('transition-duration'),
+      opacity elVar('transition-duration')
+    );
+    box-sizing: border-box;
+    position: relative;
+  }
+}
+
+.ele-message + .ele-message {
+  margin-top: 0 !important;
+}
+
+/* 图标 */
+.ele-message-icon {
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: elVar('color-primary');
+  font-size: eleVar('message', 'icon-size');
+  margin: eleVar('message', 'icon-margin');
+}
+
+/* 关闭按钮 */
+.ele-message-close {
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: eleVar('message', 'close-size');
+  height: eleVar('message', 'close-size');
+  line-height: eleVar('message', 'close-size');
+  color: eleVar('message', 'close-color');
+  font-size: eleVar('message', 'close-font-size');
+  margin: eleVar('message', 'close-margin');
+  border-radius: eleVar('message', 'close-radius');
+  transition: (color $transition-base, background-color $transition-base);
+  cursor: pointer;
+
+  &:hover {
+    color: eleVar('message', 'close-hover-color');
+    background: eleVar('message', 'close-hover-bg');
+  }
+}
+
+/* 情景色类型 */
+.ele-message.el-message--success > .el-message__icon {
+  background: elVar('color-success', 'light-9');
+  border-color: elVar('color-success', 'light-7');
+
+  & > .ele-message-icon {
+    color: elVar('color-success');
+  }
+}
+
+.ele-message.el-message--warning > .el-message__icon {
+  background: elVar('color-warning', 'light-9');
+  border-color: elVar('color-warning', 'light-7');
+
+  & > .ele-message-icon {
+    color: elVar('color-warning');
+  }
+}
+
+.ele-message.el-message--error > .el-message__icon {
+  background: elVar('color-error', 'light-9');
+  border-color: elVar('color-error', 'light-7');
+
+  & > .ele-message-icon {
+    color: elVar('color-error');
+  }
+}
+
+.ele-message.el-message--info > .el-message__badge > .el-badge__content,
+.ele-message.is-loading > .el-message__badge > .el-badge__content {
+  background: elVar('color-primary');
+}
+
+/* 简约风格 */
+.ele-message.is-plain.el-message {
+  background: none;
+  box-shadow: none;
+}
+
+.ele-message.is-plain > .el-message__icon,
+.ele-message.is-plain-alert > .el-message__icon {
+  background: eleVar('message', 'plain-bg');
+}
+
+/* 彩色风格 */
+.ele-message.is-alert > .el-message__icon {
+  color: elVar('color-primary');
+  padding: eleVar('message', 'alert-padding');
+  border-width: 1px;
+  box-shadow: none;
+}
+
+.ele-message.is-plain-alert > .el-message__icon {
+  color: elVar('color-primary');
+}
+
+.el-message--success.is-alert > .el-message__icon,
+.el-message--success.is-plain-alert > .el-message__icon {
+  color: elVar('color-success');
+}
+
+.el-message--warning.is-alert > .el-message__icon,
+.el-message--warning.is-plain-alert > .el-message__icon {
+  color: elVar('color-warning');
+}
+
+.el-message--error.is-alert > .el-message__icon,
+.el-message--error.is-plain-alert > .el-message__icon {
+  color: elVar('color-error');
+}
+
+/* 加载框 */
+.ele-message.is-loading::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  transition: opacity elVar('transition-duration');
+  z-index: eleVar('message', 'index');
+}
+
+/* 遮罩 */
+.ele-message.is-show-mask::before {
+  background: eleVar('message', 'mask-color');
+}
+
+/* 居中 */
+.ele-message.is-centered {
+  margin: 0 !important;
+  position: absolute !important;
+  top: 0 !important;
+  left: 0 !important;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  max-width: none;
+  align-items: center;
+  justify-content: center;
+
+  &.el-message-fade-enter-from > .el-message__icon,
+  &.el-message-fade-leave-to > .el-message__icon {
+    transform: scale(0.6);
+    margin-top: 0;
+  }
+}
+
+/* 进入和关闭动画 */
+.ele-message.el-message-fade-enter-from,
+.ele-message.el-message-fade-leave-to {
+  margin-bottom: 0;
+
+  & > .el-message__icon,
+  & > .el-message__badge {
+    opacity: 0;
+    margin-top: -88px;
+  }
+
+  &::before {
+    opacity: 0;
+  }
+}
+
+/* 容器 */
+.ele-message-wrapper {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  pointer-events: none;
+  overflow: hidden;
+
+  & > .ele-message:first-child {
+    margin-top: eleVar('message', 'space');
+  }
+
+  &.is-hide {
+    display: none;
+  }
+}

package/es/ele-app/style/overwrite/autocomplete/css-var.scss

@@ -0,0 +1,8 @@
+@use '../../../../style/util.scss' as *;
+
+/* ElAutocomplete 主题变量 */
+@mixin set-el-autocomplete-var($var) {
+  .el-autocomplete__popper {
+    @include set-ele-var('autocomplete', $var);
+  }
+}

package/es/ele-app/style/overwrite/autocomplete/index.d.ts

@@ -0,0 +1 @@
+

package/es/ele-app/style/overwrite/autocomplete/index.js

@@ -0,0 +1 @@
+import "./index.scss";

package/es/ele-app/style/overwrite/autocomplete/index.scss

@@ -0,0 +1,33 @@
+@use '../../../../style/themes/default.scss' as *;
+@use '../../../../style/util.scss' as *;
+@use './css-var.scss' as *;
+
+@include set-el-autocomplete-var($ele);
+
+/* Autocomplete */
+.el-autocomplete__popper {
+  .el-autocomplete-suggestion {
+    background: inherit;
+    border-radius: inherit;
+  }
+
+  .el-autocomplete-suggestion__wrap {
+    padding: 0;
+  }
+
+  .el-autocomplete-suggestion__list {
+    padding: eleVar('autocomplete', 'padding');
+  }
+
+  .el-autocomplete-suggestion li {
+    height: eleVar('autocomplete', 'item-height');
+    line-height: eleVar('autocomplete', 'item-height');
+    padding: eleVar('autocomplete', 'item-padding');
+    border-radius: eleVar('autocomplete', 'item-radius');
+    transition: (color $transition-base, background-color $transition-base);
+
+    & + li {
+      margin-top: eleVar('autocomplete', 'item-margin');
+    }
+  }
+}

package/es/ele-app/style/overwrite/backtop/index.d.ts

@@ -0,0 +1 @@
+

package/es/ele-app/style/overwrite/backtop/index.js

@@ -0,0 +1 @@
+import "./index.scss";

package/es/ele-app/style/overwrite/backtop/index.scss

@@ -0,0 +1,8 @@
+@use '../../../../style/themes/default.scss' as *;
+@use '../../../../style/util.scss' as *;
+
+/* Backtop */
+body .el-backtop {
+  box-shadow: elVar('box-shadow', 'light');
+  transition: (color $transition-base, background-color $transition-base);
+}

package/es/ele-app/style/overwrite/cascader/css-var.scss

@@ -0,0 +1,8 @@
+@use '../../../../style/util.scss' as *;
+
+/* ElCascader 主题变量 */
+@mixin set-el-cascader-var($var) {
+  .el-cascader__dropdown {
+    @include set-ele-var('cascader', $var);
+  }
+}

package/es/ele-app/style/overwrite/cascader/index.d.ts

@@ -0,0 +1 @@
+

package/es/ele-app/style/overwrite/cascader/index.js

@@ -0,0 +1 @@
+import "./index.scss";

package/es/ele-app/style/overwrite/cascader/index.scss

@@ -0,0 +1,166 @@
+@use '../../../../style/themes/default.scss' as *;
+@use '../../../../style/util.scss' as *;
+@use './css-var.scss' as *;
+
+@include set-el-cascader-var($ele);
+
+/* Cascader */
+.el-cascader__dropdown {
+  .el-cascader-panel,
+  .el-cascader__suggestion-panel {
+    background: inherit;
+    border-radius: inherit;
+  }
+
+  .el-cascader-menu__list {
+    padding: eleVar('cascader', 'menu-padding');
+  }
+
+  .el-cascader-node {
+    height: eleVar('cascader', 'item-height');
+    line-height: eleVar('cascader', 'item-height');
+    padding: eleVar('cascader', 'item-padding');
+    border-radius: eleVar('cascader', 'item-radius');
+    transition: (color $transition-base, background-color $transition-base);
+
+    & > .el-checkbox,
+    & > .el-radio {
+      margin-right: 8px;
+    }
+
+    & + .el-cascader-node {
+      margin-top: eleVar('cascader', 'item-margin');
+    }
+
+    &.in-active-path,
+    &.is-selectable.in-checked-path,
+    &.is-active {
+      background: eleVar('cascader', 'item-active-bg');
+      font-weight: eleVar('cascader', 'item-active-font-weight');
+
+      &:hover,
+      &:focus {
+        background: eleVar('cascader', 'item-active-hover-bg');
+      }
+    }
+  }
+
+  .el-cascader-menu:last-child .el-cascader-node {
+    padding: eleVar('cascader', 'item-padding');
+  }
+
+  .el-cascader-node__label {
+    padding: 0;
+  }
+
+  .el-cascader-node__prefix {
+    order: 4;
+    margin-right: -4px;
+    position: static;
+    left: auto;
+  }
+
+  .el-cascader-node__postfix {
+    margin-right: -6px;
+    position: static;
+    right: auto;
+  }
+
+  .el-cascader__suggestion-list {
+    padding: eleVar('cascader', 'menu-padding');
+  }
+
+  .el-cascader__suggestion-item {
+    height: eleVar('cascader', 'item-height');
+    line-height: eleVar('cascader', 'item-height');
+    padding: eleVar('cascader', 'item-padding');
+    border-radius: eleVar('cascader', 'item-radius');
+
+    & > span {
+      flex: 1;
+      margin-right: 0;
+    }
+
+    & > .el-icon {
+      margin-right: -4px;
+    }
+
+    & + .el-cascader__suggestion-item {
+      margin-top: eleVar('cascader', 'item-margin');
+    }
+
+    &.is-checked {
+      background: eleVar('cascader', 'item-active-bg');
+      font-weight: eleVar('cascader', 'item-active-font-weight');
+    }
+  }
+}
+
+.el-cascader > .el-input .el-input__inner {
+  margin: -2px 0;
+  min-height: calc(#{elVar('input', 'height')} + 2px);
+}
+
+/* 多选标签 */
+.el-cascader__tags .el-tag__content,
+.el-cascader__collapse-tag .el-tag__content {
+  display: inline-flex;
+  align-items: center;
+  line-height: 14px;
+}
+
+.el-cascader .el-cascader__tags {
+  padding: 0 0 0 4px;
+}
+
+.el-cascader .el-cascader__tags .el-tag,
+.el-cascader__collapse-tags .el-cascader__collapse-tag .el-tag {
+  flex-shrink: 0;
+  margin: 2px 4px 2px 0;
+  height: calc(elVar('component-size') - 4px - 4px);
+  border: none;
+}
+
+.el-cascader__tags .el-cascader__search-input {
+  margin: 2px 0 2px 5.8px;
+}
+
+/* 小尺寸 */
+.el-cascader--small .el-cascader__tags .el-cascader__search-input {
+  height: 18px;
+  margin-top: 1px;
+  margin-bottom: 1px;
+  margin-left: 3.8px;
+}
+
+.el-cascader--small .el-cascader__tags .el-tag,
+.el-cascader__collapse-tags .el-cascader__collapse-tag .el-tag--small {
+  margin: 1px 4px 1px 0;
+  height: calc(elVar('component-size', 'small') - 4px - 2px);
+}
+
+/* 大尺寸 */
+.el-cascader--large .el-cascader__tags {
+  padding: 1px 0 1px 6px;
+}
+
+.el-cascader--large .el-cascader__tags .el-tag {
+  height: calc(elVar('component-size', 'large') - 8px - 4px);
+}
+
+.el-cascader--large .el-cascader__tags .el-cascader__search-input {
+  margin-left: 7.8px;
+}
+
+/* 多选搜索框 */
+.el-cascader__tags .el-tag + .el-cascader__search-input {
+  margin-left: 2px;
+}
+
+/* 标签溢出气泡 */
+.el-popper > .el-cascader__collapse-tags {
+  margin: -5px -11px;
+  padding: 8px 10px;
+  background: inherit;
+  border-radius: inherit;
+}

package/es/ele-app/style/overwrite/checkbox/css-var.scss

@@ -0,0 +1,8 @@
+@use '../../../../style/util.scss' as *;
+
+/* ElCheckbox 主题变量 */
+@mixin set-el-checkbox-var($var) {
+  .el-checkbox {
+    @include set-ele-var('checkbox', $var);
+  }
+}

package/es/ele-app/style/overwrite/checkbox/index.d.ts

@@ -0,0 +1 @@
+

package/es/ele-app/style/overwrite/checkbox/index.js

@@ -0,0 +1 @@
+import "./index.scss";