Remove icheckbox related-code except for primary

v6 doesn't support changing this like v5

Signed-off-by: XhmikosR <xhmikosr@gmail.com>

package-lock.json

@@ -27,7 +27,6 @@
         "daterangepicker": "3.1.0",
         "hammerjs": "2.0.8",
         "icheck-bootstrap": "3.0.1",
-        "icheck-material": "1.0.1",
         "jquery": "3.7.1",
         "modernized-waitme": "1.0.0",
         "moment": "2.30.1",
@@ -4865,12 +4864,6 @@
       "integrity": "sha512-Rj3SybdcMcayhsP4IJ+hmCNgCKclaFcs/5zwCuLXH1WMo468NegjhZVxbSNKhEjJjnwc4gKETogUmPYSQ9lEZQ==",
       "license": "MIT"
     },
-    "node_modules/icheck-material": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/icheck-material/-/icheck-material-1.0.1.tgz",
-      "integrity": "sha512-uruQ7el8Jq/7mTiW/+TC694g1hsdf7XgjGSbqccuIfMketEqy5OubDnBOUjaRYdNdeVQORnUBzTnVEIdjG7l/A==",
-      "license": "MIT"
-    },
     "node_modules/ieee754": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",

package.json

@@ -43,7 +43,6 @@
     "@fortawesome/fontawesome-free": "6.7.2",
     "hammerjs": "2.0.8",
     "icheck-bootstrap": "3.0.1",
-    "icheck-material": "1.0.1",
     "jquery": "3.7.1",
     "modernized-waitme": "1.0.0",
     "moment": "2.30.1",

scripts/js/footer.js

@@ -179,7 +179,6 @@ function testCookies() {
   return ret;
 }
 
