@import '../mixin/flex.scss';
|
|
@import '../mixin/color.scss';
|
|
|
|
@mixin required {
|
|
&.se-input-required {
|
|
::before {
|
|
content: '*';
|
|
color: $red;
|
|
}
|
|
}
|
|
}
|
|
|
|
@mixin name {
|
|
.se-input-name {
|
|
min-width: 80rpx;
|
|
|
|
&::after {
|
|
content: ':';
|
|
}
|
|
}
|
|
}
|
|
|
|
@mixin icon {
|
|
.se-input-icon {
|
|
font-size: 20rpx;
|
|
}
|
|
}
|
|
|
|
@mixin input {
|
|
.se-input-inner {
|
|
-webkit-appearance: none;
|
|
flex: 1;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: transparent;
|
|
color: $c-99;
|
|
|
|
&::-webkit-input-placeholder {
|
|
color: $c-99;
|
|
}
|
|
|
|
&:disabled {
|
|
-webkit-opacity: 1;
|
|
-webkit-text-fill-color: $c-99;
|
|
background-color: transparent;
|
|
color: $c-99;
|
|
}
|
|
}
|
|
}
|
|
|
|
.se {
|
|
&-input {
|
|
&-s {
|
|
@include flex-h-c;
|
|
@include required;
|
|
@include name;
|
|
@include icon;
|
|
@include input;
|
|
height: 30rpx;
|
|
}
|
|
|
|
&-m {
|
|
@include flex-h-c;
|
|
@include required;
|
|
@include name;
|
|
@include icon;
|
|
@include input;
|
|
height: 40rpx;
|
|
}
|
|
|
|
&-l {
|
|
@include flex-h-c;
|
|
@include required;
|
|
@include name;
|
|
@include icon;
|
|
@include input;
|
|
height: 50rpx;
|
|
}
|
|
}
|
|
|
|
&-textarea {
|
|
@include flex-h-c;
|
|
@include required;
|
|
@include name;
|
|
@include icon;
|
|
@include input;
|
|
}
|
|
}
|