update Switch style
This commit is contained in:
parent
3f611f57ed
commit
ac2f8493b1
2 changed files with 49 additions and 25 deletions
|
@ -2,10 +2,10 @@
|
|||
|
||||
.@{switch-prefix-cls} {
|
||||
display: inline-block;
|
||||
width: 48px;
|
||||
height: 24px;
|
||||
line-height: 22px;
|
||||
border-radius: 24px;
|
||||
width: 44px;
|
||||
height: 22px;
|
||||
line-height: 20px;
|
||||
border-radius: 22px;
|
||||
vertical-align: middle;
|
||||
border: 1px solid #ccc;
|
||||
background-color: #ccc;
|
||||
|
@ -18,7 +18,7 @@
|
|||
color: #fff;
|
||||
font-size: @font-size-small;
|
||||
position: absolute;
|
||||
left: 25px;
|
||||
left: 23px;
|
||||
|
||||
i {
|
||||
width: 12px;
|
||||
|
@ -29,9 +29,9 @@
|
|||
|
||||
&:after {
|
||||
content: '';
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 20px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 18px;
|
||||
background-color: #fff;
|
||||
position: absolute;
|
||||
left: 1px;
|
||||
|
@ -54,14 +54,12 @@
|
|||
}
|
||||
|
||||
&-small {
|
||||
width: 24px;
|
||||
height: 12px;
|
||||
line-height: 10px;
|
||||
width: 28px;
|
||||
height: 16px;
|
||||
line-height: 14px;
|
||||
&:after {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
&:active:after {
|
||||
width: 14px;
|
||||
|
@ -69,30 +67,30 @@
|
|||
}
|
||||
|
||||
&-small&-checked:after {
|
||||
left: 12px;
|
||||
left: 13px;
|
||||
}
|
||||
|
||||
&-small:active&-checked:after {
|
||||
left: 8px;
|
||||
left: 11px;
|
||||
}
|
||||
|
||||
&-large{
|
||||
width: 60px;
|
||||
width: 56px;
|
||||
&:active:after {
|
||||
width: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
&-large:active:after {
|
||||
width: 32px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
&-large&-checked:after {
|
||||
left: 37px;
|
||||
left: 35px;
|
||||
}
|
||||
|
||||
&-large:active&-checked:after {
|
||||
left: 25px;
|
||||
left: 23px;
|
||||
}
|
||||
|
||||
&-checked {
|
||||
|
@ -100,15 +98,15 @@
|
|||
background-color: @primary-color;
|
||||
|
||||
.@{switch-prefix-cls}-inner {
|
||||
left: 8px;
|
||||
left: 7px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
left: 25px;
|
||||
left: 23px;
|
||||
}
|
||||
|
||||
&:active:after {
|
||||
left: 19px;
|
||||
left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue