From 385771cba0d6235ae726f01caec346dc45da48b3 Mon Sep 17 00:00:00 2001
From: Laurant Marijnissen <laurant@gigafyde.dev>
Date: Sat, 15 Jan 2022 08:18:23 +0100
Subject: [PATCH] invert the hide button to more clearly show what it is
 currently set as. (#150)

---
 tubearchivist/home/templates/home/channel.html     |  2 +-
 tubearchivist/home/templates/home/channel_id.html  |  2 +-
 tubearchivist/home/templates/home/downloads.html   |  2 +-
 tubearchivist/home/templates/home/home.html        |  2 +-
 tubearchivist/home/templates/home/playlist.html    |  2 +-
 tubearchivist/home/templates/home/playlist_id.html |  2 +-
 tubearchivist/static/css/style.css                 | 13 +++++++------
 7 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/tubearchivist/home/templates/home/channel.html b/tubearchivist/home/templates/home/channel.html
index 44cda8a..56388e5 100644
--- a/tubearchivist/home/templates/home/channel.html
+++ b/tubearchivist/home/templates/home/channel.html
@@ -24,7 +24,7 @@
             <span>Show subscribed only:</span>
             <div class="toggleBox">
                 <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>
                 {% else %}
                     <label for="" class="onbtn">On</label>
diff --git a/tubearchivist/home/templates/home/channel_id.html b/tubearchivist/home/templates/home/channel_id.html
index e88825e..1cf5fb2 100644
--- a/tubearchivist/home/templates/home/channel_id.html
+++ b/tubearchivist/home/templates/home/channel_id.html
@@ -71,7 +71,7 @@
             <span>Hide watched videos:</span>
             <div class="toggleBox">
                 <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>
                 {% else %}
                     <label for="" class="onbtn">On</label>
diff --git a/tubearchivist/home/templates/home/downloads.html b/tubearchivist/home/templates/home/downloads.html
index 43fb5ab..091d19a 100644
--- a/tubearchivist/home/templates/home/downloads.html
+++ b/tubearchivist/home/templates/home/downloads.html
@@ -33,7 +33,7 @@
             <span>Show only ignored videos:</span>
             <div class="toggleBox">
                 <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>
                 {% else %}
                     <label for="" class="onbtn">On</label>
diff --git a/tubearchivist/home/templates/home/home.html b/tubearchivist/home/templates/home/home.html
index f29a15d..19c830d 100644
--- a/tubearchivist/home/templates/home/home.html
+++ b/tubearchivist/home/templates/home/home.html
@@ -10,7 +10,7 @@
             <span>Hide watched:</span>
             <div class="toggleBox">
                 <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>
                 {% else %}
                     <label for="" class="onbtn">On</label>
diff --git a/tubearchivist/home/templates/home/playlist.html b/tubearchivist/home/templates/home/playlist.html
index 9711f4b..bdfa229 100644
--- a/tubearchivist/home/templates/home/playlist.html
+++ b/tubearchivist/home/templates/home/playlist.html
@@ -23,7 +23,7 @@
             <span>Show subscribed only:</span>
             <div class="toggleBox">
                 <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>
                 {% else %}
                     <label for="" class="onbtn">On</label>
diff --git a/tubearchivist/home/templates/home/playlist_id.html b/tubearchivist/home/templates/home/playlist_id.html
index f8ad230..af453a8 100644
--- a/tubearchivist/home/templates/home/playlist_id.html
+++ b/tubearchivist/home/templates/home/playlist_id.html
@@ -68,7 +68,7 @@
             <span>Hide watched videos:</span>
             <div class="toggleBox">
                 <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>
                 {% else %}
                     <label for="" class="onbtn">On</label>
diff --git a/tubearchivist/static/css/style.css b/tubearchivist/static/css/style.css
index 8a779d2..58fc0e0 100644
--- a/tubearchivist/static/css/style.css
+++ b/tubearchivist/static/css/style.css
@@ -155,8 +155,8 @@ button:hover {
     position: relative;
     width: 70px;
     height: 30px;
-    background-color: var(--accent-font-dark);
-    border-color: var(--accent-font-dark);
+    background-color: var(--accent-font-light);
+    border-color: var(--accent-font-light);
     appearance: none;
     border-radius: 15px;
     transition: 0.4s;
@@ -165,8 +165,8 @@ button:hover {
 }
 
 .toggleBox > input:checked[type="checkbox"] {
-    background-color: var(--accent-font-light);
-    border-color: var(--accent-font-light);
+    background-color: var(--accent-font-dark);
+    border-color: var(--accent-font-dark);
 }
 
 .toggleBox > input[type="checkbox"]::before {
@@ -200,14 +200,15 @@ button:hover {
 }
 
 .toggleBox > .onbtn {
-    right: 35%;
+    right: 70%;
     top: 45%;
     transform: translate(50%,-50%);
     font-family: Sen-Regular, sans-serif;
+
 }
 
 .toggleBox > .ofbtn {
-    left: 0;
+    left: 37%;
     top: 45%;
     transform: translate(50%,-50%);
     font-family: Sen-Regular, sans-serif;