mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-07 17:44:35 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

Merge pull request #17983 from ant-design/fix-range-picker-active-style

Browse Source 
style: optimize RangePicker active cell style
This commit is contained in:
偏右 2019-07-30 18:25:18 +08:00 committed by GitHub
commit 2b67ca48e0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 36 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
components/date-picker/style/Calendar.less
View File

@ -131,6 +131,18 @@
} }
} }
.calendar-selected-cell() {
.@{calendar-prefix-cls}-date {
color: @text-color-inverse;
background: @primary-color;
border: @border-width-base @border-style-base transparent;
&:hover {
background: @primary-color;
}
}
}
.@{calendar-prefix-cls} { .@{calendar-prefix-cls} {
position: relative; position: relative;
width: 280px; width: 280px;
@ -255,27 +267,19 @@
border-color: @primary-color; border-color: @primary-color;
} }
&-selected-day &-date {
background: @primary-2;
}
&-selected-date {
.calendar-selected-cell;
}
&-last-month-cell &-date, &-last-month-cell &-date,
&-next-month-btn-day &-date { &-next-month-btn-day &-date {
color: @disabled-color; color: @disabled-color !important;
} background: transparent !important;;
border-color: transparent !important;;
&-selected-day &-date {
background: tint(@primary-color, 80%);
}
&-selected-date,
&-selected-start-date,
&-selected-end-date {
.@{calendar-prefix-cls}-date {
color: @text-color-inverse;
background: @primary-color;
border: @border-width-base @border-style-base transparent;
&:hover {
background: @primary-color;
}
}
} }
&-disabled-cell &-date { &-disabled-cell &-date {

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

@ -84,6 +84,19 @@
transform: translateX(-50%); transform: translateX(-50%);
} }
.@{calendar-prefix-cls}-today {
.@{calendar-prefix-cls}-date {
color: @primary-color;
background: @primary-2;
border-color: @primary-color;
}
}
.@{calendar-prefix-cls}-selected-start-date,
.@{calendar-prefix-cls}-selected-end-date {
.calendar-selected-cell;
}
&.@{calendar-prefix-cls}-time &-right .@{calendar-prefix-cls}-date-input-wrap { &.@{calendar-prefix-cls}-time &-right .@{calendar-prefix-cls}-date-input-wrap {
margin-left: 0; margin-left: 0;
} }