☰

GreasyFork - Dark Theme

Customizable Dark theme For gf.qytechs.cn

目前為 2020-01-14 提交的版本，檢視 最新版本。

  1. /* ==UserStyle==color2
  2. @name           GreasyFork - Dark Theme
  3. @namespace      https://gf.qytechs.cn/en/users/124677-pabli
  4. @version        1.0.0
  5. @description    Customizable Dark theme For gf.qytechs.cn
  6. @author         Pabli
  7. @license        CC-BY-SA-4.0
  8. @preprocessor   stylus
  9. @var            color bg-header "Header background" #640000
  10. @var            color t-header "Header text" #fafafa
  11. @var            color bg "Background" #111
  12. @var            color t-1 "Main text" #fafafa
  13. @var            color t-2 "Second text" #aeaeae
  14. @var            color t-link "Link" #ff7070
  15. @var            color bg-sidebar "Sidebar" #1a1a1a
  16. @var            color bg-sidebar-btn "Sidebar button" #510909
  17. @var            color bg-sidebar-btn-h "Sidebar button hover" #323232
  18. @var            color bg-btn "Button" #1d0b0b
  19. @var            color bg-btn-h "Button hover" #1d0b0b
  20. @var            color t-btn "Button text" #fafafa
  21. @var            color border-btn "Button border" #7f1d1d
  22. @var            color border-btn-h "Button border hover" #ff7070
  23. @var            color bg-textarea "Text area background" #151515
  24. @var            color bg-select "Select, input backround" #232323
  25. @var            number maxwidth "Width Site (px)" 960
  26. @var            number maxwidthf "Width Forum (px)" 720
  27. @var            select theme "Theme syntax" ["Desert", "Sunburst", "Sons-Of-Obsidian", "Doxy"]
  28. @var            checkbox wrap "Code wrap" 1
  29. @var            checkbox scrollbar "Dark Scroll Bar" 1
  30. @var            checkbox sidebar "Forum sidebar to the right" 0
  31. ==/UserStyle== */
  32.  
  33. @-moz-document domain("gf.qytechs.cn") {
  34. 	
  35.  
  36. #user-profile {
  37. 	border: 1px solid #45413d;
  38. 	background-color: #2d2828;
  39. }
  40.  
  41. .width-constraint {
  42. 	max-width: maxwidth px;
  43. }
  44.  
  45. body, .script-list, .user-list, .text-content,
  46. #script-info,
  47. body:not(.Settings), #Content {
  48. 	background-color: bg;
  49. 	color: t-1;
  50. }
  51. .announcement input {
  52. 	color: t-1;
  53. }
  54. #main-header,
  55. body:not(.Settings) #Head {
  56. 	background-color: bg-header;
  57. 	background-image: linear-gradient(rgba(0, 0, 0, 0.3), bg-header);
  58. }
  59. .script-list, .user-list, .text-content,
  60. .list-option-group ul,
  61. #script-info,
  62. #Content, #Panel .FilterMenu, #Panel .PanelCategories, #Panel .MeBox {
  63. 	box-shadow: none;
  64. 	border: none;
  65. }
  66. a, a:visited, body:not(.Settings) a:not(.Button):not(.ChangePicture) {
  67. 	color: t-link;
  68. 	text-decoration: none;
  69. 		&:hover {
  70. 			color: t-link;
  71. 			text-decoration: underline;
  72. 		}
  73. }
  74. #Head a {
  75. 	text-decoration: none;
  76. 	&:hover {
  77. 		text-decoration: underline;
  78. 	}
  79. }
  80. #site-name-text h1 a:hover{
  81. 	text-decoration: none!important;
  82. }
  83. #home-script-nav {
  84. 	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  85. }
  86. #language-selector-locale {
  87. 	background: bg-header;
  88. 	color: t-header;
  89. 	border: 1px solid rgba(255, 255, 255, .5);
  90. }
  91. nav nav,
  92. .SiteMenu nav {
  93. 	background-color: bg-header;
  94. }
  95.  
  96. select, input {
  97. 	background: bg-select;
  98. 	color: t-1;
  99. 	border: 1px solid rgba(255, 255, 255, .1);
  100. }
  101. textarea, textarea:focus, input.DateBox, input.InputBox, input.SmallInput, .InputBox, .Preview, input.SmallInput:focus, input.InputBox:focus,
  102. form.new_user input[type="text"], form.new_user input[type="email"], form.new_user input[type="password"] {
  103. 	color: t-1;
  104. 	background: bg-textarea;
  105. 	border: 1px solid rgba(255, 255, 255, .1);
  106. 	outline: none;
  107. }
  108.  
  109. //search
  110. .sidebar-search input[type=submit], .home-search input[type=submit], .SiteSearch .Button {
  111. 	color: transparent;
  112. 	opacity: 1;
  113. 	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABYklEQVQ4T5XTu2qVQRTF8d8CMdp7AW9V7MwLaNKo7+ANe1ERK7Hy2oidmOALiMlDKIIS8QEsRLFRYqG9lyBsmThHviMnB7ObGT5m/t9ae6+JQVXVAi6hrbvwFS+xmGR1eHa0T9tU1TY8xIVJh/q3JVxN8mt4ZgR41C9/wz08wSccxDlcx04sJbk8BuiyX6BdPpHk9b8qquoonnbI/NBOqmoFp3Ajyd3NLFTVLdzEcpKzf3tQVWvYh9kkH6YAZvEea0kODAE/sR0zSdanAGbwA+tJ2n6jmoX/VXAY7/A5yf4hYBmnm78kd6YouN36hJUkZ4aA+R6W7ziZ5NWEKRzrU2jSF8am0IPUQnIRDXIfj/ERh3Ae17ADXzCXpK1/ejBI4oMOmeSieqz34E3PywZkAzCqqmpSR29hb7/UQrbYR/gMR4aQMcBmDRz8YDcaZA5vcXxLgG632Rgpeb5lwADSnsCV30xRiAuwE+OqAAAAAElFTkSuQmCC') no-repeat center;
  114. }
  115. .SiteSearch .Button {
  116. 	top: 6px;
  117. }
  118. #Panel input.InputBox, .AddPeople textarea.MultiComplete {
  119. 	border-radius: 5px;
  120. }
  121. .sidebar-search input[type=search],
  122. .home-search input[type=search] {
  123. 	border-radius: 5px;
  124. 	padding: 5px;
  125. 	padding-inline-end: 25px;
  126. }
  127. .sidebar-search input[type=submit],
  128. .home-search input[type=submit] {
  129. 	padding: 5px;
  130. }
  131. .SearchForm .InputBox {
  132. 	border: 1px solid rgba(255, 255, 255, .1);
  133. }
  134. 	
  135. // right menu and forum left menu
  136. .list-option-group ul,
  137. #Panel .FilterMenu, #Panel .PanelCategories, #Panel .MeBox {
  138. 	background-color: bg-sidebar;
  139. 	border: 1px solid rgba(255, 255, 255, .1);
  140. }
  141.  
  142. .list-option-group .list-current, 
  143. #Panel .FilterMenu .Active a, #Panel .PanelCategories .Active a {
  144. 	border-left: none;
  145. 	margin: unset;
  146. 	background: bg-sidebar-btn !important;
  147. 	color: t-1;
  148. }
  149.  
  150. .list-option-group a:hover, .list-option-group a:focus,
  151.  #Panel .FilterMenu a:hover, #Panel .PanelCategories a:hover, #Panel .FilterMenu a:focus, #Panel .PanelCategories a:focus {
  152. 	background: bg-sidebar-btn-h;
  153. 	color: t-1 !important;
  154. 	text-decoration: none !important;
  155. 	box-shadow: none;
  156. }
  157. if sidebar {
  158. 	#Panel {
  159. 		float: right;
  160. 	}
  161. }
  162. .Button, .Button.Active, .ButtonGroup.Open .Button.Handle, .Button:focus, .Button:active, .BigButton, .NewDiscussion,
  163. form.new_user input[type="submit"] {
  164. 	background: bg-btn;
  165. 	color: t-btn !important;
  166. 	border: 1px solid border-btn;
  167. 	text-decoration: none;
  168. 	border-radius: 30px;
  169. 	box-shadow: none;
  170.     cursor: pointer;
  171. 		&:hover {
  172. 			background: bg-btn-h;
  173. 			color: t-btn;
  174. 			border-color: border-btn-h;
  175. 			text-decoration: none;
  176. 		}
  177. }
  178.  
  179. .install-link, .install-help-link {
  180. 	color: #fff !important;
  181. }
  182. .script-list li:not(.ad-entry),
  183. .DataList .Item, .NarrowList .Item {
  184. 	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  185. }
  186. #additional-info>div {
  187. 	border: 1px solid rgba(255, 255, 255, 0.1);
  188. 	background-color: rgba(0, 0, 0, 0.2);
  189. }
  190. .notice {
  191. 	background-color: #1c2123;
  192. 	border-left: 6px solid #204050;
  193. }	
  194. .alert {
  195. 	background-color: #222211;
  196. 	border-left: 6px solid #a1931a;
  197. }
  198.  
  199. .good-rating-count {
  200. 	color: #80ff80;
  201. }
  202. .ok-rating-count {
  203. 	color: #ffff80;
  204. }
  205. .bad-rating-count {
  206. 	color: #ff8080;
  207. }
  208.  
  209. //pagination buttons
  210. .pagination>*, .script-list+.pagination>*, .user-list+.pagination>*,
  211. .Pager > * {
  212. 	background-color: transparent;
  213. }
  214. .pagination>a:hover, .pagination>a:focus {
  215. 	background-color: bg-sidebar-btn-h;
  216. 	color: t-1 !important;
  217. 	text-decoration: none !important;
  218. }
  219. //pagination buttons forum
  220. .Pager > a:hover, .Pager > a:focus {
  221. 	background-color: bg-sidebar-btn-h;
  222. 	color: t-1 !important;
  223. 	text-decoration: none !important;
  224. }
  225. body .Pager .Highlight {
  226. 	color: t-1 !important;
  227. }
  228. // /stats script 
  229. canvas {
  230. 	filter: invert(1) brightness(2);
  231. }
  232. 	
  233. 	
  234. // history code
  235. .diff ul {
  236. 	background: #000;
  237. }
  238. .diff li:hover {
  239. 	background-color: rgba(255, 255, 255, .2) !important 
  240. }
  241. .diff li.del, .diff del strong {
  242. 	background-color: rgba(255, 0, 0, .2); 
  243. 	color: #fdd;
  244. }
  245. .diff li.ins, .diff ins strong {
  246. 	background-color: rgba(0, 255, 0, .2); 
  247. 	color: #dfd;
  248. }
  249. .diff li.diff-block-info {
  250. 	background: none repeat scroll 0 0 #252525;
  251. }
  252.  
  253. .DiscussionForm label {
  254. 	color: t-2;
  255. }
  256.  
  257. .editor-fullpage #editor-fullpage-candidate,
  258. .editor-fullpage #editor-fullpage-candidate .editor {
  259. 	background-color: #000;
  260. }
  261.  
  262. code {
  263. 	background-color: #151515;
  264. }
  265. pre, code, .Message pre {
  266. 	border: 1px solid #363432;
  267. }
  268.  
  269. if theme == Desert { 
  270.  
  271. 	 /* desert scheme ported from vim to google prettify */
  272. 	pre.prettyprint, pre.prettyprinted, .Message pre ol { display: block; background-color: #333 }
  273. 	pre .nocode { background-color: none; color: #000 }
  274. 	pre .str { color: #ffa0a0 } /* string  - pink */
  275. 	pre .kwd { color: #f0e68c; font-weight: bold }
  276. 	pre .com { color: #87ceeb } /* comment - skyblue */
  277. 	pre .typ { color: #98fb98 } /* type    - lightgreen */
  278. 	pre .lit { color: #cd5c5c } /* literal - darkred */
  279. 	pre .pun { color: #fff }    /* punctuation */
  280. 	pre .pln { color: #fff }    /* plaintext */
  281. 	pre .tag { color: #f0e68c; font-weight: bold } /* html/xml tag    - lightyellow */
  282. 	pre .atn { color: #bdb76b; font-weight: bold } /* attribute name  - khaki */
  283. 	pre .atv { color: #ffa0a0 } /* attribute value - pink */
  284. 	pre .dec { color: #98fb98 } /* decimal         - lightgreen */
  285.  
  286. 	/* Specify class=linenums on a pre to get line numbering */
  287. 	ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE } /* IE indents via margin-left */
  288. 	li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
  289. 	/* Alternate shading for lines */
  290. 	li.L1,li.L3,li.L5,li.L7,li.L9 { }
  291.  
  292. }
  293. else if theme == Sunburst {
  294.  
  295. 	/* Pretty printing styles. Used with prettify.js. */
  296. 	/* Vim sunburst theme by David Leibovic */
  297.  
  298. 	pre .str, code .str { color: #65B042; } /* string  - green */
  299. 	pre .kwd, code .kwd { color: #E28964; } /* keyword - dark pink */
  300. 	pre .com, code .com { color: #AEAEAE; font-style: italic; } /* comment - gray */
  301. 	pre .typ, code .typ { color: #89bdff; } /* type - light blue */
  302. 	pre .lit, code .lit { color: #3387CC; } /* literal - blue */
  303. 	pre .pun, code .pun { color: #fff; } /* punctuation - white */
  304. 	pre .pln, code .pln { color: #fff; } /* plaintext - white */
  305. 	pre .tag, code .tag { color: #89bdff; } /* html/xml tag    - light blue */
  306. 	pre .atn, code .atn { color: #bdb76b; } /* html/xml attribute name  - khaki */
  307. 	pre .atv, code .atv { color: #65B042; } /* html/xml attribute value - green */
  308. 	pre .dec, code .dec { color: #3387CC; } /* decimal - blue */
  309.  
  310. 	pre.prettyprint, code.prettyprint, , pre.prettyprinted, .Message pre ol {
  311. 		background-color: #000;
  312. 		border-radius: 8px;
  313. 	}
  314.  
  315. 	/* Specify class=linenums on a pre to get line numbering */
  316. 	ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE; } /* IE indents via margin-left */
  317. 	li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
  318. 	/* Alternate shading for lines */
  319. 	li.L1,li.L3,li.L5,li.L7,li.L9 { }
  320.  
  321. }
  322. else if theme == Sons-Of-Obsidian {
  323. 	/*
  324. 	* Derived from einaros's Sons of Obsidian theme at
  325. 	* http://studiostyl.es/schemes/son-of-obsidian by
  326. 	* Alex Ford of CodeTunnel:
  327. 	* http://CodeTunnel.com/blog/post/71/google-code-prettify-obsidian-theme
  328. 	*/
  329.  
  330. 	.str { color: #EC7600; }
  331. 	.kwd { color: #93C763; }
  332. 	.com { color: #66747B; }
  333. 	.typ { color: #678CB1; }
  334. 	.lit { color: #FACD22; }
  335. 	.pun { color: #F1F2F3; }
  336. 	.pln { color: #F1F2F3; }
  337. 	.tag { color: #8AC763; }
  338. 	.atn { color: #E0E2E4; }
  339. 	.atv { color: #EC7600; }
  340. 	.dec { color: purple; }
  341. 	pre.prettyprint { border: 0px solid #888; }
  342. 	ol.linenums
  343. 	{
  344. 		margin-top: 0;
  345. 		margin-bottom: 0;
  346. 	}
  347. 	.prettyprint, , pre.prettyprinted, .Message pre ol {
  348. 		background: #000;
  349. 	}
  350. 	li.L0, li.L1, li.L2, li.L3, li.L4, li.L5, li.L6, li.L7, li.L8, li.L9
  351. 	{
  352. 		color: #555;
  353. 		list-style-type: decimal;
  354. 	}
  355. 	li.L1, li.L3, li.L5, li.L7, li.L9 {
  356. 		background: #111;
  357. 	}
  358. }
  359. else if theme == Doxy {
  360. 	/* Doxy pretty-printing styles. Used with prettify.js.  */
  361.  
  362. 	pre .str, code .str { color: #fec243; } /* string  - eggyolk gold */
  363. 	pre .kwd, code .kwd { color: #8470FF; } /* keyword - light slate blue */
  364. 	pre .com, code .com { color: #32cd32; font-style: italic; } /* comment - green */
  365. 	pre .typ, code .typ { color: #6ecbcc; } /* type - turq green */
  366. 	pre .lit, code .lit { color: #d06; } /* literal - cherry red */
  367. 	pre .pun, code .pun { color: #8B8970;  } /* punctuation - lemon chiffon4  */
  368. 	pre .pln, code .pln { color: #f0f0f0; } /* plaintext - white */
  369. 	pre .tag, code .tag { color: #9c9cff; } /* html/xml tag  (bluey)  */
  370. 	pre .htm, code .htm { color: #dda0dd; } /* html tag  light purply*/
  371. 	pre .xsl, code .xsl { color: #d0a0d0; } /* xslt tag  light purply*/
  372. 	pre .atn, code .atn { color: #46eeee; font-weight: normal;} /* html/xml attribute name  - lt turquoise */
  373. 	pre .atv, code .atv { color: #EEB4B4; } /* html/xml attribute value - rosy brown2 */
  374. 	pre .dec, code .dec { color: #3387CC; } /* decimal - blue */
  375.  
  376. 	pre.prettyprint, code.prettyprint, pre.prettyprinted, .Message pre ol {
  377. 		font-family:'Droid Sans Mono','CPMono_v07 Bold','Droid Sans';
  378. 		font-weight: bold;
  379. 		font-size: 9pt;
  380. 		background-color: #0f0f0f;
  381. 		-moz-border-radius: 8px;
  382. 		-webkit-border-radius: 8px;
  383. 		-o-border-radius: 8px;
  384. 		-ms-border-radius: 8px;
  385. 		-khtml-border-radius: 8px;
  386. 		border-radius: 8px;
  387. 	}  /*  background is black (well, just a tad less dark )  */
  388.  
  389. 	pre.prettyprint a, code.prettyprint a {
  390. 		text-decoration:none;
  391. 	}
  392. 	/* Specify class=linenums on a pre to get line numbering; line numbers themselves are the same color as punctuation */
  393. 	ol.linenums { margin-top: 0; margin-bottom: 0; color: #8B8970; } /* IE indents via margin-left */
  394. 	li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
  395. 	/* Alternate shading for lines */
  396. 	li.L1,li.L3,li.L5,li.L7,li.L9 { }
  397.  
  398. }
  399. if wrap {
  400. 	pre.prettyprint {
  401. 		word-break: break-word;
  402. 		overflow-wrap: break-word;
  403. 		white-space: pre-wrap;
  404. 	}
  405. }
  406.  
  407. form.external-login-form,
  408. form.new_user {
  409.     background-color: bg;
  410.     border: none;
  411. }
  412. form.new_user input[type="text"], form.new_user input[type="email"], form.new_user input[type="password"] {
  413.     color: texxt-color;
  414.     background-color: textarea-color;
  415.     border: 1px solid rgba(255, 255, 255, .1);
  416.     box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
  417. }
  418.  
  419. //forum
  420. .ItemDiscussion .Meta, .DataList .Meta,
  421. dl.About dt {
  422. 	color: t-2;
  423. }
  424. .Item.Read {
  425. 	background: rgba(255, 255, 255, 0.02);
  426. }
  427. .MenuItems, .FlyoutMenu {
  428. 	border: 1px solid rgba(255, 255, 255, 0.1);
  429. 	background: bg-sidebar;
  430. 	color: t-1;
  431. }
  432. .Flyout:after {
  433. 	border-bottom: 7px solid bg-sidebar;
  434. }
  435. .MenuItems a, .MenuItems a:link, .MenuItems a:visited, .MenuItems a:active {
  436. 	color: t-1 !important;
  437. }
  438. .MenuItems a:hover {
  439. 	color: t-1 !important;
  440. 	text-decoration: none !important;
  441. 	background-color: bg-sidebar-btn-h !important;
  442. }
  443. .MenuItems hr {
  444. 	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  445. }
  446. .PopList .Meta {
  447. 	color: t-2;
  448. }
  449. .FlyoutMenu a {
  450. 	color: t-link;
  451. }
  452. blockquote.Quote, blockquote.UserQuote {
  453. 	background: rgba(255, 255, 255, 0.05);
  454. 	border-left: 4px solid rgba(255, 255, 255, 0.1);
  455. }
  456. .OptionsTitle {
  457. 	filter: invert(1);
  458. }
  459. .ReactSprite, .SpEditProfile {
  460. 	background-image: url(https://i.imgur.com/HbaKg8l.png);
  461. }
  462. .SpNotifications, .SpGlobe {
  463. 	background-position: -32px -212px;
  464. }
  465. .SpInbox, .SpEnvelope {
  466. 	background-position: 0 -228px;
  467. }
  468. .SpBookmarks, .SpStar {
  469. 	background-position: -80px -245px;
  470. }
  471. .SpDashboard, .SpOptions, .SpCog {
  472. 	background-position: 0 -211px;
  473. }
  474. table.PreferenceGroup tbody tr:hover td {
  475. 	background: rgba(255, 255, 255, 0.05);
  476. }
  477. .WarningMessage {
  478. 	background: #19100f;
  479. 	border: 1px solid #4c2825;
  480. }
  481. .DismissMessage {
  482. 	color: t-1;
  483. }
  484. .NavButton, .NavButton:hover, .ButtonGroup.Open .NavButton.Handle {
  485. 	border: 1px solid rgba(255, 255, 255, 0.1);
  486. 	background-color: bg-sidebar;
  487. 	color: t-1!important;
  488. 	text-decoration: none!important;
  489. }
  490.  
  491.  
  492. .PoweredByVanilla {
  493. 	display: none;
  494. }
  495.  
  496. #Body .Row {
  497. 	width: max-content;
  498. }
  499. #Content {
  500. 	width: maxwidthf px;
  501. }
  502.  
  503. //
  504. .tabs>*:not(.current) a {
  505. 	margin-top: unset;
  506. 	padding-top: unset;
  507. }
  508. .tabs .current {
  509. 	border-top: none;
  510. }
  511. .tabs>*>* {
  512. 	padding: 0.25em .5em .5em!important;
  513. }
  514. .current {
  515. 	font-weight: bold;
  516. }
  517.  
  518. #Content .HomepageTitle {
  519. 	border-top: none;
  520. 	margin: 0px;
  521. 	padding: 0px;
  522. }
  523.  
  524.  
  525.  
  526. if scrollbar {
  527. 	//chrome
  528. 	::-webkit-scrollbar {
  529. 		width: 8px;
  530. 		background-color: rgba(0, 0, 0, 0);
  531. 	} 
  532. 	::-webkit-scrollbar-thumb {
  533. 		background-color: #444;
  534. 	}
  535. 	::-webkit-scrollbar-thumb:hover {
  536. 		background: #777 !important;
  537. 	}
  538. 	//firefox
  539. 	html {
  540. 		scrollbar-color: #444 bg !important;
  541. 		scrollbar-width: thin !important;
  542. 	}
  543. }
  544.  
  545. }

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

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