code cosmetics: simplify onoffswitch

This commit is contained in:
tophf 2017-04-29 20:05:42 +03:00
parent ee86ef3037
commit cb79b3561c
2 changed files with 15 additions and 15 deletions

View File

@ -201,11 +201,11 @@ sup {
-ms-user-select: none;
}
.onoffswitch-checkbox {
.onoffswitch input {
display: none;
}
.onoffswitch-label {
.onoffswitch span {
display: block;
overflow: hidden;
cursor: pointer;
@ -218,7 +218,7 @@ sup {
box-shadow: inset 2px 2px 4px rgba(0,0,0,0.1);
}
.onoffswitch-label:before {
.onoffswitch span:before {
content: "";
display: block;
width: 18px;
@ -232,19 +232,19 @@ sup {
box-shadow: 0 3px 13px 0 rgba(0, 0, 0, 0.4);
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
.onoffswitch input:checked + span {
background-color: #CAEBE3;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
.onoffswitch input:checked + span, .onoffswitch input:checked + span:before {
border-color: #CAEBE3;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
.onoffswitch input:checked + span .onoffswitch-inner {
margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
.onoffswitch input:checked + span:before {
right: 0;
background-color: #04BA9F;
box-shadow: 3px 6px 18px 0 rgba(0, 0, 0, 0.2);

View File

@ -19,8 +19,8 @@
<label>
<span i18n-text="prefShowBadge"></span>
<span class="onoffswitch">
<input type="checkbox" class="onoffswitch-checkbox" id="show-badge">
<span class="onoffswitch-label"></span>
<input type="checkbox" id="show-badge">
<span></span>
</span>
</label>
<label>
@ -44,8 +44,8 @@
<label>
<span i18n-text="popupStylesFirst"></span>
<span class="onoffswitch">
<input type="checkbox" class="onoffswitch-checkbox" id="popup.stylesFirst">
<span class="onoffswitch-label" for="popup.stylesFirst"></span>
<input type="checkbox" id="popup.stylesFirst">
<span></span>
</span>
</label>
</div>
@ -67,15 +67,15 @@
<label>
<span i18n-text="optionsAdvancedExposeIframes"> <sup>2</sup></span>
<span class="onoffswitch">
<input type="checkbox" class="onoffswitch-checkbox" id="exposeIframes">
<span class="onoffswitch-label" for="exposeIframes"></span>
<input type="checkbox" id="exposeIframes">
<span></span>
</span>
</label>
<label>
<span i18n-text="optionsAdvancedContextDelete"></span>
<span class="onoffswitch">
<input type="checkbox" class="onoffswitch-checkbox" id="editor.contextDelete">
<span class="onoffswitch-label" for="editor.contextDelete"></span>
<input type="checkbox" id="editor.contextDelete">
<span></span>
</span>
</label>
</div>