mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-11 03:22:59 +08:00
Code Issues Actions 43 Packages Projects Releases Wiki Activity

Fix DatePicker input style

Browse Source
This commit is contained in:
afc163 2016-12-05 00:27:03 +08:00
parent 99df18139b
commit f9bad27469
4 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
components/date-picker/style/Picker.less
View File

@ -32,14 +32,20 @@
display: inline-block; display: inline-block;
outline: none; outline: none;
font-size: @font-size-base; font-size: @font-size-base;
transition: opacity 0.3s ease; transition: opacity 0.3s;
> input { &-input {
outline: none; outline: none;
} }
&:hover &-input {
border-color: @primary-color;
}
&-clear { &-clear {
opacity: 0; opacity: 0;
z-index: -1; pointer-events: none;
z-index: 1;
position: absolute; position: absolute;
right: 7px; right: 7px;
background: #fff; background: #fff;
@ -51,7 +57,7 @@
margin-top: -7px; margin-top: -7px;
line-height: 14px; line-height: 14px;
cursor: pointer; cursor: pointer;
transition: color 0.3s ease, opacity 0.15s ease; transition: color 0.3s, opacity 0.3s;
&:hover { &:hover {
color: @text-color-secondary; color: @text-color-secondary;
} }
@ -59,12 +65,13 @@
&:hover &-clear { &:hover &-clear {
opacity: 1; opacity: 1;
z-index: 1; pointer-events: auto;
} }
&-icon { &-icon {
position: absolute; position: absolute;
user-select: none; user-select: none;
transition: all .3s @ease-in-out; transition: all .3s;
width: 12px; width: 12px;
height: 12px; height: 12px;
line-height: 12px; line-height: 12px;

4
components/date-picker/style/RangePicker.less
View File

@ -1,9 +1,5 @@
@input-box-height: 34px; @input-box-height: 34px;
.@{calendar-prefix-cls}-range-picker.@{ant-prefix}-input {
padding-right: 26px;
}
.@{calendar-prefix-cls}-range-picker-input { .@{calendar-prefix-cls}-range-picker-input {
background-color: transparent; background-color: transparent;
border: 0; border: 0;

2
components/date-picker/wrapPicker.tsx
View File

@ -67,7 +67,7 @@ export default function wrapPicker(Picker, defaultFormat?) {
[`${prefixCls}-picker`]: true, [`${prefixCls}-picker`]: true,
}); });
const pickerInputClass = classNames({ const pickerInputClass = classNames({
[`${prefixCls}-range-picker`]: true, [`${prefixCls}-picker-input`]: true,
[inputPrefixCls]: true, [inputPrefixCls]: true,
[`${inputPrefixCls}-lg`]: props.size === 'large', [`${inputPrefixCls}-lg`]: props.size === 'large',
[`${inputPrefixCls}-sm`]: props.size === 'small', [`${inputPrefixCls}-sm`]: props.size === 'small',

2
components/input/style/mixin.less
View File

@ -52,7 +52,7 @@
border: 1px solid @input-border-color; border: 1px solid @input-border-color;
border-radius: @border-radius-base; border-radius: @border-radius-base;
.placeholder(); // Reset placeholder .placeholder(); // Reset placeholder
transition: border .2s @ease-in-out, background .2s @ease-in-out, box-shadow .2s @ease-in-out; transition: all .3s;
&:hover { &:hover {
.hover(); .hover();