|
@@ -1,16 +1,19 @@
|
|
|
// form-item 进行校验的时候加上边框颜色
|
|
// form-item 进行校验的时候加上边框颜色
|
|
|
.is-error {
|
|
.is-error {
|
|
|
|
|
+
|
|
|
.el-input.el-input--mini,
|
|
.el-input.el-input--mini,
|
|
|
.el-input.el-input--small,
|
|
.el-input.el-input--small,
|
|
|
.el-input.el-input--medium {
|
|
.el-input.el-input--medium {
|
|
|
border-color: #ff4d4f;
|
|
border-color: #ff4d4f;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// input start
|
|
// input start
|
|
|
// 处理input禁用样式
|
|
// 处理input禁用样式
|
|
|
.el-input.is-disabled {
|
|
.el-input.is-disabled {
|
|
|
background-color: #f6f8f9;
|
|
background-color: #f6f8f9;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// 处理input显示输入字数统计,遮挡文本内容的问题
|
|
// 处理input显示输入字数统计,遮挡文本内容的问题
|
|
|
.el-input.el-input--mini,
|
|
.el-input.el-input--mini,
|
|
|
.el-input.el-input--small,
|
|
.el-input.el-input--small,
|
|
@@ -20,6 +23,7 @@
|
|
|
display: inline-flex !important;
|
|
display: inline-flex !important;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
|
|
|
+
|
|
|
input {
|
|
input {
|
|
|
border-width: 0 !important;
|
|
border-width: 0 !important;
|
|
|
padding: 0 8px !important;
|
|
padding: 0 8px !important;
|
|
@@ -38,10 +42,6 @@
|
|
|
white-space: nowrap;
|
|
white-space: nowrap;
|
|
|
|
|
|
|
|
span.el-input__suffix-inner {
|
|
span.el-input__suffix-inner {
|
|
|
- display: flex;
|
|
|
|
|
- flex-direction: column;
|
|
|
|
|
- align-items: flex-end;
|
|
|
|
|
-
|
|
|
|
|
.el-input__count-inner {
|
|
.el-input__count-inner {
|
|
|
// padding-left: 0;
|
|
// padding-left: 0;
|
|
|
transform: translate(5px);
|
|
transform: translate(5px);
|
|
@@ -49,34 +49,39 @@
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
// 处理 clearable 和 show-password 样式冲突
|
|
// 处理 clearable 和 show-password 样式冲突
|
|
|
- span.el-input__suffix-inner:has(.el-icon-view) {
|
|
|
|
|
- padding-left: 5px;
|
|
|
|
|
- white-space: nowrap;
|
|
|
|
|
- display: block;
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ // span.el-input__suffix-inner:has(.el-icon-view) {
|
|
|
|
|
+ // padding-left: 5px;
|
|
|
|
|
+ // white-space: nowrap;
|
|
|
|
|
+ // display: block;
|
|
|
|
|
+ // }
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// 设置图标区域的行高
|
|
// 设置图标区域的行高
|
|
|
$sizes: (
|
|
$sizes: (
|
|
|
"mini": 28px,
|
|
"mini": 28px,
|
|
|
"small": 32px,
|
|
"small": 32px,
|
|
|
"medium": 36px,
|
|
"medium": 36px,
|
|
|
);
|
|
);
|
|
|
|
|
+
|
|
|
@each $size, $height in $sizes {
|
|
@each $size, $height in $sizes {
|
|
|
.el-input--#{$size} {
|
|
.el-input--#{$size} {
|
|
|
|
|
+
|
|
|
.el-input__prefix,
|
|
.el-input__prefix,
|
|
|
.el-input__suffix {
|
|
.el-input__suffix {
|
|
|
height: $height;
|
|
height: $height;
|
|
|
line-height: $height;
|
|
line-height: $height;
|
|
|
|
|
+
|
|
|
.el-input__suffix-inner,
|
|
.el-input__suffix-inner,
|
|
|
.el-input-group__append {
|
|
.el-input-group__append {
|
|
|
height: $height;
|
|
height: $height;
|
|
|
line-height: $height;
|
|
line-height: $height;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// 前置
|
|
// 前置
|
|
|
- .el-input-group__prepend ,
|
|
|
|
|
- // 后置
|
|
|
|
|
|
|
+ .el-input-group__prepend,
|
|
|
|
|
+ // 后置
|
|
|
.el-input-group__append {
|
|
.el-input-group__append {
|
|
|
height: $height;
|
|
height: $height;
|
|
|
line-height: $height;
|
|
line-height: $height;
|
|
@@ -94,9 +99,10 @@ $sizes: (
|
|
|
padding: 0 30px 0 15px !important;
|
|
padding: 0 30px 0 15px !important;
|
|
|
flex: 1;
|
|
flex: 1;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// 前置
|
|
// 前置
|
|
|
- .el-input-group__prepend ,
|
|
|
|
|
- // 后置
|
|
|
|
|
|
|
+ .el-input-group__prepend,
|
|
|
|
|
+ // 后置
|
|
|
.el-input-group__append {
|
|
.el-input-group__append {
|
|
|
border-width: 0;
|
|
border-width: 0;
|
|
|
padding: 0 20px;
|
|
padding: 0 20px;
|
|
@@ -107,6 +113,7 @@ $sizes: (
|
|
|
.el-input-group__prepend {
|
|
.el-input-group__prepend {
|
|
|
border-right: 1px solid #dcdfe6;
|
|
border-right: 1px solid #dcdfe6;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// 后置
|
|
// 后置
|
|
|
.el-input-group__append {
|
|
.el-input-group__append {
|
|
|
border-left: 1px solid #dcdfe6;
|
|
border-left: 1px solid #dcdfe6;
|
|
@@ -123,19 +130,23 @@ $sizes: (
|
|
|
// 登录页面输入框有边框
|
|
// 登录页面输入框有边框
|
|
|
.login-form {
|
|
.login-form {
|
|
|
.el-form-item {
|
|
.el-form-item {
|
|
|
|
|
+
|
|
|
.el-input.el-input--mini,
|
|
.el-input.el-input--mini,
|
|
|
.el-input.el-input--small,
|
|
.el-input.el-input--small,
|
|
|
.el-input.el-input--medium {
|
|
.el-input.el-input--medium {
|
|
|
border-width: 0;
|
|
border-width: 0;
|
|
|
|
|
+
|
|
|
input {
|
|
input {
|
|
|
padding: 0 30px 0 15px !important;
|
|
padding: 0 30px 0 15px !important;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- i.show-password {
|
|
|
|
|
|
|
+
|
|
|
|
|
+ i.ri-eye-off-line {
|
|
|
top: 0 !important;
|
|
top: 0 !important;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// input end
|
|
// input end
|
|
|
|
|
|
|
|
// date-picker start
|
|
// date-picker start
|
|
@@ -145,12 +156,21 @@ $sizes: (
|
|
|
margin-left: 25px !important;
|
|
margin-left: 25px !important;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+// 处理前置的问题
|
|
|
|
|
+.el-date-editor.el-input--prefix {
|
|
|
|
|
+ input {
|
|
|
|
|
+ margin-left: 0 !important;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
// 处理时间范围选择组件 placeholder文本被遮挡的问题
|
|
// 处理时间范围选择组件 placeholder文本被遮挡的问题
|
|
|
.el-range-editor {
|
|
.el-range-editor {
|
|
|
.el-range-separator {
|
|
.el-range-separator {
|
|
|
width: max-content;
|
|
width: max-content;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// date-picker end
|
|
// date-picker end
|
|
|
|
|
|
|
|
// textarea start
|
|
// textarea start
|
|
@@ -159,8 +179,9 @@ $sizes: (
|
|
|
.el-textarea.el-input--small,
|
|
.el-textarea.el-input--small,
|
|
|
.el-textarea.el-input--medium {
|
|
.el-textarea.el-input--medium {
|
|
|
position: relative;
|
|
position: relative;
|
|
|
- textarea {
|
|
|
|
|
- }
|
|
|
|
|
|
|
+
|
|
|
|
|
+ textarea {}
|
|
|
|
|
+
|
|
|
.el-input__count {
|
|
.el-input__count {
|
|
|
position: relative;
|
|
position: relative;
|
|
|
display: block;
|
|
display: block;
|
|
@@ -169,6 +190,7 @@ $sizes: (
|
|
|
text-align: right;
|
|
text-align: right;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// textarea end
|
|
// textarea end
|
|
|
|
|
|
|
|
// input-number start
|
|
// input-number start
|
|
@@ -176,29 +198,34 @@ $sizes: (
|
|
|
.el-input-number--#{$size} {
|
|
.el-input-number--#{$size} {
|
|
|
height: $height;
|
|
height: $height;
|
|
|
line-height: $height;
|
|
line-height: $height;
|
|
|
|
|
+
|
|
|
.el-input--#{$size} {
|
|
.el-input--#{$size} {
|
|
|
.el-input__inner {
|
|
.el-input__inner {
|
|
|
padding: 0 calc(#{$height} + 5px) !important;
|
|
padding: 0 calc(#{$height} + 5px) !important;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// 控制器在右侧的时候,会有间隔
|
|
// 控制器在右侧的时候,会有间隔
|
|
|
.is-controls-right {
|
|
.is-controls-right {
|
|
|
.el-input--#{$size} {
|
|
.el-input--#{$size} {
|
|
|
height: $height;
|
|
height: $height;
|
|
|
line-height: $height;
|
|
line-height: $height;
|
|
|
|
|
+
|
|
|
.el-input__inner {
|
|
.el-input__inner {
|
|
|
padding: 0 calc(#{$height} + 5px) 0 8px !important;
|
|
padding: 0 calc(#{$height} + 5px) 0 8px !important;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
// input-number end
|
|
// input-number end
|
|
|
|
|
|
|
|
// 处理单选框的报错 Blocked aria-hidden on an element because its descendant retained focus.
|
|
// 处理单选框的报错 Blocked aria-hidden on an element because its descendant retained focus.
|
|
|
input[aria-hidden="true"] {
|
|
input[aria-hidden="true"] {
|
|
|
display: none !important;
|
|
display: none !important;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner {
|
|
.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner {
|
|
|
box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
|
-}
|
|
|
|
|
|
|
+}
|