☰

Dark Mode - KinoHype.me

Automatically enables Dark Mode on KinoHype.me based on user's system-wide setting.

  1. // ==UserScript==
  2. // @name           Dark Mode - KinoHype.me
  3. // @name:ru        Dark Mode - KinoHype.me
  4. // @namespace      Violentmonkey Scripts
  5. // @match          https://kinohype.me/*
  6. // @grant          none
  7. // @version        1.0
  8. // @author         bershanskiy
  9. // @description    Automatically enables Dark Mode on KinoHype.me based on user's system-wide setting.
  10. // @description:ru Автоматически включает Темный Режим на KinoHype.me в соответствии с системной настройкой.
  11. // ==/UserScript==
  12.  
  13. const query = "(prefers-color-scheme: dark)";
  14. const CSSClass = "site-dark";
  15. const isCurrentlyDark = () => document.body.classList.contains(CSSClass);
  16.  
  17. const main = () => {
  18.   const mediaQuery = window.matchMedia(query);
  19.  
  20.   if (isCurrentlyDark() !== mediaQuery.matches) {
  21.     document.body.classList.toggle(CSSClass);
  22.   }
  23.  
  24.   mediaQuery.addEventListener("change", e => {
  25.     if (isCurrentlyDark() !== e.matches) {
  26.       document.body.classList.toggle(CSSClass);
  27.     }
  28.   });
  29. }
  30.  
  31. if (document.readyState == "complete" || document.readyState == "loaded" || document.readyState == "interactive") {
  32.   main();
  33. } else {
  34.   document.addEventListener("DOMContentLoaded", main);
  35. }