☰

Auto Dark Mode for Firebase Console

Works for desktop

  1. // ==UserScript==
  2. // @name         Auto Dark Mode for Firebase Console
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.2
  5. // @description  Works for desktop
  6. // @author       Avi (https://avi12.com)
  7. // @copyright    2025 Avi (https://avi12.com)
  8. // @license      MIT
  9. // @match        https://console.firebase.google.com/*
  10. // @icon         https://www.google.com/s2/favicons?sz=64&domain=firebase.google.com
  11. // @grant        none
  12. // ==/UserScript==
  13.  
  14. (function () {
  15.   "use strict";
  16.  
  17.   const darkQuery = matchMedia("(prefers-color-scheme: dark)");
  18.   darkQuery.addEventListener("change", e => {
  19.     const theme = e.matches ? "dark" : "light";
  20.     document.body.classList.value = document.body.classList.value.replace(/fire-scheme-(light|dark)/, `fire-scheme-${theme}`);
  21.     document.documentElement.style.colorScheme = theme;
  22.   });
  23.  
  24.   new MutationObserver((_, observer) => {
  25.     // noinspection CssInvalidHtmlTagReference
  26.     const elThemeMenuToggle = document.querySelector("fire-theme-switcher");
  27.     if (!elThemeMenuToggle) {
  28.       return;
  29.     }
  30.  
  31.     observer.disconnect();
  32.     elThemeMenuToggle.click();
  33.     const elThemeMenu = document.querySelector("#mat-menu-panel-1 > div > button:last-of-type");
  34.     elThemeMenu.click();
  35.   }).observe(document, {childList: true, subtree: true});
  36. })();