Stylus Dark Theme [Fixed 11-24-25]

A dark theme for Stylish. It also includes a code section for recoloring the default syntax highlighting theme. [Fixed 11-24-25]

目前为 2024-12-24 提交的版本。查看 最新版本

  1. /* ==UserStyle==
  2. @name Stylus Dark Theme [Fixed 11-24-25]
  3. @namespace typpi.online
  4. @author Paul Stevenson [Fixed by Nick2bad4u]
  5. @description A dark theme for Stylish. It also includes a code section for recoloring the default syntax highlighting theme. [Fixed 11-24-25]
  6. @version 20241224.6.21
  7. @license CC-BY-SA-4.0
  8. @preprocessor uso
  9. ==/UserStyle== */
  10. @-moz-document regexp("chrome-extension://clngdbkpkpeebahjckkjfobafhncgmne/.*")
  11. {
  12. body {
  13. color: #ccccff;
  14. background: #111111;
  15. }
  16.  
  17. #stylish-popup {
  18. color: #000000;
  19. background: #ffffff;
  20. }
  21.  
  22. a,
  23. a:visited,
  24. a:active {
  25. color: #00ccff;
  26. }
  27.  
  28. a:hover {
  29. color: #99ffff;
  30. }
  31.  
  32. input,
  33. #name,
  34. .applies-value,
  35. select {
  36. border-color: #0099ff;
  37. color: #00ffff;
  38. background: #000000;
  39. }
  40.  
  41. button {
  42. border-color: #5555ff;
  43. color: #9999ff;
  44. background: #222222;
  45. }
  46.  
  47. button:hover {
  48. color: #99ccff;
  49. background: #000000;
  50. }
  51.  
  52. input[type='checkbox'] {
  53. display: none;
  54. }
  55.  
  56. label {
  57. cursor: pointer;
  58. }
  59.  
  60. #header {
  61. border-right: 1px dashed #0099ff;
  62. }
  63.  
  64. input[type='checkbox'] + label::before {
  65. display: inline-block;
  66. width: 16px;
  67. height: 16px;
  68. padding: 0;
  69. margin: 0 0.25em 0 0;
  70. border: 1px solid #0099ff;
  71. content: '\00a0';
  72. vertical-align: top;
  73. font: 16px/1em sans-serif;
  74. }
  75.  
  76. input[type='checkbox']:checked + label::before {
  77. color: #ccccff;
  78. background: #000000;
  79. content: '\2713';
  80. text-align: center;
  81. }
  82.  
  83. input[type='checkbox']:checked + label::after {
  84. font-weight: bold;
  85. }
  86.  
  87. #help-popup {
  88. background: rgb(0 0 0 / 80%);
  89. }
  90.  
  91. #help-popup .close-icon {
  92. background:
  93. linear-gradient(
  94. -45deg,
  95. transparent 5px,
  96. white 5px,
  97. white 6px,
  98. transparent 6.5px
  99. )
  100. no-repeat,
  101. linear-gradient(
  102. 45deg,
  103. transparent 5px,
  104. white 5px,
  105. white 6px,
  106. transparent 6.5px
  107. )
  108. no-repeat;
  109. }
  110.  
  111. ::-webkit-scrollbar {
  112. width: 10px;
  113. }
  114.  
  115. ::-webkit-scrollbar-track {
  116. -webkit-border-radius: 8px;
  117. border-radius: 8px;
  118. -webkit-box-shadow: inset 0 0 6px
  119. rgb(0 0 0 / 30%);
  120. }
  121.  
  122. ::-webkit-scrollbar-thumb {
  123. -webkit-border-radius: 8px;
  124. border-radius: 8px;
  125. background: rgb(0 100 255 / 80%);
  126. -webkit-box-shadow: inset 0 0 6px
  127. rgb(0 0 0 / 50%);
  128. }
  129.  
  130. ::-webkit-scrollbar-thumb:window-inactive {
  131. background: rgb(0 100 255 / 40%);
  132. }
  133. }
  134.  
  135. @-moz-document regexp("chrome-extension://fjnbnpbmkenffdnngjfgmeleoegfcffe/.*")
  136. {
  137.  
  138. @-moz-keyframes blink {
  139. 50% {
  140. background-color: transparent;
  141. }
  142. }
  143. @-webkit-keyframes blink {
  144. 50% {
  145. background-color: transparent;
  146. }
  147. }
  148. @keyframes blink {
  149. 50% {
  150. background-color: transparent;
  151. }
  152. }
  153. /* BASICS */
  154.  
  155. .CodeMirror {
  156. height: 300px;
  157. color: #ffffff;
  158. /* Set height, width, borders, and global font properties here */
  159. font-family: monospace;
  160. }
  161.  
  162. /* PADDING */
  163.  
  164. .CodeMirror-lines {
  165. padding: 4px 0;
  166. /* Vertical padding around content */
  167. }
  168.  
  169. .CodeMirror pre {
  170. padding: 0 4px;
  171. /* Horizontal padding of content */
  172. }
  173.  
  174. .CodeMirror-scrollbar-filler,
  175. .CodeMirror-gutter-filler {
  176. background-color: black;
  177. /* The little square between H and V scrollbars */
  178. }
  179.  
  180. /* GUTTER */
  181.  
  182. .CodeMirror-gutters {
  183. border-right: 1px solid #0099ff;
  184. background-color: #000000;
  185. white-space: nowrap;
  186. }
  187.  
  188. .CodeMirror-linenumbers {
  189. background: none;
  190. }
  191.  
  192. .CodeMirror-linenumber {
  193. min-width: 20px;
  194. padding: 0 3px 0 5px;
  195. color: #5599ff;
  196. text-align: right;
  197. white-space: nowrap;
  198. }
  199.  
  200. .CodeMirror-guttermarker {
  201. color: #ffffff;
  202. }
  203.  
  204. .CodeMirror-guttermarker-subtle {
  205. color: #fff;
  206. }
  207.  
  208. /* CURSOR */
  209.  
  210. .CodeMirror div.CodeMirror-cursor {
  211. border-left: 1px solid #fff;
  212. }
  213.  
  214. /* Shown when moving in bi-directional text */
  215. .CodeMirror div.CodeMirror-secondarycursor {
  216. border-left: 1px solid silver;
  217. }
  218.  
  219. .CodeMirror.cm-fat-cursor
  220. div.CodeMirror-cursor {
  221. width: auto;
  222. border: 0;
  223. background: #7e7;
  224. }
  225.  
  226. .CodeMirror.cm-fat-cursor
  227. div.CodeMirror-cursors {
  228. z-index: 1;
  229. }
  230.  
  231. .cm-animate-fat-cursor {
  232. width: auto;
  233. border: 0;
  234. background-color: #7e7;
  235. -webkit-animation: blink 1.06s steps(1)
  236. infinite;
  237. -moz-animation: blink 1.06s steps(1) infinite;
  238. animation: blink 1.06s steps(1) infinite;
  239. }
  240.  
  241. /* Can style cursor different in overwrite (non-insert) mode */
  242. div.CodeMirror-overwrite div.CodeMirror-cursor {
  243. color: #ffffff;
  244. }
  245.  
  246. .cm-tab {
  247. display: inline-block;
  248. text-decoration: inherit;
  249. }
  250.  
  251. .CodeMirror-ruler {
  252. position: absolute;
  253. border-left: 1px solid #ccc;
  254. }
  255.  
  256. /* DEFAULT THEME */
  257.  
  258. .cm-s-default .cm-header {
  259. color: #00f;
  260. }
  261.  
  262. .cm-s-default .cm-quote {
  263. color: #7e7;
  264. }
  265.  
  266. .cm-negative {
  267. color: #f00;
  268. }
  269.  
  270. .cm-positive {
  271. color: #7e7;
  272. }
  273.  
  274. .cm-header,
  275. .cm-strong {
  276. font-weight: bold;
  277. }
  278.  
  279. .cm-em {
  280. font-style: italic;
  281. }
  282.  
  283. .cm-link {
  284. text-decoration: underline;
  285. }
  286.  
  287. .cm-strikethrough {
  288. text-decoration: line-through;
  289. }
  290.  
  291. .cm-s-default .cm-keyword {
  292. color: #ffac3f;
  293. }
  294.  
  295. .cm-s-default .cm-atom {
  296. color: #9b8dff;
  297. }
  298.  
  299. .cm-s-default .cm-number {
  300. color: #00dfff;
  301. }
  302.  
  303. .cm-s-default .cm-def {
  304. color: #9999ff;
  305. }
  306.  
  307. .cm-s-default .cm-variable,
  308. .cm-s-default .cm-punctuation,
  309. .cm-s-default .cm-property,
  310. .cm-s-default .cm-operator {
  311. color: #ff00ff;
  312. }
  313.  
  314. .cm-s-default .cm-variable-2 {
  315. color: #62b0ff;
  316. }
  317.  
  318. .cm-s-default .cm-variable-3 {
  319. color: #88ffd3;
  320. }
  321.  
  322. .cm-s-default .cm-comment {
  323. color: #00ff2e;
  324. }
  325.  
  326. .cm-s-default .cm-string {
  327. color: #ff9500;
  328. }
  329.  
  330. .cm-s-default .cm-string-2 {
  331. color: #f50;
  332. }
  333.  
  334. .cm-s-default .cm-meta {
  335. color: #c3c3c3;
  336. }
  337.  
  338. .cm-s-default .cm-qualifier {
  339. color: #dddddd;
  340. }
  341.  
  342. .cm-s-default .cm-builtin {
  343. color: #97b6ff;
  344. }
  345.  
  346. .cm-s-default .cm-bracket {
  347. color: #fff;
  348. }
  349.  
  350. .cm-s-default .cm-tag {
  351. color: #5599ff;
  352. }
  353.  
  354. .cm-s-default .cm-attribute {
  355. color: #7d7dff;
  356. }
  357.  
  358. .cm-s-default .cm-hr {
  359. color: #ff9f9f;
  360. }
  361.  
  362. .cm-s-default .cm-link {
  363. color: #00ffd6;
  364. }
  365.  
  366. .cm-s-default .cm-error {
  367. color: #ff7474;
  368. }
  369.  
  370. .cm-invalidchar {
  371. color: #ff7a7a;
  372. }
  373.  
  374. .CodeMirror-composing {
  375. border-bottom: 2px solid;
  376. }
  377.  
  378. div.CodeMirror span.CodeMirror-matchingbracket {
  379. color: #fdff00;
  380. }
  381.  
  382. div.CodeMirror
  383. span.CodeMirror-nonmatchingbracket {
  384. color: #f22;
  385. }
  386.  
  387. .CodeMirror-matchingtag {
  388. background: rgb(255 150 0 / 30%);
  389. }
  390.  
  391. .CodeMirror-activeline-background {
  392. background: #0c0c0c;
  393. }
  394.  
  395. .CodeMirror {
  396. background: #0c0c0c;
  397. }
  398.  
  399. .CodeMirror-selected {
  400. background: #000000;
  401. }
  402.  
  403. .CodeMirror-focused .CodeMirror-selected {
  404. background: #000000;
  405. }
  406.  
  407. .CodeMirror-crosshair {
  408. cursor: crosshair;
  409. }
  410.  
  411. .CodeMirror-line::selection,
  412. .CodeMirror-line > span::selection,
  413. .CodeMirror-line > span > span::selection {
  414. background: #000000;
  415. }
  416.  
  417. .CodeMirror-line::selection,
  418. .CodeMirror-line > span::selection,
  419. .CodeMirror-line > span > span::selection {
  420. background: #000000;
  421. }
  422.  
  423. .cm-searching {
  424. border-bottom: 1px solid #ff9900;
  425. background: #00ff00;
  426. background: rgb(0 255 0 / 50%);
  427. }
  428. }

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址