☰

Toggle CSS Style

Toggle CSS Stylesheets. Hotkey: Command + Shift + F3

  1. // ==UserScript==
  2. // @name        Toggle CSS Style
  3. // @namespace   i2p.schimon.toggle-style
  4. // @description Toggle CSS Stylesheets. Hotkey: Command + Shift + F3
  5. // @homepageURL https://greasyfork.org/en/scripts/466066-toggle-css-style
  6. // @supportURL  https://greasyfork.org/en/scripts/466066-toggle-css-style/feedback
  7. // @copyright   2023, Schimon Jehudah (http://schimon.i2p)
  8. // @license     MIT; https://opensource.org/licenses/MIT
  9. // @icon        data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48dGV4dCB5PSIuOWVtIiBmb250LXNpemU9IjkwIj7wn5SbPC90ZXh0Pjwvc3ZnPgo=
  10. // @match       *://*/*
  11. // @version     23.06
  12. // @run-at      document-end
  13. // ==/UserScript==
  14.  
  15. var docHead, styleSheets = [];
  16. document.addEventListener('keyup', hotkey, false);
  17.  
  18. function hotkey(e) {
  19.   // set hotkey Command + Shift + F3
  20.   if (e.metaKey && e.shiftKey && e.which == 114) {
  21.     toggleStylesheets();
  22.     //toggleHead();
  23.   }
  24. }
  25.  
  26. function toggleStylesheets() {
  27.   if (document.head.querySelector('link[rel="stylesheet"]') ||
  28.       document.head.querySelector('style')) {
  29.     for (const style of document.head.querySelectorAll('link[rel="stylesheet"]')) {
  30.       styleSheets.push(style);
  31.       style.remove();
  32.     }
  33.     for (const style of document.head.querySelectorAll('style')) {
  34.       styleSheets.push(style);
  35.       style.remove();
  36.     }
  37.   } else {
  38.     for (const style of styleSheets) {
  39.       document.head.append(style);
  40.     }
  41.   }
  42. }
  43.  
  44. function toggleHead() {
  45.   if (document.head) {
  46.     docHead = document.head;
  47.     document.head.remove();
  48.   } else {
  49.     document.documentElement.prepend(docHead);
  50.   }
  51. }