diff --git a/components/form/style/index.less b/components/form/style/index.less index fae3a7b888..9d73b52e1f 100644 --- a/components/form/style/index.less +++ b/components/form/style/index.less @@ -455,6 +455,9 @@ form { .@{ant-prefix}-select { &-selection { border-color: @warning-color; + &:hover { + border-color: @warning-color; + } } &-open .@{ant-prefix}-select-selection, &-focused .@{ant-prefix}-select-selection { @@ -501,6 +504,9 @@ form { .@{ant-prefix}-select { &-selection { border-color: @error-color; + &:hover { + border-color: @error-color; + } } &-open .@{ant-prefix}-select-selection, &-focused .@{ant-prefix}-select-selection { diff --git a/components/form/style/mixin.less b/components/form/style/mixin.less index 0fbfb88ef7..e4d4c5fe4a 100644 --- a/components/form/style/mixin.less +++ b/components/form/style/mixin.less @@ -25,6 +25,24 @@ .active(@border-color); } + // Input prefix + .@{ant-prefix}-input-affix-wrapper { + .@{ant-prefix}-input { + &, + &:hover { + border-color: @border-color; + } + + &:focus { + .active(@border-color); + } + } + + &:hover .@{ant-prefix}-input:not(.@{ant-prefix}-input-disabled) { + border-color: @border-color; + } + } + .@{ant-prefix}-input-prefix { color: @text-color; } diff --git a/components/input/style/mixin.less b/components/input/style/mixin.less index 21a3c42602..d782fa35f7 100644 --- a/components/input/style/mixin.less +++ b/components/input/style/mixin.less @@ -267,28 +267,26 @@ &-wrap, > .@{inputClass} { &:not(:first-child):not(:last-child) { - border-right-width: 1px; - border-right-color: transparent; + border-right-width: @border-width-base; &:hover { - .hover(); + z-index: 1; } &:focus { - .active(); + z-index: 1; } } } & > * { border-radius: 0; - border-right-width: 0; vertical-align: top; // https://github.com/ant-design/ant-design-pro/issues/139 float: none; display: inline-block; } - // https://github.com/ant-design/ant-design/issues/11863 - & > span:not(:last-child) > .@{inputClass} { - border-right-width: 0; + & > *:not(:last-child) { + border-right-width: @border-width-base; + margin-right: -@border-width-base; } // Undo float for .ant-input-group .ant-input @@ -305,12 +303,11 @@ & > .@{ant-prefix}-time-picker .@{ant-prefix}-time-picker-input { border-radius: 0; border-right-width: @border-width-base; - border-right-color: transparent; &:hover { - .hover(); + z-index: 1; } &:focus { - .active(); + z-index: 1; } } @@ -336,16 +333,6 @@ border-top-right-radius: @border-radius-base; border-bottom-right-radius: @border-radius-base; border-right-width: @border-width-base; - border-right-color: @input-border-color; - &:hover { - .hover(); - } - &:focus { - .active(); - .@{ant-prefix}-cascader-input { - .active(); - } - } } // https://github.com/ant-design/ant-design/issues/12493 @@ -365,13 +352,14 @@ } .@{inputClass} { - position: static; + position: relative; } .@{inputClass}-prefix, .@{inputClass}-suffix { position: absolute; top: 50%; + z-index: 2; transform: translateY(-50%); line-height: 0; color: @input-color;