-var iCheckStyle = "primary";
 function applyCheckboxRadioStyle() {
   // Get all radio/checkboxes for theming, with the exception of the two radio buttons on the custom disable timer,
   // as well as every element with an id that starts with "status_"
@@ -190,39 +189,7 @@ function applyCheckboxRadioStyle() {
     .not("#only-changed")
     .not("[id^=status_]");
   sel.parent().removeClass();
-  sel.parent().addClass("icheck-" + iCheckStyle);
+  sel.parent().addClass("icheck-primary");
-}
-
-function initCheckboxRadioStyle() {
-  function getCheckboxURL(style) {
-    var extra = style.startsWith("material-") ? "material" : "bootstrap";
-    const webhome = document.body.dataset.webhome;
-    return webhome + "vendor/icheck/icheck-" + extra + ".min.css";
-  }
-
-  // Read from local storage, initialize if needed
-  var chkboxStyle = localStorage ? localStorage.getItem("theme_icheck") : null;
-  if (chkboxStyle === null) {
-    chkboxStyle = "primary";
-  }
-
-  var boxsheet = $('<link href="' + getCheckboxURL(chkboxStyle) + '" rel="stylesheet">');
-  // Only add the stylesheet if it's not already present
-  if ($("link[href='" + boxsheet.attr("href") + "']").length === 0) boxsheet.appendTo("head");
-
-  iCheckStyle = chkboxStyle;
-  applyCheckboxRadioStyle();
-
-  // Add handler when on settings page
-  var iCheckStyle = $("#iCheckStyle");
-  if (iCheckStyle !== null) {
-    iCheckStyle.val(chkboxStyle);
-    iCheckStyle.on("change", function () {
-      var themename = $(this).val();
-      localStorage.setItem("theme_icheck", themename);
-      applyCheckboxRadioStyle();
-    });
-  }
 }
 
 var systemTimer, versionTimer;
@@ -631,8 +598,8 @@ $(function () {
     $("#cookieInfo").show();
   }
 
-  // Apply per-browser styling settings
+  // Apply icheckbox/iradio style
-  initCheckboxRadioStyle();
+  applyCheckboxRadioStyle();
 
   if (!_isLoginPage) {
     // Run check immediately after page loading ...

scripts/lua/header.lp

@@ -81,6 +81,7 @@ is_authenticated = mg.request_info.is_authenticated
 
     <!-- Common styles -->
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/bootstrap/css/bootstrap.min.css')?>">
+    <link rel="stylesheet" href="<?=pihole.fileversion('vendor/icheck/icheck-bootstrap.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/animate/animate.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/bstreeview/bstreeview.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/font-awesome/css/all.min.css')?>">

style/themes/default-dark.css

@@ -591,17 +591,6 @@ input[type="password"]::-webkit-caps-lock-indicator {
   background-image: linear-gradient(to right, #114100 0%, #525200 100%);
 }
 
-.icheckbox_polaris,
-.icheckbox_futurico,
-.icheckbox_minimal-blue {
-  margin-right: 10px;
-}
-.iradio_polaris,
-.iradio_futurico,
-.iradio_minimal-blue {
-  margin-right: 8px;
-}
-
 /* Overlay box with spinners as shown during data collection for graphs */
 .box .overlay,
 .overlay-wrapper .overlay {

style/themes/default-darker.css

@@ -5675,23 +5675,6 @@ td.highlight {
 [class*="icheck-"] > input:first-child:disabled + label::before {
   box-shadow: none;
 }
-.icheck-default
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-default > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(71, 77, 80);
-}
-.icheck-default > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-default > input:first-child:checked + label::before {
-  background-color: rgb(38, 41, 43);
-  border-color: rgb(71, 77, 80);
-}
-.icheck-default > input:first-child:checked + input[type="hidden"] + label::after,
-.icheck-default > input:first-child:checked + label::after {
-  border-bottom-color: rgb(123, 114, 101);
-  border-right-color: rgb(123, 114, 101);
-}
 .icheck-primary
   > input:first-child:not(:checked):not(:disabled):hover
   + input[type="hidden"]
@@ -5704,299 +5687,6 @@ td.highlight {
   background-color: rgb(41, 98, 146);
   border-color: rgb(42, 100, 150);
 }
-.icheck-success
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-success > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(55, 125, 55);
-}
-.icheck-success > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-success > input:first-child:checked + label::before {
-  background-color: rgb(77, 133, 58);
-  border-color: rgb(55, 125, 55);
-}
-.icheck-info
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-info > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(28, 115, 140);
-}
-.icheck-info > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-info > input:first-child:checked + label::before {
-  background-color: rgb(28, 115, 141);
-  border-color: rgb(28, 115, 140);
-}
-.icheck-warning
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-warning > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(154, 96, 13);
-}
-.icheck-warning > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-warning > input:first-child:checked + label::before {
-  background-color: rgb(153, 95, 13);
-  border-color: rgb(154, 96, 13);
-}
-.icheck-danger
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-danger > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(143, 35, 31);
-}
-.icheck-danger > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-danger > input:first-child:checked + label::before {
-  background-color: rgb(148, 35, 32);
-  border-color: rgb(143, 35, 31);
-}
-.icheck-turquoise
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-turquoise > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(23, 168, 139);
-}
-.icheck-turquoise > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-turquoise > input:first-child:checked + label::before {
-  background-color: rgb(21, 150, 125);
-  border-color: rgb(23, 168, 139);
-}
-.icheck-emerland
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-emerland > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(33, 147, 81);
-}
-.icheck-emerland > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-emerland > input:first-child:checked + label::before {
-  background-color: rgb(37, 163, 90);
-  border-color: rgb(33, 147, 81);
-}
-.icheck-peterriver
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-peterriver > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(26, 99, 148);
-}
-.icheck-peterriver > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-peterriver > input:first-child:checked + label::before {
-  background-color: rgb(29, 111, 165);
-  border-color: rgb(26, 99, 148);
-}
-.icheck-amethyst
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-amethyst > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(101, 53, 121);
-}
-.icheck-amethyst > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-amethyst > input:first-child:checked + label::before {
-  background-color: rgb(113, 59, 135);
-  border-color: rgb(101, 53, 121);
-}
-.icheck-wetasphalt
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-wetasphalt > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(75, 106, 136);
-}
-.icheck-wetasphalt > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-wetasphalt > input:first-child:checked + label::before {
-  background-color: rgb(42, 58, 75);
-  border-color: rgb(75, 106, 136);
-}
-.icheck-greensea
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-greensea > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(24, 176, 146);
-}
-.icheck-greensea > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-greensea > input:first-child:checked + label::before {
-  background-color: rgb(18, 128, 106);
-  border-color: rgb(24, 176, 146);
-}
-.icheck-nephritis
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-nephritis > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(35, 156, 86);
-}
-.icheck-nephritis > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-nephritis > input:first-child:checked + label::before {
-  background-color: rgb(31, 139, 77);
-  border-color: rgb(35, 156, 86);
-}
-.icheck-belizehole
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-belizehole > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(34, 106, 153);
-}
-.icheck-belizehole > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-belizehole > input:first-child:checked + label::before {
-  background-color: rgb(33, 102, 148);
-  border-color: rgb(34, 106, 153);
-}
-.icheck-wisteria
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-wisteria > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(108, 52, 131);
-}
-.icheck-wisteria > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-wisteria > input:first-child:checked + label::before {
-  background-color: rgb(114, 54, 138);
-  border-color: rgb(108, 52, 131);
-}
-.icheck-midnightblue
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-midnightblue > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(77, 109, 141);
-}
-.icheck-midnightblue > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-midnightblue > input:first-child:checked + label::before {
-  background-color: rgb(35, 50, 64);
-  border-color: rgb(77, 109, 141);
-}
-.icheck-sunflower
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-sunflower > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(168, 137, 10);
-}
-.icheck-sunflower > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-sunflower > input:first-child:checked + label::before {
-  background-color: rgb(192, 156, 11);
-  border-color: rgb(168, 137, 10);
-}
-.icheck-carrot
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-carrot > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(158, 84, 18);
-}
-.icheck-carrot > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-carrot > input:first-child:checked + label::before {
-  background-color: rgb(178, 94, 20);
-  border-color: rgb(158, 84, 18);
-}
-.icheck-alizarin
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-alizarin > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(149, 31, 18);
-}
-.icheck-alizarin > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-alizarin > input:first-child:checked + label::before {
-  background-color: rgb(162, 33, 20);
-  border-color: rgb(149, 31, 18);
-}
-.icheck-clouds
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-clouds > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(53, 57, 59);
-}
-.icheck-clouds > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-clouds > input:first-child:checked + label::before {
-  background-color: rgb(30, 39, 41);
-  border-color: rgb(53, 57, 59);
-}
-.icheck-clouds > input:first-child:checked + input[type="hidden"] + label::after,
-.icheck-clouds > input:first-child:checked + label::after {
-  border-bottom-color: rgb(76, 82, 85);
-  border-right-color: rgb(76, 82, 85);
-}
-.icheck-concrete
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-concrete > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(76, 82, 85);
-}
-.icheck-concrete > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-concrete > input:first-child:checked + label::before {
-  background-color: rgb(79, 86, 89);
-  border-color: rgb(76, 82, 85);
-}
-.icheck-orange
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-orange > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(168, 106, 9);
-}
-.icheck-orange > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-orange > input:first-child:checked + label::before {
-  background-color: rgb(191, 121, 10);
-  border-color: rgb(168, 106, 9);
-}
-.icheck-pumpkin
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-pumpkin > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(192, 76, 0);
-}
-.icheck-pumpkin > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-pumpkin > input:first-child:checked + label::before {
-  background-color: rgb(169, 67, 0);
-  border-color: rgb(192, 76, 0);
-}
-.icheck-pomegranate
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-pomegranate > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(151, 45, 34);
-}
-.icheck-pomegranate > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-pomegranate > input:first-child:checked + label::before {
-  background-color: rgb(154, 46, 34);
-  border-color: rgb(151, 45, 34);
-}
-.icheck-silver
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-silver > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(65, 71, 73);
-}
-.icheck-silver > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-silver > input:first-child:checked + label::before {
-  background-color: rgb(58, 63, 66);
-  border-color: rgb(65, 71, 73);
-}
-.icheck-asbestos
-  > input:first-child:not(:checked):not(:disabled):hover
-  + input[type="hidden"]
-  + label::before,
-.icheck-asbestos > input:first-child:not(:checked):not(:disabled):hover + label::before {
-  border-color: rgb(82, 89, 92);
-}
-.icheck-asbestos > input:first-child:checked + input[type="hidden"] + label::before,
-.icheck-asbestos > input:first-child:checked + label::before {
-  background-color: rgb(92, 100, 104);
-  border-color: rgb(82, 89, 92);
-}
 
 /* Override Style */
 .vimvixen-hint {

style/themes/default-light.css

@@ -264,13 +264,6 @@ td.highlight {
   background-image: linear-gradient(to right, #e7ffde 0%, #ffffdf 100%);
 }
 
-.icheckbox_minimal-blue {
-  margin-right: 10px;
-}
-.iradio_minimal-blue {
-  margin-right: 8px;
-}
-
 .datatable-bt,
 .datatable-bt:active,
 .datatable-bt:active:focus,

style/themes/high-contrast-dark.css

@@ -779,17 +779,6 @@ input[type="password"]::-webkit-caps-lock-indicator {
   background-image: linear-gradient(to right, var(--network-recent) 0%, var(--network-old) 100%);
 }
 
-.icheckbox_polaris,
-.icheckbox_futurico,
-.icheckbox_minimal-blue {
-  margin-right: 10px;
-}
-.iradio_polaris,
-.iradio_futurico,
-.iradio_minimal-blue {
-  margin-right: 8px;
-}
-
 /* Overlay box with spinners as shown during data collection for graphs */
 .box .overlay,
 .overlay-wrapper .overlay {

style/themes/high-contrast.css

@@ -304,13 +304,6 @@ a:hover {
   background: #eb4;
 }
 
-.icheckbox_minimal-blue {
-  margin-right: 10px;
-}
-.iradio_minimal-blue {
-  margin-right: 8px;
-}
-
 .datatable-bt,
 .datatable-bt:active,
 .datatable-bt:active:focus,

style/themes/lcars.css

@@ -1889,15 +1889,6 @@ table.dataTable tbody > tr > .selected td {
   padding: 3px 10px;
 }
 
-/*** icheckbox ***/
-.icheckbox_minimal-blue {
-  margin-right: 10px;
-}
-
-.iradio_minimal-blue {
-  margin-right: 8px;
-}
-
 .progress {
   background: #222;
 }