spoilers red are unblurred when checkbox selected

build/app.js

@@ -5911,7 +5911,9 @@ function CheckboxSpoilersToggle() {
   var param = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "none";
   var checkboxId = document.getElementById("checkbox-spoilers");
   var allClassElements = document.querySelectorAll(".spoiler-span");
+  var allClassElementsRed = document.querySelectorAll(".spoiler-red");
   var length = allClassElements.length;
+  var lengthRed = allClassElementsRed.length;
 
   switch (param) {
     case "hide":
@@ -5919,6 +5921,10 @@ function CheckboxSpoilersToggle() {
         allClassElements[i].classList.add("hidden");
       }
 
+      for (var _i5 = 0; _i5 < lengthRed; _i5++) {
+        allClassElementsRed[_i5].classList.add("blurred");
+      }
+
       checkboxId.value = "spoilers-off";
       checkboxId.checked = false; // remember this choice for subsequent page visits and browser restarts
 
@@ -5929,8 +5935,12 @@ function CheckboxSpoilersToggle() {
       break;
 
     case "show":
-      for (var _i5 = 0; _i5 < length; _i5++) {
+      for (var _i6 = 0; _i6 < length; _i6++) {
-        allClassElements[_i5].classList.remove("hidden");
+        allClassElements[_i6].classList.remove("hidden");
+      }
+
+      for (var _i7 = 0; _i7 < lengthRed; _i7++) {
+        allClassElementsRed[_i7].classList.remove("blurred");
       }
 
       checkboxId.value = "spoilers-on";
@@ -5945,8 +5955,12 @@ function CheckboxSpoilersToggle() {
     default:
       // This runs when the checkbox is not checked
       if (checkboxId.checked === false) {
-        for (var _i6 = 0; _i6 < length; _i6++) {
+        for (var _i8 = 0; _i8 < length; _i8++) {
-          allClassElements[_i6].classList.add("hidden");
+          allClassElements[_i8].classList.add("hidden");
+        }
+
+        for (var _i9 = 0; _i9 < lengthRed; _i9++) {
+          allClassElementsRed[_i9].classList.add("blurred");
         }
 
         checkboxId.value = "spoilers-off"; // remember this choice for subsequent page visits and browser restarts
@@ -5958,8 +5972,12 @@ function CheckboxSpoilersToggle() {
         break;
       } // This runs when the checkbox is checked
       else {
-          for (var _i7 = 0; _i7 < length; _i7++) {
+          for (var _i10 = 0; _i10 < length; _i10++) {
-            allClassElements[_i7].classList.remove("hidden");
+            allClassElements[_i10].classList.remove("hidden");
+          }
+
+          for (var _i11 = 0; _i11 < lengthRed; _i11++) {
+            allClassElementsRed[_i11].classList.remove("blurred");
           }
 
           checkboxId.value = "spoilers-on"; // remember this choice for subsequent page visits and browser restarts

src/js/page-functions.js

@@ -880,15 +880,23 @@ function CheckboxHintsToggle(param = "none") {
  * @param {string} param "hide", "show" or none (optional)
  */
 function CheckboxSpoilersToggle(param = "none") {
+
     let checkboxId = document.getElementById("checkbox-spoilers");
     let allClassElements = document.querySelectorAll(".spoiler-span");
+    let allClassElementsRed = document.querySelectorAll(".spoiler-red");
     let length = allClassElements.length;
+    let lengthRed = allClassElementsRed.length;
 
     switch (param) {
         case "hide":
             for (let i = 0; i < length; i++) {
                 allClassElements[i].classList.add("hidden");
             }
+
+            for (let i = 0; i < lengthRed; i++) {
+                allClassElementsRed[i].classList.add("blurred");
+            }
+
             checkboxId.value = "spoilers-off";
             checkboxId.checked = false;
 
@@ -897,10 +905,16 @@ function CheckboxSpoilersToggle(param = "none") {
                 localStorage.setItem("hkCheckboxSpoilers", "unchecked");
             }
             break;
+
         case "show":
             for (let i = 0; i < length; i++) {
                 allClassElements[i].classList.remove("hidden");
             }
+
+            for (let i = 0; i < lengthRed; i++) {
+                allClassElementsRed[i].classList.remove("blurred");
+            }
+
             checkboxId.value = "spoilers-on";
             checkboxId.checked = true;
 
@@ -909,12 +923,19 @@ function CheckboxSpoilersToggle(param = "none") {
                 localStorage.setItem("hkCheckboxSpoilers", "checked");
             }
             break;
+
         default:
             // This runs when the checkbox is not checked
             if (checkboxId.checked === false) {
+
                 for (let i = 0; i < length; i++) {
                     allClassElements[i].classList.add("hidden");
                 }
+
+                for (let i = 0; i < lengthRed; i++) {
+                    allClassElementsRed[i].classList.add("blurred");
+                }
+
                 checkboxId.value = "spoilers-off";
 
                 // remember this choice for subsequent page visits and browser restarts
@@ -928,6 +949,11 @@ function CheckboxSpoilersToggle(param = "none") {
                 for (let i = 0; i < length; i++) {
                     allClassElements[i].classList.remove("hidden");
                 }
+
+                for (let i = 0; i < lengthRed; i++) {
+                    allClassElementsRed[i].classList.remove("blurred");
+                }
+
                 checkboxId.value = "spoilers-on";
 
                 // remember this choice for subsequent page visits and browser restarts