Azure devops auto dark mode

Automatically switch the dark mode according to the system settings, which uses the official style

  1. // ==UserScript==
  2. // @name Azure devops auto dark mode
  3. // @version 0.1.2
  4. // @description Automatically switch the dark mode according to the system settings, which uses the official style
  5. // @namespace https://dev.azure.com/
  6. // @match https://dev.azure.com/*
  7. // @icon https://cdn.vsassets.io/content/icons/favicon.ico
  8. // @author bowencool
  9. // @license MIT
  10. // @supportURL https://github.com/bowencool/Tampermonkey-Scripts/issues
  11. // @require https://cdn.jsdelivr.net/gh/bowencool/Tampermonkey-Scripts@f59cc91442dd34eb28e0d270486da5c7ac8d2d50/shared/waitForElementToExist.js
  12. // @grant none
  13. // ==/UserScript==
  14.  
  15. (function () {
  16. "use strict";
  17.  
  18. async function toggle(
  19. isDarkMode = window.matchMedia("(prefers-color-scheme: dark)").matches
  20. ) {
  21. /* 有两个事件会触发,而且有循环,必须加判断 */
  22. const bgColor = window.getComputedStyle(document.body).backgroundColor;
  23.  
  24. const currentThemeIsDark = bgColor !== "rgb(255, 255, 255)";
  25. console.log({ isDarkMode, currentThemeIsDark });
  26. if (isDarkMode) {
  27. if (currentThemeIsDark) return;
  28. (await waitForElementToExist('[aria-label="User settings"]')).click();
  29. (await waitForElementToExist("#__bolt-changeThemeLink")).click();
  30. (
  31. await waitForElementToExist("#theme-ms-vss-web-vsts-theme-dark")
  32. ).click();
  33. (await waitForElementToExist('.theme-panel [aria-label="Close"]')).click();
  34. } else {
  35. if (!currentThemeIsDark) return;
  36. (await waitForElementToExist('[aria-label="User settings"]')).click();
  37. (await waitForElementToExist("#__bolt-changeThemeLink")).click();
  38. (
  39. await waitForElementToExist("#theme-ms-vss-web-vsts-theme")
  40. ).click();
  41. (await waitForElementToExist('.theme-panel [aria-label="Close"]')).click();
  42. }
  43. }
  44. toggle();
  45. window
  46. .matchMedia("(prefers-color-scheme: dark)")
  47. .addEventListener("change", (e) => {
  48. toggle(e.matches);
  49. });
  50. })();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址