☰

USOS dark mode

dark mode of USOS

当前为 2023-05-18 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         USOS dark mode
  3. // @namespace    https://greasyfork.org/en/users/901750-gooseob
  4. // @version      1.2.1
  5. // @description  dark mode of USOS
  6. // @author       GooseOb
  7. // @license      MIT
  8. // @match        https://usosweb.uni.lodz.pl/*
  9. // @icon         https://www.google.com/s2/favicons?sz=64&domain=usosweb.uni.lodz.pl
  10. // @grant        none
  11. // ==/UserScript==
  12.  
  13. (function(){
  14. const sGLOBAL = `:root {
  15. 	--font-color-reverse: #000;
  16. 	--background-reverse: #ccc;
  17.  
  18. 	--background: #222;
  19. 	--background-secondary: #333;
  20.  
  21. 	--font-color: #fff;
  22.  
  23. 	--grey: #999;
  24. }
  25.  
  26. html,
  27. main-panel,
  28. #uwb-main-column .uwb-white-content,
  29. .ua-tooltip.ua-tooltip-badge .tooltipster-box,
  30. .ua-tooltip.ua-tooltip-default .tooltipster-box,
  31. .uwb-sidepanel,
  32. .wrtext table.grey > * > :is(tr.even, tr.strong) > td,
  33. .usos-ui table.grey > * > tr > td,
  34. .usos-ui table.wrnav tr.even_row td {
  35. 	background-color: var(--background);
  36. }
  37.  
  38. p {
  39. 	mix-blend-mode: difference;
  40. }
  41.  
  42. body {
  43. 	background: #111;
  44. }
  45.  
  46. #footer-logo, #search_logo, .radio {
  47. 	filter: contrast(0.5);
  48. }
  49.  
  50. usos-module-link-tile:hover,
  51. #uwb-side-column,
  52. .wrtext table.grey > * > tr > td,
  53. .usos-ui table.grey > *.autostrong > tr:nth-child(odd) > td,
  54. .usos-ui table.wrnav tr.odd_row td {
  55. 	background-color: var(--background-secondary);
  56. }
  57.  
  58. usos-module-link-tile {
  59. 	background-color: #111;
  60. }
  61.  
  62. .schedimg {
  63. 	filter: invert(1);
  64. }
  65.  
  66. .usos-ui :is(input[type="text"], input[type="textbox"], input[type="file"], input[type="email"], input[type="url"], input[type="number"], input[type="date"], textarea, select) {
  67. 	background-color: #111;
  68. }`;
  69. const sSELECTOR = `input {
  70. 	background-color: #000;
  71. }`;
  72. const sCOPYRIGHT = `#layoutCopyright {
  73. 	color: #fff;
  74. }`;
  75. const sHAMBURGER = `#hamburger {
  76. 	filter: invert(1);
  77. }`;
  78. const applyStyles = async (el, cssText) => {
  79. 	if (!el)
  80. 		return;
  81. 	const styles = new CSSStyleSheet;
  82. 	await styles.replace(cssText);
  83. 	el.adoptedStyleSheets.push(styles);
  84. };
  85. const hamburger = document.querySelector('menu-top')?.shadowRoot
  86. 	.querySelector('menu-top-hamburger')?.shadowRoot;
  87. const copyright = document.querySelector('usos-copyright')?.shadowRoot;
  88. applyStyles(document, sGLOBAL);
  89. applyStyles(hamburger, sHAMBURGER);
  90. applyStyles(copyright, sCOPYRIGHT);
  91. for (const el of document.querySelectorAll('usos-selector'))
  92. 	applyStyles(el.shadowRoot, sSELECTOR);
  93. })();