☰

Walmart.com - Dark Mode

Dark mode for Walmart.com

当前为 2024-12-04 提交的版本，查看 最新版本。

  1. /* ==UserStyle==
  2. @name         Walmart.com - Dark Mode
  3. @version      20241114.16.22
  4. @namespace    https://userstyles.world/user/Nick2bad4u
  5. @description  Dark mode for Walmart.com
  6. @homepageURL  https://github.com/Nick2bad4u/UserStyles
  7. @author       Nick2bad4u
  8. @license      UnLicense
  9. ==/UserStyle== */
  10.  
  11. @-moz-document domain("walmart.com") {
  12. 	/* Base styles */
  13. 	*:not(
  14. 			img,
  15. 			svg,
  16. 			iframe,
  17. 			a,
  18. 			i,
  19. 			span.mr2,
  20. 			span.mh2,
  21. 			p
  22. 		) {
  23. 		border-color: #333 !important;
  24. 		background-color: #111 !important;
  25. 		color: #ddd !important;
  26. 	}
  27.  
  28. 	a {
  29. 		color: #1e90ff !important;
  30. 	}
  31.  
  32. 	/* Media elements */
  33. 	img,
  34. 	video {
  35. 		filter: brightness(1) !important;
  36. 	}
  37.  
  38. 	/* Buttons and Input Fields */
  39. 	button,
  40. 	input,
  41. 	select,
  42. 	textarea,
  43. 	div > div.z-2.relative.mt2.w-60 > div > a {
  44. 		border-color: #444 !important;
  45. 		background-color: #222 !important;
  46. 		color: #ddd !important;
  47. 	}
  48.  
  49. 	button:hover,
  50. 	input:focus,
  51. 	select:focus,
  52. 	textarea:focus {
  53. 		border-color: #555 !important;
  54. 		background-color: #333 !important;
  55. 	}
  56.  
  57. 	/* Header, Navbar, and Footer */
  58. 	header,
  59. 	.header,
  60. 	.footer,
  61. 	nav,
  62. 	.navbar {
  63. 		background-color: #111 !important;
  64. 		color: #ddd !important;
  65. 	}
  66.  
  67. 	header a,
  68. 	.header a,
  69. 	.footer a,
  70. 	nav a,
  71. 	.navbar a {
  72. 		color: #1e90ff !important;
  73. 	}
  74.  
  75. 	/* Product Listings */
  76. 	.product,
  77. 	.product-card,
  78. 	.product-list-item {
  79. 		border-color: #333 !important;
  80. 		background-color: #222 !important;
  81. 		color: #ddd !important;
  82. 	}
  83.  
  84. 	.product-card .price,
  85. 	.product-list-item .price {
  86. 		color: #ffcc00 !important;
  87. 	}
  88.  
  89. 	/* Category and Sidebar Menus */
  90. 	.sidebar,
  91. 	.category-menu,
  92. 	.filter-menu {
  93. 		border-color: #333 !important;
  94. 		background-color: #111 !important;
  95. 		color: #ddd !important;
  96. 	}
  97.  
  98. 	.sidebar a,
  99. 	.category-menu a,
  100. 	.filter-menu a {
  101. 		color: #1e90ff !important;
  102. 	}
  103.  
  104. 	/* Shopping Cart and Checkout */
  105. 	.cart,
  106. 	.checkout,
  107. 	.order-summary,
  108. 	.cart-item {
  109. 		border-color: #333 !important;
  110. 		background-color: #222 !important;
  111. 		color: #ddd !important;
  112. 	}
  113.  
  114. 	.cart .price,
  115. 	.checkout .price,
  116. 	.order-summary .price {
  117. 		color: #ffcc00 !important;
  118. 	}
  119.  
  120. 	/* Forms and Popups */
  121. 	.modal,
  122. 	.popup,
  123. 	.form-container {
  124. 		border-color: #333 !important;
  125. 		background-color: #111 !important;
  126. 		color: #ddd !important;
  127. 	}
  128.  
  129. 	.modal button,
  130. 	.popup button,
  131. 	.form-container button {
  132. 		background-color: #222 !important;
  133. 		color: #ddd !important;
  134. 	}
  135.  
  136. 	/* Specific UI Adjustments */
  137. 	.breadcrumb,
  138. 	.pagination,
  139. 	.page-navigation {
  140. 		border-color: #333 !important;
  141. 		background-color: #222 !important;
  142. 		color: #ddd !important;
  143. 	}
  144.  
  145. 	.breadcrumb a,
  146. 	.pagination a,
  147. 	.page-navigation a {
  148. 		color: #1e90ff !important;
  149. 	}
  150.  
  151. 	.notification,
  152. 	.alert,
  153. 	.badge {
  154. 		background-color: #444 !important;
  155. 		color: #ffcc00 !important;
  156. 	}
  157.  
  158. 	/* Tooltip */
  159. 	.tooltip {
  160. 		border-color: #555 !important;
  161. 		background-color: #333 !important;
  162. 		color: #ddd !important;
  163. 	}
  164. }