mirror of
https://github.com/tubearchivist/tubearchivist-frontend.git
synced 2024-11-25 21:20:15 +00:00
better label placement on toggle box
This commit is contained in:
parent
bf0b07f3d7
commit
2d6cc43a9e
@ -36,14 +36,12 @@
|
||||
<div class="toggle">
|
||||
<span>Show only subscribed channels:</span>
|
||||
<div class="toggleBox">
|
||||
<input
|
||||
id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox"
|
||||
<input id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_subed_only %}checked{% endif %}>
|
||||
{% if show_subed_only %}
|
||||
checked
|
||||
{% endif %}
|
||||
>
|
||||
<label for="" class="onbtn">On</label>
|
||||
<label for="" class="ofbtn">Off</label>
|
||||
{% else %}
|
||||
<label for="" class="onbtn">On</label>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="view-icons">
|
||||
|
@ -96,14 +96,12 @@
|
||||
<div class="toggle">
|
||||
<span>Hide watched videos:</span>
|
||||
<div class="toggleBox">
|
||||
<input
|
||||
id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox"
|
||||
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
||||
{% if hide_watched %}
|
||||
checked
|
||||
{% endif %}
|
||||
>
|
||||
<label for="" class="onbtn">On</label>
|
||||
<label for="" class="ofbtn">Off</label>
|
||||
{% else %}
|
||||
<label for="" class="onbtn">On</label>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="view-icons">
|
||||
|
@ -32,14 +32,12 @@
|
||||
<div class="toggle">
|
||||
<span>Show only ignored videos:</span>
|
||||
<div class="toggleBox">
|
||||
<input
|
||||
id="show_ignored_only" onclick="toggleCheckbox(this)" type="checkbox"
|
||||
<input id="show_ignored_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_ignored_only %}checked{% endif %}>
|
||||
{% if show_ignored_only %}
|
||||
checked
|
||||
{% endif %}
|
||||
>
|
||||
<label for="" class="onbtn">On</label>
|
||||
<label for="" class="ofbtn">Off</label>
|
||||
{% else %}
|
||||
<label for="" class="onbtn">On</label>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="view-icons">
|
||||
|
@ -43,14 +43,12 @@
|
||||
<div class="toggle">
|
||||
<span>Hide watched videos:</span>
|
||||
<div class="toggleBox">
|
||||
<input
|
||||
id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox"
|
||||
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
||||
{% if hide_watched %}
|
||||
checked
|
||||
{% endif %}
|
||||
>
|
||||
<label for="" class="onbtn">On</label>
|
||||
<label for="" class="ofbtn">Off</label>
|
||||
{% else %}
|
||||
<label for="" class="onbtn">On</label>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="view-icons">
|
||||
|
@ -37,14 +37,12 @@
|
||||
<div class="toggle">
|
||||
<span>Show only subscribed playlists:</span>
|
||||
<div class="toggleBox">
|
||||
<input
|
||||
id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox"
|
||||
<input id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_subed_only %}checked{% endif %}>
|
||||
{% if show_subed_only %}
|
||||
checked
|
||||
{% endif %}
|
||||
>
|
||||
<label for="" class="onbtn">On</label>
|
||||
<label for="" class="ofbtn">Off</label>
|
||||
{% else %}
|
||||
<label for="" class="onbtn">On</label>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="view-icons">
|
||||
|
@ -69,10 +69,12 @@
|
||||
<div class="toggle">
|
||||
<span>Hide watched videos:</span>
|
||||
<div class="toggleBox">
|
||||
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox"
|
||||
{% if hide_watched %}checked{% endif %}>
|
||||
<label for="" class="onbtn">On</label>
|
||||
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
||||
{% if hide_watched %}
|
||||
<label for="" class="ofbtn">Off</label>
|
||||
{% else %}
|
||||
<label for="" class="onbtn">On</label>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="view-icons">
|
||||
|
@ -200,14 +200,16 @@ button:hover {
|
||||
}
|
||||
|
||||
.toggleBox > .onbtn {
|
||||
bottom: 15px;
|
||||
left: 15px;
|
||||
right: 35%;
|
||||
top: 45%;
|
||||
transform: translate(50%,-50%);
|
||||
font-family: Sen-Regular, sans-serif;
|
||||
}
|
||||
|
||||
.toggleBox > .ofbtn {
|
||||
bottom: 15px;
|
||||
right: 15px;
|
||||
left: 0;
|
||||
top: 45%;
|
||||
transform: translate(50%,-50%);
|
||||
font-family: Sen-Regular, sans-serif;
|
||||
color: var(--main-font);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user