@ -32,14 +32,20 @@
display: inline-block;
outline: none;
font-size: @font-size-base;
transition: opacity 0.3s ease;
transition: opacity 0.3s;
> input {
&-input {
}
&:hover &-input {
border-color: @primary-color;
&-clear {
opacity: 0;
z-index: -1;
pointer-events: none;
z-index: 1;
position: absolute;
right: 7px;
background: #fff;
@ -51,7 +57,7 @@
margin-top: -7px;
line-height: 14px;
cursor: pointer;
transition: color 0.3s ease, opacity 0.15s ease;
transition: color 0.3s, opacity 0.3s;
&:hover {
color: @text-color-secondary;
@ -59,12 +65,13 @@
&:hover &-clear {
opacity: 1;
pointer-events: auto;
&-icon {
user-select: none;
transition: all .3s @ease-in-out;
transition: all .3s;
width: 12px;
height: 12px;
line-height: 12px;
@ -1,9 +1,5 @@
@input-box-height: 34px;
.@{calendar-prefix-cls}-range-picker.@{ant-prefix}-input {
padding-right: 26px;
.@{calendar-prefix-cls}-range-picker-input {
background-color: transparent;
border: 0;
@ -67,7 +67,7 @@ export default function wrapPicker(Picker, defaultFormat?) {
[`${prefixCls}-picker`]: true,
});
const pickerInputClass = classNames({
[`${prefixCls}-range-picker`]: true,
[`${prefixCls}-picker-input`]: true,
[inputPrefixCls]: true,
[`${inputPrefixCls}-lg`]: props.size === 'large',
[`${inputPrefixCls}-sm`]: props.size === 'small',
@ -52,7 +52,7 @@
border: 1px solid @input-border-color;
border-radius: @border-radius-base;
.placeholder(); // Reset placeholder
transition: border .2s @ease-in-out, background .2s @ease-in-out, box-shadow .2s @ease-in-out;
.hover();