mirror of
https://github.com/tubearchivist/tubearchivist-frontend.git
synced 2024-11-22 20:00:15 +00:00
invert the hide button to more clearly show what it is currently set as. (#150)
This commit is contained in:
parent
b7922d171d
commit
385771cba0
@ -24,7 +24,7 @@
|
|||||||
<span>Show subscribed only:</span>
|
<span>Show subscribed only:</span>
|
||||||
<div class="toggleBox">
|
<div class="toggleBox">
|
||||||
<input id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_subed_only %}checked{% endif %}>
|
<input id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_subed_only %}checked{% endif %}>
|
||||||
{% if show_subed_only %}
|
{% if not show_subed_only %}
|
||||||
<label for="" class="ofbtn">Off</label>
|
<label for="" class="ofbtn">Off</label>
|
||||||
{% else %}
|
{% else %}
|
||||||
<label for="" class="onbtn">On</label>
|
<label for="" class="onbtn">On</label>
|
||||||
|
@ -71,7 +71,7 @@
|
|||||||
<span>Hide watched videos:</span>
|
<span>Hide watched videos:</span>
|
||||||
<div class="toggleBox">
|
<div class="toggleBox">
|
||||||
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
||||||
{% if hide_watched %}
|
{% if not hide_watched %}
|
||||||
<label for="" class="ofbtn">Off</label>
|
<label for="" class="ofbtn">Off</label>
|
||||||
{% else %}
|
{% else %}
|
||||||
<label for="" class="onbtn">On</label>
|
<label for="" class="onbtn">On</label>
|
||||||
|
@ -33,7 +33,7 @@
|
|||||||
<span>Show only ignored videos:</span>
|
<span>Show only ignored videos:</span>
|
||||||
<div class="toggleBox">
|
<div class="toggleBox">
|
||||||
<input id="show_ignored_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_ignored_only %}checked{% endif %}>
|
<input id="show_ignored_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_ignored_only %}checked{% endif %}>
|
||||||
{% if show_ignored_only %}
|
{% if not show_ignored_only %}
|
||||||
<label for="" class="ofbtn">Off</label>
|
<label for="" class="ofbtn">Off</label>
|
||||||
{% else %}
|
{% else %}
|
||||||
<label for="" class="onbtn">On</label>
|
<label for="" class="onbtn">On</label>
|
||||||
|
@ -10,7 +10,7 @@
|
|||||||
<span>Hide watched:</span>
|
<span>Hide watched:</span>
|
||||||
<div class="toggleBox">
|
<div class="toggleBox">
|
||||||
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
||||||
{% if hide_watched %}
|
{% if not hide_watched %}
|
||||||
<label for="" class="ofbtn">Off</label>
|
<label for="" class="ofbtn">Off</label>
|
||||||
{% else %}
|
{% else %}
|
||||||
<label for="" class="onbtn">On</label>
|
<label for="" class="onbtn">On</label>
|
||||||
|
@ -23,7 +23,7 @@
|
|||||||
<span>Show subscribed only:</span>
|
<span>Show subscribed only:</span>
|
||||||
<div class="toggleBox">
|
<div class="toggleBox">
|
||||||
<input id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_subed_only %}checked{% endif %}>
|
<input id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_subed_only %}checked{% endif %}>
|
||||||
{% if show_subed_only %}
|
{% if not show_subed_only %}
|
||||||
<label for="" class="ofbtn">Off</label>
|
<label for="" class="ofbtn">Off</label>
|
||||||
{% else %}
|
{% else %}
|
||||||
<label for="" class="onbtn">On</label>
|
<label for="" class="onbtn">On</label>
|
||||||
|
@ -68,7 +68,7 @@
|
|||||||
<span>Hide watched videos:</span>
|
<span>Hide watched videos:</span>
|
||||||
<div class="toggleBox">
|
<div class="toggleBox">
|
||||||
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
<input id="hide_watched" onclick="toggleCheckbox(this)" type="checkbox" {% if hide_watched %}checked{% endif %}>
|
||||||
{% if hide_watched %}
|
{% if not hide_watched %}
|
||||||
<label for="" class="ofbtn">Off</label>
|
<label for="" class="ofbtn">Off</label>
|
||||||
{% else %}
|
{% else %}
|
||||||
<label for="" class="onbtn">On</label>
|
<label for="" class="onbtn">On</label>
|
||||||
|
@ -155,8 +155,8 @@ button:hover {
|
|||||||
position: relative;
|
position: relative;
|
||||||
width: 70px;
|
width: 70px;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
background-color: var(--accent-font-dark);
|
background-color: var(--accent-font-light);
|
||||||
border-color: var(--accent-font-dark);
|
border-color: var(--accent-font-light);
|
||||||
appearance: none;
|
appearance: none;
|
||||||
border-radius: 15px;
|
border-radius: 15px;
|
||||||
transition: 0.4s;
|
transition: 0.4s;
|
||||||
@ -165,8 +165,8 @@ button:hover {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.toggleBox > input:checked[type="checkbox"] {
|
.toggleBox > input:checked[type="checkbox"] {
|
||||||
background-color: var(--accent-font-light);
|
background-color: var(--accent-font-dark);
|
||||||
border-color: var(--accent-font-light);
|
border-color: var(--accent-font-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggleBox > input[type="checkbox"]::before {
|
.toggleBox > input[type="checkbox"]::before {
|
||||||
@ -200,14 +200,15 @@ button:hover {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.toggleBox > .onbtn {
|
.toggleBox > .onbtn {
|
||||||
right: 35%;
|
right: 70%;
|
||||||
top: 45%;
|
top: 45%;
|
||||||
transform: translate(50%,-50%);
|
transform: translate(50%,-50%);
|
||||||
font-family: Sen-Regular, sans-serif;
|
font-family: Sen-Regular, sans-serif;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggleBox > .ofbtn {
|
.toggleBox > .ofbtn {
|
||||||
left: 0;
|
left: 37%;
|
||||||
top: 45%;
|
top: 45%;
|
||||||
transform: translate(50%,-50%);
|
transform: translate(50%,-50%);
|
||||||
font-family: Sen-Regular, sans-serif;
|
font-family: Sen-Regular, sans-serif;
|
||||||
|
Loading…
Reference in New Issue
Block a user