ant-design/components/date-picker/style/Picker.less

86 lines
2.0 KiB
Plaintext

.@{calendar-prefix-cls}-picker-container {
position: absolute;
z-index: @zindex-picker;
&.slide-up-enter.slide-up-enter-active&-placement-topLeft,
&.slide-up-enter.slide-up-enter-active&-placement-topRight,
&.slide-up-appear.slide-up-appear-active&-placement-topLeft,
&.slide-up-appear.slide-up-appear-active&-placement-topRight {
animation-name: antSlideDownIn;
}
&.slide-up-enter.slide-up-enter-active&-placement-bottomLeft,
&.slide-up-enter.slide-up-enter-active&-placement-bottomRight,
&.slide-up-appear.slide-up-appear-active&-placement-bottomLeft,
&.slide-up-appear.slide-up-appear-active&-placement-bottomRight {
animation-name: antSlideUpIn;
}
&.slide-up-leave.slide-up-leave-active&-placement-topLeft,
&.slide-up-leave.slide-up-leave-active&-placement-topRight {
animation-name: antSlideDownOut;
}
&.slide-up-leave.slide-up-leave-active&-placement-bottomLeft,
&.slide-up-leave.slide-up-leave-active&-placement-bottomRight {
animation-name: antSlideUpOut;
}
}
.@{calendar-prefix-cls}-picker {
position: relative;
display: inline-block;
outline: none;
font-size: @font-size-base;
transition: opacity 0.3s ease;
> input {
outline: none;
}
&-clear {
opacity: 0;
z-index: -1;
position: absolute;
right: 7px;
background: #fff;
top: 50%;
font-size: 12px;
color: #ccc;
width: 14px;
height: 14px;
margin-top: -7px;
line-height: 14px;
cursor: pointer;
transition: color 0.3s ease, opacity 0.15s ease;
&:hover {
color: #999;
}
}
&:hover &-clear {
opacity: 1;
z-index: 1;
}
&-icon {
position: absolute;
user-select: none;
transition: all .3s @ease-in-out;
width: 12px;
height: 12px;
line-height: 12px;
right: 8px;
color: #999;
top: 50%;
margin-top: -6px;
&:after {
content: "\e654";
font-family: "anticon";
font-size: 12px;
color: #999;
display: inline-block;
line-height: 1;
vertical-align: bottom;
}
}
}