More actions
No edit summary |
No edit summary |
||
| Line 2: | Line 2: | ||
.AF2020_trig { display: none; } | .AF2020_trig { display: none; } | ||
.AF2020_orig { display: inline; } | .AF2020_orig { display: inline; } | ||
.april-fools { | |||
font-family: 'Triglavian-Completenormal'; | |||
color: #f43e29; | |||
} | |||
.lcs_wrap { | |||
display: inline-block; | |||
direction: ltr; | |||
height: 28px; | |||
vertical-align: middle; | |||
} | |||
.lcs_wrap input { | |||
display: none; | |||
} | |||
.lcs_switch { | |||
display: inline-block; | |||
position: relative; | |||
width: 100px; | |||
height: 28px; | |||
border-radius: 30px; | |||
background: #ddd; | |||
overflow: hidden; | |||
cursor: pointer; | |||
-webkit-transition: all .2s ease-in-out; | |||
-ms-transition: all .2s ease-in-out; | |||
transition: all .2s ease-in-out; | |||
} | |||
.lcs_cursor { | |||
display: inline-block; | |||
position: absolute; | |||
top: 3px; | |||
width: 22px; | |||
height: 22px; | |||
border-radius: 100%; | |||
background: #fff; | |||
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.1); | |||
z-index: 10; | |||
-webkit-transition: all .2s linear; | |||
-ms-transition: all .2s linear; | |||
transition: all .2s linear; | |||
} | |||
.lcs_label { | |||
font-family: "Trebuchet MS", Helvetica, sans-serif; | |||
font-size: 12px; | |||
letter-spacing: 1px; | |||
line-height: 18px; | |||
color: #ccc; | |||
font-weight: bold; | |||
position: absolute; | |||
width: 60px; | |||
top: 5px; | |||
overflow: hidden; | |||
text-align: center; | |||
opacity: 0; | |||
-webkit-transition: all .2s ease-in-out .1s; | |||
-ms-transition: all .2s ease-in-out .1s; | |||
transition: all .2s ease-in-out .1s; | |||
} | |||
.lcs_label.lcs_label_on { | |||
left: -70px; | |||
z-index: 6; | |||
color: black; | |||
font-weight: 1800; | |||
} | |||
.lcs_label.lcs_label_off { | |||
right: -70px; | |||
z-index: 5; | |||
} | |||
/* on */ | |||
.lcs_switch.lcs_on { | |||
background: #292929; | |||
box-shadow: 0 0 4px #28a745 inset; | |||
} | |||
.lcs_switch.lcs_on .lcs_cursor { | |||
left: 75px; | |||
background: #28a745; | |||
} | |||
.lcs_switch.lcs_on .lcs_label_on { | |||
left: 10px; | |||
opacity: 1; | |||
color: #28a745; | |||
} | |||
/* off */ | |||
.lcs_switch.lcs_off { | |||
background: #292929; | |||
box-shadow: 0px 0px 2px #a4a4a4 inset; | |||
} | |||
.lcs_switch.lcs_off .lcs_cursor { | |||
left: 3px; | |||
} | |||
.lcs_switch.lcs_off .lcs_label_off { | |||
right: 10px; | |||
opacity: 1; | |||
} | |||
/* disabled */ | |||
.lcs_switch.lcs_disabled { | |||
opacity: 0.65; | |||
filter: alpha(opacity=65); | |||
cursor: default; | |||
} | |||
}} | }} | ||
__NOTOC__ __NOEDITSECTION__ | __NOTOC__ __NOEDITSECTION__ | ||