☰

activityfix.com - Dark Mode

Dark mode theme for ActivityFix

Fra 21.01.2025. Se den seneste versjonen.

  1. /* ==UserStyle==
  2. @name           activityfix.com - Dark Mode
  3. @namespace      typpi.online
  4. @version        1.4
  5. @description    Dark mode theme for ActivityFix
  6. @author         Nick2bad4u
  7. @license        UnLicense
  8. @homepageURL    https://github.com/Nick2bad4u/UserStyles
  9. @supportURL     https://github.com/Nick2bad4u/UserStyles/issues
  10.  
  11. @var color background-color-black "Background Color Black" #000000
  12. @var color text-color-white "Text Color White" #ffffff
  13. @var color text-color-blue "Text Color Blue" #2196f3
  14. @var color text-decoration-color "Text Decoration Color" #333333
  15. @var color background-color-blue "Background Color Blue" #2196f3
  16. @var color border-color-blue "Border Color Blue" #2196f3
  17. @var color background-color-white "Background Color White" #ffffff
  18. @var color text-color-black "Text Color Black" #000000
  19. ==/UserStyle== */
  20. @-moz-document domain("activityfix.com") {
  21. 	:root {
  22. 			--background-color-black: var(background-color-black);
  23. 			--text-color-white: var(text-color-white);
  24. 			--text-color-blue: var(text-color-blue);
  25. 			--text-decoration-color: var(text-decoration-color);
  26. 			--background-color-blue: var(background-color-blue);
  27. 			--border-color-blue: var(border-color-blue);
  28. 			--background-color-white: var(background-color-white);
  29. 			--text-color-black: var(text-color-black);
  30. 	}
  31.  
  32. 	/* Invert colors except images and videos */
  33. 	:is(
  34. 			html:not([stylus-iframe]),
  35. 			img,
  36. 			svg,
  37. 			video,
  38. 			.w3-dark-gray,
  39. 			.w3-dark-grey,
  40. 			.w3-hover-dark-gray:hover,
  41. 			.w3-hover-dark-grey:hover,
  42. 			.w3-center,
  43. 			iframe,
  44. 			.af-disconnect-button
  45. 	) {
  46. 			filter: invert(1) hue-rotate(180deg) !important;
  47. 	}
  48.  
  49. 	.w3-dark-gray,
  50. 	.w3-dark-grey,
  51. 	.w3-hover-dark-gray:hover,
  52. 	.w3-hover-dark-grey:hover,
  53. 	.w3-padding-16 {
  54. 			background-color: var(--background-color-black) !important;
  55. 			color: var(--text-color-white) !important;
  56. 			font-weight: 800;
  57. 	}
  58.  
  59. 	.af-update-header,
  60. 	.af-version {
  61. 			color: var(--text-color-blue);
  62. 			text-decoration: underline;
  63. 	}
  64.  
  65. 	.af-update-header span {
  66. 			cursor: default;
  67. 			font-size: 13px;
  68. 			text-decoration: underline var(--text-decoration-color);
  69. 	}
  70.  
  71. 	.w3-padding-16 {
  72. 			padding-top: 0 !important;
  73. 			padding-bottom: 16px !important;
  74. 	}
  75.  
  76. 	.w3-bar.w3-top.af-blue.w3-large {
  77. 			background-color: var(--background-color-blue) !important;
  78. 	}
  79.  
  80. 	.w3-main {
  81. 			background-color: var(--background-color-white);
  82. 	}
  83.  
  84. 	.w3-container.w3-black.w3-display-container {
  85. 			margin: 0 !important;
  86. 			background-color: var(--background-color-white) !important;
  87. 			color: var(--text-color-black) !important;
  88. 	}
  89.  
  90. 	#save_success > div {
  91. 			border: 4px var(--border-color-blue) dashed;
  92. 	}
  93.  
  94. 	.w3-bar-item.w3-left {
  95. 			font-style: italic;
  96. 			font-weight: 550;
  97. 	}
  98.  
  99. 	.af-help-contents > div:nth-child(n) > img,
  100. 	.w3-center
  101. 			> table
  102. 			> tbody
  103. 			> tr:nth-child(1)
  104. 			> td:nth-child(1)
  105. 			> a
  106. 			> img {
  107. 			filter: invert(0) hue-rotate(0deg) !important;
  108. 	}
  109.  
  110. 	body > br,
  111. 	body > hr {
  112. 			display: none !important;
  113. 	}
  114.  
  115. 	html {
  116. 			background: var(--background-color-white);
  117. 	}
  118. }