This commit is contained in:
parent
287685d9ed
commit
87c3ae516d
3 changed files with 19 additions and 19 deletions
|
@ -136,10 +136,10 @@
|
|||
|
||||
/* switch */
|
||||
--b3-switch-background: #e1e3e1;
|
||||
--b3-switch-border: #747775;
|
||||
--b3-switch-border: #aeaeae;
|
||||
--b3-switch-hover: rgba(31, 31, 31, 0.06);
|
||||
--b3-switch-checked: #fff;
|
||||
--b3-switch-checked-background: #0b57d0;
|
||||
--b3-switch-checked-background: var(--b3-theme-primary);
|
||||
--b3-switch-checked-hover: #d3e3fd;
|
||||
--b3-switch-checked-hover2: rgba(31, 31, 31, .06);
|
||||
|
||||
|
|
|
@ -137,9 +137,9 @@
|
|||
--b3-switch-background: #444746;
|
||||
--b3-switch-border: #8e918f;
|
||||
--b3-switch-hover: rgba(253, 252, 251, .10);
|
||||
--b3-switch-checked: #0842a0;
|
||||
--b3-switch-checked: var(--b3-theme-primary);
|
||||
--b3-switch-checked-background: #a8c7fa;
|
||||
--b3-switch-checked-hover: #0842a0;
|
||||
--b3-switch-checked-hover: var(--b3-theme-primary);
|
||||
--b3-switch-checked-hover2: rgba( 253,252,251, .10);
|
||||
|
||||
/* 阴影 */
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
.b3-switch {
|
||||
flex-shrink: 0;
|
||||
-webkit-appearance: none;
|
||||
width: 36px;
|
||||
height: 20px;
|
||||
width: 26px;
|
||||
height: 16px;
|
||||
border: 1px solid var(--b3-switch-border);
|
||||
border-radius: var(--b3-border-radius-b);
|
||||
margin: 0;
|
||||
|
@ -25,15 +25,15 @@
|
|||
}
|
||||
|
||||
&:after {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
pointer-events: none;
|
||||
z-index: 1;
|
||||
content: "";
|
||||
background-color: var(--b3-switch-border);
|
||||
display: block;
|
||||
left: 9px;
|
||||
left: 7px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
|
@ -43,12 +43,12 @@
|
|||
&:before {
|
||||
z-index: 2;
|
||||
content: "";
|
||||
left: 9px;
|
||||
left: 7px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-color: var(--b3-switch-hover);
|
||||
display: none;
|
||||
border-radius: 50%;
|
||||
|
@ -61,13 +61,13 @@
|
|||
|
||||
&:after {
|
||||
background-color: var(--b3-switch-checked);
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
left: 25px;
|
||||
left: 17px;
|
||||
}
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
|
@ -81,8 +81,8 @@
|
|||
}
|
||||
|
||||
&:active:not(:disabled):after {
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -92,8 +92,8 @@
|
|||
}
|
||||
|
||||
&:active:not(:disabled):after {
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
&:hover:not(:disabled):before {
|
||||
|
|
Loading…
Add table
Reference in a new issue