inputGroup 下 input 样式错乱问题修复

This commit is contained in:
liaoxuezhi 2019-11-01 14:22:22 +08:00
parent d33c3f1795
commit eba8b0379b
1 changed files with 8 additions and 13 deletions

View File

@ -17,10 +17,8 @@
&-addOn { &-addOn {
background: $InputGroup-addOn-bg; background: $InputGroup-addOn-bg;
border: $InputGroup-addOn-borderWidth solid border: $InputGroup-addOn-borderWidth solid $InputGroup-addOn-borderColor;
$InputGroup-addOn-borderColor; line-height: $InputGroup-height - $InputGroup-paddingY * 2 - $InputGroup-addOn-borderWidth * 2;
line-height: $InputGroup-height - $InputGroup-paddingY * 2 -
$InputGroup-addOn-borderWidth * 2;
height: $InputGroup-height; height: $InputGroup-height;
box-sizing: border-box; box-sizing: border-box;
padding: $InputGroup-paddingY $InputGroup-paddingX; padding: $InputGroup-paddingY $InputGroup-paddingX;
@ -47,8 +45,7 @@
&-btn { &-btn {
.#{$ns}Button { .#{$ns}Button {
border-radius: 0; border-radius: 0;
border: $InputGroup-button-borderWidth solid border: $InputGroup-button-borderWidth solid $InputGroup-button-borderColor;
$InputGroup-button-borderColor;
} }
&:not(:last-child) .#{$ns}Button { &:not(:last-child) .#{$ns}Button {
@ -73,6 +70,7 @@
.#{$ns}TextControl-input { .#{$ns}TextControl-input {
flex-basis: 0; flex-basis: 0;
flex-grow: 1; flex-grow: 1;
display: inline-flex;
&:not(:first-child) { &:not(:first-child) {
border-top-left-radius: 0; border-top-left-radius: 0;
@ -90,9 +88,7 @@
@if $InputGroup-select-borderWidth { @if $InputGroup-select-borderWidth {
.#{$ns}Select { .#{$ns}Select {
background-color: $InputGroup-select-bg; background-color: $InputGroup-select-bg;
border: $InputGroup-select-borderWidth border: $InputGroup-select-borderWidth solid $InputGroup-select-borderColor;
solid
$InputGroup-select-borderColor;
@if $InputGroup-select-color !=$Form-select-color { @if $InputGroup-select-color !=$Form-select-color {
color: $InputGroup-select-color; color: $InputGroup-select-color;
@ -137,6 +133,7 @@
} }
&.is-focused { &.is-focused {
.#{$ns}InputGroup-addOn, .#{$ns}InputGroup-addOn,
.#{$ns}TextControl-input, .#{$ns}TextControl-input,
.#{$ns}Select, .#{$ns}Select,
@ -156,9 +153,7 @@
} }
} }
@if $InputGroup-select-onFocused-arrowColor @if $InputGroup-select-onFocused-arrowColor !=$Form-select-caret-iconColor {
!=$Form-select-caret-iconColor
{
.#{$ns}Select-arrow { .#{$ns}Select-arrow {
color: $InputGroup-select-onFocused-arrowColor; color: $InputGroup-select-onFocused-arrowColor;
} }
@ -172,4 +167,4 @@
.#{$ns}InputGroup:not(.is-inline) { .#{$ns}InputGroup:not(.is-inline) {
display: flex; display: flex;
} }