|
|
|
@ -8,8 +8,8 @@ article .checkbox |
|
|
|
|
-o-appearance: none |
|
|
|
|
appearance: none |
|
|
|
|
position: relative |
|
|
|
|
height: 20px |
|
|
|
|
width: 20px |
|
|
|
|
height: 16px |
|
|
|
|
width: 16px |
|
|
|
|
transition:all .15s ease-out 0s |
|
|
|
|
cursor: pointer |
|
|
|
|
display: inline-block |
|
|
|
@ -17,7 +17,6 @@ article .checkbox |
|
|
|
|
border-radius: 2px |
|
|
|
|
flex-shrink: 0 |
|
|
|
|
margin-right: 8px |
|
|
|
|
margin-bottom: 2px |
|
|
|
|
if hexo-config('style.body.checkbox.enable') != true |
|
|
|
|
pointer-events: none |
|
|
|
|
/* Checkbox */ |
|
|
|
@ -26,39 +25,40 @@ article .checkbox |
|
|
|
|
position: absolute |
|
|
|
|
content: "" |
|
|
|
|
background: #fff |
|
|
|
|
transition: all .2s ease-in-out |
|
|
|
|
&:before |
|
|
|
|
left: 2px |
|
|
|
|
top: 8px |
|
|
|
|
width: 0 |
|
|
|
|
left: 1px |
|
|
|
|
top: 5px |
|
|
|
|
width: 0px |
|
|
|
|
height: 2px |
|
|
|
|
transition: all .2s ease-in |
|
|
|
|
transform: rotate(45deg) |
|
|
|
|
-webkit-transform: rotate(45deg) |
|
|
|
|
-moz-transform: rotate(45deg) |
|
|
|
|
-ms-transform: rotate(45deg) |
|
|
|
|
-o-transform: rotate(45deg) |
|
|
|
|
&:after |
|
|
|
|
right: 9px |
|
|
|
|
right: 7px |
|
|
|
|
bottom: 3px |
|
|
|
|
width: 2px |
|
|
|
|
height: 0 |
|
|
|
|
height: 0px |
|
|
|
|
transition: all .2s ease-out |
|
|
|
|
transform: rotate(40deg) |
|
|
|
|
-webkit-transform: rotate(40deg) |
|
|
|
|
-moz-transform: rotate(40deg) |
|
|
|
|
-ms-transform: rotate(40deg) |
|
|
|
|
-o-transform: rotate(40deg) |
|
|
|
|
transition-delay: .2s |
|
|
|
|
transition-delay: .25s |
|
|
|
|
&:checked |
|
|
|
|
&:before |
|
|
|
|
left: 1px |
|
|
|
|
top: 10px |
|
|
|
|
left: 0px |
|
|
|
|
top: 7px |
|
|
|
|
width: 6px |
|
|
|
|
height: 2px |
|
|
|
|
&:after |
|
|
|
|
right: 5px |
|
|
|
|
right: 3px |
|
|
|
|
bottom: 1px |
|
|
|
|
width: 2px |
|
|
|
|
height: 14px |
|
|
|
|
height: 10px |
|
|
|
|
|
|
|
|
|
/* Radio */ |
|
|
|
|
input[type=radio] |
|
|
|
@ -66,12 +66,12 @@ article .checkbox |
|
|
|
|
&:before |
|
|
|
|
content: "" |
|
|
|
|
display: block |
|
|
|
|
width: 10px |
|
|
|
|
height: 10px |
|
|
|
|
width: 8px |
|
|
|
|
height: 8px |
|
|
|
|
border-radius: 50% |
|
|
|
|
margin: .2rem |
|
|
|
|
margin: 2px |
|
|
|
|
transform: scale(0) |
|
|
|
|
transition: all ease-out 250ms |
|
|
|
|
transition: all .25s ease-out |
|
|
|
|
&:checked:before |
|
|
|
|
transform: scale(1) |
|
|
|
|
/* Colors */ |
|
|
|
|