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

chore: adjust RangePicker style (#23025)

Browse Source 
* adjust range color

* fix lint

* update color

* update dark logic

* adjust little of arrow
This commit is contained in:
二货机器人 2020-04-08 20:41:57 +08:00 committed by GitHub
parent 70eaea6978
commit f42cdca081
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 25 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
components/date-picker/style/index.less
View File

@ -105,7 +105,7 @@
&-suffix { &-suffix {
align-self: center; align-self: center;
margin-left: @padding-xs / 2; margin-left: @padding-xs / 2;
color: @disabled-color; color: @text-color-secondary;
pointer-events: none; pointer-events: none;
} }
@ -113,7 +113,7 @@
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 0; right: 0;
color: @disabled-color; color: @text-color-secondary;
background: @component-background; background: @component-background;
transform: translateY(-50%); transform: translateY(-50%);
cursor: pointer; cursor: pointer;
@ -121,7 +121,7 @@
transition: opacity @animation-duration-slow, color @animation-duration-slow; transition: opacity @animation-duration-slow, color @animation-duration-slow;
&:hover { &:hover {
color: @text-color-secondary; color: @disabled-color;
} }
} }
@ -136,22 +136,38 @@
&::before, &::before,
&::after { &::after {
position: absolute; position: absolute;
border-top: 1px solid #979797; height: 1px;
background: mix(@black, @component-background, 25%);
border-radius: 0.5px;
content: ''; content: '';
& when (@theme = dark) {
background: mix(@white, @component-background, 25%);
}
.@{picker-prefix-cls}-focused & {
background: mix(@black, @component-background, 45%);
& when (@theme = dark) {
background: mix(@white, @component-background, 45%);
}
}
} }
// when (@theme = dark) {
&::before { &::before {
top: 50%; top: 50%;
left: 0.1em; left: 0.15em;
width: 0.8em; width: 0.7em;
transform: translateY(1px);
} }
&::after { &::after {
top: 50%; top: 50%;
right: 0.11em; right: 0.13em;
width: 0.8em; width: 0.8em;
width: 0.3em; width: 0.35em;
transform: rotate(45deg); transform: translateY(1.05px) rotate(45deg);
transform-origin: 100% 100%; transform-origin: 100% 100%;
} }