zwifthacks.com - Dark Mode

Dark mode for ZwiftHacks.com

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

  1. /* ==UserStyle==
  2. @name zwifthacks.com - Dark Mode
  3. @namespace typpi.online
  4. @version 1.0.3
  5. @description Dark mode for ZwiftHacks.com
  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" #d5d5d5
  12. @var color hover-background-color "Hover Background Color" #eb732f
  13. @var color border-color "Border Color" #eb732f
  14. @var color text-color "Text Color" #000000
  15. ==/UserStyle== */
  16. @-moz-document domain("zwifthacks.com") {
  17. :root {
  18. --background-color: var(background-color);
  19. --hover-background-color: var(hover-background-color);
  20. --border-color: var(border-color);
  21. --text-color: var(text-color);
  22. }
  23.  
  24. /* Invert colors except images and videos */
  25. :is(
  26. html:not([stylus-iframe]),
  27. img,
  28. svg,
  29. video,
  30. .footer-wrap,
  31. .comments-header,
  32. .comment-reply-title,
  33. .widget-header,
  34. .page-header
  35. ),
  36. .main-navigation-menu
  37. > .menu-item-has-children
  38. > a::after,
  39. .main-navigation-menu
  40. ul
  41. .menu-item-has-children
  42. > a::after {
  43. filter: invert(1) hue-rotate(180deg) !important;
  44. }
  45.  
  46. .site-branding .custom-logo,
  47. #title > a > img {
  48. filter: unset !important;
  49. }
  50.  
  51. .primary-navigation,
  52. .main-navigation-menu a:link,
  53. .main-navigation-menu a:visited {
  54. background: var(--background-color);
  55. color: var(--text-color) !important;
  56. }
  57.  
  58. .main-navigation-menu a:link:hover,
  59. .main-navigation-menu a:visited:hover {
  60. background: var(--hover-background-color);
  61. color: var(--text-color) !important;
  62. }
  63.  
  64. .main-navigation-menu ul {
  65. border-top: 1px solid var(--border-color);
  66. }
  67.  
  68. input[type='search'i],
  69. input[type='search'i]:focus {
  70. color: var(--hover-background-color);
  71. }
  72.  
  73. input[type='text']:focus,
  74. input[type='email']:focus,
  75. input[type='url']:focus,
  76. input[type='password']:focus,
  77. input[type='search']:focus,
  78. textarea:focus {
  79. border: 1px solid var(--border-color);
  80. color: var(--hover-background-color);
  81. }
  82.  
  83. :focus-visible {
  84. outline: var(--hover-background-color) auto 1px;
  85. }
  86.  
  87. .main-navigation-menu
  88. li.menu-item-has-children:hover
  89. > ul,
  90. .main-navigation-menu
  91. li.page_item_has_children:hover
  92. > ul,
  93. .main-navigation-menu
  94. li.menu-item-has-children[aria-expanded='true']
  95. > ul {
  96. display: block;
  97. }
  98. }