☰

zwiftinsider.com - Dark Mode

Dark Theme for ZwiftInsider

目前为 2025-01-22 提交的版本。查看 最新版本。

  1. /* ==UserStyle==
  2. @name           zwiftinsider.com - Dark Mode
  3. @namespace      typpi.online
  4. @version        1.1.4
  5. @description    Dark Theme for ZwiftInsider
  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 "Background Color" #ffffff
  12. @var color text-color "Text Color" #000000
  13. @var color gradient-start "Gradient Start" #ffffff00
  14. @var color gradient-middle "Gradient Middle" #ffffff00
  15. @var color gradient-end "Gradient End" #ffffffb0
  16. @var color gradient-final "Gradient Final" #000000cc
  17. ==/UserStyle== */
  18. @-moz-document domain("zwiftinsider.com") {
  19. 	:root {
  20. 		--background-color: var(background-color);
  21. 		--text-color: var(text-color);
  22. 		--gradient-start: var(gradient-start);
  23. 		--gradient-middle: var(gradient-middle);
  24. 		--gradient-end: var(gradient-end);
  25. 		--gradient-final: var(gradient-final);
  26. 	}
  27.  
  28. 	/* Invert colors except images and videos */
  29. 	:is(
  30. 		html:not([stylus-iframe]),
  31. 		iframe,
  32. 		img,
  33. 		svg,
  34. 		video,
  35. 		.tdb_single_bg_featured_image,
  36. 		body.td-animation-stack-type0
  37. 			.post
  38. 			img:not(
  39. 				.woocommerce-product-gallery img,
  40. 				.rs-pzimg
  41. 			),
  42. 		body.td-animation-stack-type0
  43. 			.td-animation-stack
  44. 			.td-lazy-img,
  45. 		.tdi_59,
  46. 		.wp-block-toolset-blocks-container.tb-container,
  47. 		#tdi_82,
  48. 		.tdi_56,
  49. 		.td-image-wrap,
  50. 		.tdi_98,
  51. 		.tdm-title,
  52. 		.tds-title,
  53. 		.tdi_23 .tdb-menu > li > a .tdb-sub-menu-icon,
  54. 		.tdi_23
  55. 			.td-subcat-more
  56. 			.tdb-menu-more-subicon,
  57. 		.tdb_loop .td-load-more-wrap,
  58. 		.tdb_loop .td-next-prev-wrap,
  59. 		.tdb-featured-image-bg,
  60. 		.ql-snow,
  61. 		#wpdcom .wpd-form-row .wpd-field
  62. 	) {
  63. 		filter: invert(1) hue-rotate(180deg);
  64. 	}
  65.  
  66. 	.tdb_single_bg_featured_image::after {
  67. 		background: linear-gradient(
  68. 			180deg,
  69. 			var(--gradient-start),
  70. 			var(--gradient-middle) 0%,
  71. 			var(--gradient-end) 100%,
  72. 			var(--gradient-final)
  73. 		);
  74. 	}
  75.  
  76. 	body {
  77. 		background: var(
  78. 			--background-color
  79. 		) !important;
  80. 		color: var(--text-color) !important;
  81. 	}
  82.  
  83. 	.td_module_flex_1 .td-thumb-css,
  84. 	.td_module_flex_3 .td-thumb-css,
  85. 	.td_module_flex_4 .td-thumb-css,
  86. 	.td_module_flex_5 .td-thumb-css,
  87. 	.tdi_110 .td-image-wrap,
  88. 	.td_block_template_1 {
  89. 		filter: unset !important;
  90. 	}
  91.  
  92. 	.tdi_43 .tdb-title-text,
  93. 	.tdi_59 .tdm-descr,
  94. 	.tdb_header_menu
  95. 		.tdb-menu
  96. 		> li
  97. 		> a
  98. 		.tdb-menu-item-text,
  99. 	.tdb_header_menu .tdb-menu > li > a span {
  100. 		color: var(--text-color);
  101. 	}
  102.  
  103. 	.td-big-grid-flex .td-module-title a {
  104. 		color: var(--text-color) !important;
  105. 	}
  106. }