☰

GreasyFork - Dark Theme

Customizable Dark theme For GreasyFork.org

当前为 2020-01-24 提交的版本，查看 最新版本。

  1. /* ==UserStyle==
  2. @name           GreasyFork - Dark Theme
  3. @namespace      https://greasyfork.org/en/users/124677-pabli
  4. @version        1.0.5
  5. @description    Customizable Dark theme For GreasyFork.org
  6. @author         Pabli
  7. @license        CC-BY-SA-4.0
  8. @homepageURL    https://greasyfork.org/en/scripts/395180-greasyfork-dark-theme
  9. @supportURL     https://greasyfork.org/en/scripts/395180-greasyfork-dark-theme/feedback
  10. @preprocessor   stylus
  11. @var            color bg-header "Header background" #640000
  12. @var            color t-header "Header text" #fafafa
  13. @var            color bg "Background" #111
  14. @var            color t-1 "Main text" #fafafa
  15. @var            color t-2 "Second text" #aeaeae
  16. @var            color t-link "Link" #ff7070
  17. @var            color bg-sidebar "Sidebar" #1a1a1a
  18. @var            color bg-sidebar-btn "Sidebar button" #510909
  19. @var            color bg-sidebar-btn-h "Sidebar button hover" #323232
  20. @var            color bg-btn "Button" #1a1a1a
  21. @var            color bg-btn-h "Button hover" #323232
  22. @var            color t-btn "Button text" #fafafa
  23. @var            color border-btn "Button border" rgba(255, 255, 255, 0.1)
  24. @var            color border-btn-h "Button border hover" rgba(255, 255, 255, 0.2)
  25. @var            color bg-textarea "Text area background" #1a1a1a
  26. @var            number maxwidth "Width Site (px)" 960
  27. @var            number maxwidthf "Width Forum (px)" 960
  28. @var            select theme "Theme syntax" ["Desert", "Sunburst", "Sons-Of-Obsidian", "Doxy"]
  29. @var            checkbox wrap "Code wrap" 1
  30. @var            checkbox scrollbar "Dark Scroll Bar" 1
  31. @var            checkbox sidebar "Forum sidebar to the right" 0
  32. ==/UserStyle== */
  33.  
  34. @-moz-document domain("greasyfork.org") {
  35.  
  36. .width-constraint {
  37. 	max-width: maxwidth px;
  38. }
  39. body, .script-list, .user-list, .text-content,
  40. #script-info,
  41. body:not(.Settings), #Content {
  42. 	background-color: bg;
  43. 	color: t-1;
  44. }
  45. .announcement input {
  46. 	color: t-1;
  47. }
  48. #main-header,
  49. body:not(.Settings) #Head {
  50. 	background-color: bg-header;
  51. 	background-image: linear-gradient(rgba(0, 0, 0, 0.3), bg-header);
  52. }
  53. .script-list, .user-list, .text-content,
  54. .list-option-group ul,
  55. #script-info,
  56. #Content {
  57. 	box-shadow: none;
  58. 	border: none;
  59. }
  60. a, a:visited, body:not(.Settings) a:not(.Button):not(.ChangePicture) {
  61. 	color: t-link;
  62. 	text-decoration: none;
  63. 		&:hover {
  64. 			color: t-link;
  65. 			text-decoration: underline;
  66. 		}
  67. }
  68. #Head a {
  69. 	text-decoration: none;
  70. 	&:hover {
  71. 		text-decoration: underline;
  72. 	}
  73. }
  74. #main-header, #main-header a, #main-header a:visited, #main-header a:active,
  75. #site-nav>nav a:hover {
  76. 	color: t-header;
  77. }
  78. #site-name-text h1 a:hover {
  79. 	text-decoration: none !important;
  80. }
  81. #home-script-nav {
  82. 	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  83. }
  84. #language-selector-locale {
  85. 	background: bg-header;
  86. 	color: t-header;
  87. 	border: 1px solid rgba(255, 255, 255, .5);
  88. }
  89. nav nav,
  90. .SiteMenu nav {
  91. 	background-color: bg-header;
  92. }
  93.  
  94. textarea, textarea:focus, select, input, input.DateBox, input.InputBox, input.SmallInput, .InputBox, .Preview, input.SmallInput:focus, input.InputBox:focus,
  95. form.new_user input[type="text"], form.new_user input[type="email"], form.new_user input[type="password"], input[type="text"] {
  96. 	color: t-1;
  97. 	background: bg-textarea;
  98. 	border: 1px solid rgba(255, 255, 255, .1);
  99. 	outline: none;
  100. }
  101. .Button, .Button.Active, .ButtonGroup.Open .Button.Handle, .Button:focus, .Button:active, .BigButton, .NewDiscussion,
  102. form.new_user input[type="submit"], button {
  103. 	background: bg-btn;
  104. 	color: t-btn !important;
  105. 	border: 1px solid border-btn;
  106. 	text-decoration: none;
  107. 	box-shadow: none;
  108. 	cursor: pointer;
  109. 		&:hover {
  110. 			background: bg-btn-h;
  111. 			color: t-btn;
  112. 			border-color: border-btn-h;
  113. 			text-decoration: none;
  114. 		}
  115. }
  116. :focus {
  117. 	outline-style: none;
  118. }
  119. //search
  120. .sidebar-search input[type=submit], .home-search input[type=submit], .search-submit, .SiteSearch .Button {
  121. 	color: transparent !important;
  122. 	opacity: 1;
  123. 	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 !important;
  124. 	border: none !important;
  125. 	cursor: pointer;
  126. }
  127. .SiteSearch .Button {
  128. 	top: 6px;
  129. }
  130. .SearchForm .SiteSearch .Button {
  131. 	top: 10px;
  132. }
  133. #Panel input.InputBox, .AddPeople textarea.MultiComplete {
  134. 	border-radius: 5px;
  135. }
  136. .sidebar-search input[type=search],
  137. .home-search input[type=search] {
  138. 	border-radius: 5px;
  139. 	padding: 5px;
  140. 	padding-inline-end: 25px;
  141. }
  142. .sidebar-search input[type=submit],
  143. .home-search input[type=submit] {
  144. 	padding: 5px;
  145. }
  146. .SearchForm .InputBox {
  147. 	border: 1px solid rgba(255, 255, 255, .1);
  148. }
  149. 	
  150. // sidebar
  151. .list-option-group ul,
  152. #Panel .FilterMenu, #Panel .PanelCategories, #Panel .MeBox,
  153. .list-option-groups .carbon-ad, .list-option-groups .adsense-ad {
  154. 	border: 1px solid rgba(255, 255, 255, .1);
  155. 	background-color: bg-sidebar;
  156. 	box-shadow: none;
  157. }
  158. .list-option-group .list-current, 
  159. #Panel .FilterMenu .Active a, #Panel .PanelCategories .Active a {
  160. 	border-left: none;
  161. 	margin: unset;
  162. 	background: bg-sidebar-btn !important;
  163. 	color: t-1;
  164. }
  165. .list-option-group a:hover, .list-option-group a:focus,
  166.  #Panel .FilterMenu a:hover, #Panel .PanelCategories a:hover, #Panel .FilterMenu a:focus, #Panel .PanelCategories a:focus {
  167. 	background: bg-sidebar-btn-h;
  168. 	color: t-1 !important;
  169. 	text-decoration: none !important;
  170. 	box-shadow: none;
  171. }
  172. if sidebar {
  173. 	#Panel {
  174. 		float: right;
  175. 	}
  176. }
  177.  
  178. #user-profile {
  179. 	border: 1px solid rgba(255, 255, 255, .1);
  180. 	background-color: bg-sidebar;
  181. }
  182. .change-script-set section {
  183. 	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  184. }
  185.  
  186. .install-link, .install-help-link {
  187. 	color: #fff !important;
  188. }
  189. .script-list li:not(.ad-entry),
  190. .DataList .Item, .NarrowList .Item {
  191. 	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  192. }
  193. #additional-info>div {
  194. 	border: 1px solid rgba(255, 255, 255, 0.1);
  195. 	background-color: rgba(0, 0, 0, 0.2);
  196. }
  197. .notice {
  198. 	background-color: #1c2123;
  199. 	border-left: 6px solid #204050;
  200. }	
  201. .alert {
  202. 	background-color: #222211;
  203. 	border-left: 6px solid #a1931a;
  204. }
  205. :target {
  206. 	background-color: rgba(255, 255, 255, 0.05);
  207. }
  208.  
  209. .good-rating-count {
  210. 	color: #80ff80;
  211. }
  212. .ok-rating-count {
  213. 	color: #ffff80;
  214. }
  215. .bad-rating-count {
  216. 	color: #ff8080;
  217. }
  218.  
  219. //pagination buttons
  220. .pagination>*, .script-list+.pagination>*, .user-list+.pagination>*,
  221. .Pager > * {
  222. 	background-color: transparent;
  223. }
  224. .pagination>a:hover, .pagination>a:focus,
  225. .Pager > a:hover, .Pager > a:focus {
  226. 	background-color: bg-sidebar-btn-h;
  227. 	color: t-1 !important;
  228. 	text-decoration: none !important;
  229. }
  230. body .Pager .Highlight {
  231. 	color: t-1 !important;
  232. }
  233. // /stats script 
  234. canvas {
  235. 	filter: invert(1) brightness(2);
  236. }
  237.  
  238. // history code
  239. .diff ul {
  240. 	background: #000;
  241. }
  242. .diff li:hover {
  243. 	background-color: rgba(255, 255, 255, .2) !important 
  244. }
  245. .diff li.del, .diff del strong {
  246. 	background-color: rgba(255, 0, 0, .2); 
  247. 	color: #fdd;
  248. }
  249. .diff li.ins, .diff ins strong {
  250. 	background-color: rgba(0, 255, 0, .2); 
  251. 	color: #dfd;
  252. }
  253. .diff li.diff-block-info {
  254. 	background: none repeat scroll 0 0 #252525;
  255. }
  256.  
  257. .DiscussionForm label {
  258. 	color: t-2;
  259. }
  260.  
  261. .editor-fullpage #editor-fullpage-candidate,
  262. .editor-fullpage #editor-fullpage-candidate .editor {
  263. 	background-color: #000;
  264. }
  265.  
  266. code, .Message pre {
  267. 	background-color: #151515;
  268. }
  269. pre, code, .Message pre {
  270. 	border: 1px solid rgba(255, 255, 255, .1);
  271. }
  272.  
  273. if theme == Desert { 
  274. 	/* desert scheme ported from vim to google prettify */
  275. 	pre.prettyprint, pre.prettyprinted, .Message pre ol { display: block; background-color: #333 }
  276. 	pre .nocode { background-color: none; color: #000 }
  277. 	pre .str { color: #ffa0a0 } /* string  - pink */
  278. 	pre .kwd { color: #f0e68c; font-weight: bold }
  279. 	pre .com { color: #87ceeb } /* comment - skyblue */
  280. 	pre .typ { color: #98fb98 } /* type    - lightgreen */
  281. 	pre .lit { color: #cd5c5c } /* literal - darkred */
  282. 	pre .pun { color: #fff }    /* punctuation */
  283. 	pre .pln { color: #fff }    /* plaintext */
  284. 	pre .tag { color: #f0e68c; font-weight: bold } /* html/xml tag    - lightyellow */
  285. 	pre .atn { color: #bdb76b; font-weight: bold } /* attribute name  - khaki */
  286. 	pre .atv { color: #ffa0a0 } /* attribute value - pink */
  287. 	pre .dec { color: #98fb98 } /* decimal         - lightgreen */
  288.  
  289. 	/* Specify class=linenums on a pre to get line numbering */
  290. 	ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE } /* IE indents via margin-left */
  291. 	li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
  292. 	/* Alternate shading for lines */
  293. 	li.L1,li.L3,li.L5,li.L7,li.L9 { }
  294. }
  295. else if theme == Sunburst {
  296. 	/* Pretty printing styles. Used with prettify.js. */
  297. 	/* Vim sunburst theme by David Leibovic */
  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. 	/* Specify class=linenums on a pre to get line numbering */
  315. 	ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE; } /* IE indents via margin-left */
  316. 	li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
  317. 	/* Alternate shading for lines */
  318. 	li.L1,li.L3,li.L5,li.L7,li.L9 { }
  319. }
  320. else if theme == Sons-Of-Obsidian {
  321. 	/*
  322. 	* Derived from einaros's Sons of Obsidian theme at
  323. 	* http://studiostyl.es/schemes/son-of-obsidian by
  324. 	* Alex Ford of CodeTunnel:
  325. 	* http://CodeTunnel.com/blog/post/71/google-code-prettify-obsidian-theme
  326. 	*/
  327. 	.str { color: #EC7600; }
  328. 	.kwd { color: #93C763; }
  329. 	.com { color: #66747B; }
  330. 	.typ { color: #678CB1; }
  331. 	.lit { color: #FACD22; }
  332. 	.pun { color: #F1F2F3; }
  333. 	.pln { color: #F1F2F3; }
  334. 	.tag { color: #8AC763; }
  335. 	.atn { color: #E0E2E4; }
  336. 	.atv { color: #EC7600; }
  337. 	.dec { color: purple; }
  338. 	pre.prettyprint { border: 0px solid #888; }
  339. 	ol.linenums
  340. 	{
  341. 		margin-top: 0;
  342. 		margin-bottom: 0;
  343. 	}
  344. 	.prettyprint, , pre.prettyprinted, .Message pre ol {
  345. 		background: #000;
  346. 	}
  347. 	li.L0, li.L1, li.L2, li.L3, li.L4, li.L5, li.L6, li.L7, li.L8, li.L9
  348. 	{
  349. 		color: #555;
  350. 		list-style-type: decimal;
  351. 	}
  352. 	li.L1, li.L3, li.L5, li.L7, li.L9 {
  353. 		background: #111;
  354. 	}
  355. }
  356. else if theme == Doxy {
  357. 	/* Doxy pretty-printing styles. Used with prettify.js.  */
  358. 	pre .str, code .str { color: #fec243; } /* string  - eggyolk gold */
  359. 	pre .kwd, code .kwd { color: #8470FF; } /* keyword - light slate blue */
  360. 	pre .com, code .com { color: #32cd32; font-style: italic; } /* comment - green */
  361. 	pre .typ, code .typ { color: #6ecbcc; } /* type - turq green */
  362. 	pre .lit, code .lit { color: #d06; } /* literal - cherry red */
  363. 	pre .pun, code .pun { color: #8B8970;  } /* punctuation - lemon chiffon4  */
  364. 	pre .pln, code .pln { color: #f0f0f0; } /* plaintext - white */
  365. 	pre .tag, code .tag { color: #9c9cff; } /* html/xml tag  (bluey)  */
  366. 	pre .htm, code .htm { color: #dda0dd; } /* html tag  light purply*/
  367. 	pre .xsl, code .xsl { color: #d0a0d0; } /* xslt tag  light purply*/
  368. 	pre .atn, code .atn { color: #46eeee; font-weight: normal;} /* html/xml attribute name  - lt turquoise */
  369. 	pre .atv, code .atv { color: #EEB4B4; } /* html/xml attribute value - rosy brown2 */
  370. 	pre .dec, code .dec { color: #3387CC; } /* decimal - blue */
  371. 	pre.prettyprint, code.prettyprint, pre.prettyprinted, .Message pre ol {
  372. 		font-family:'Droid Sans Mono','CPMono_v07 Bold','Droid Sans';
  373. 		font-weight: bold;
  374. 		font-size: 9pt;
  375. 		background-color: #0f0f0f;
  376. 		-moz-border-radius: 8px;
  377. 		-webkit-border-radius: 8px;
  378. 		-o-border-radius: 8px;
  379. 		-ms-border-radius: 8px;
  380. 		-khtml-border-radius: 8px;
  381. 		border-radius: 8px;
  382. 	}  /*  background is black (well, just a tad less dark )  */
  383. 	pre.prettyprint a, code.prettyprint a {
  384. 		text-decoration:none;
  385. 	}
  386. 	/* Specify class=linenums on a pre to get line numbering; line numbers themselves are the same color as punctuation */
  387. 	ol.linenums { margin-top: 0; margin-bottom: 0; color: #8B8970; } /* IE indents via margin-left */
  388. 	li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
  389. 	/* Alternate shading for lines */
  390. 	li.L1,li.L3,li.L5,li.L7,li.L9 { }
  391. }
  392. if wrap {
  393. 	pre.prettyprint, pre code {
  394. 		word-break: break-word;
  395. 		overflow-wrap: break-word;
  396. 		white-space: pre-wrap;
  397. 	}
  398. }
  399. // ace theme tomorrow_night_bright
  400. // Enable syntax-highlighting source editor
  401. #ace-editor {
  402. 	border: 1px solid rgba(255, 255, 255, 0.1);
  403. }
  404. .ace_gutter {
  405. 	background: #1a1a1a !important;
  406. 	color: #DEDEDE !important;
  407. }
  408. .ace_print-margin {
  409. 	width: 1px !important;
  410. 	background: #1a1a1a !important;
  411. }
  412. .ace_editor {
  413. 	background-color: #000000 !important;
  414. 	color: #DEDEDE !important;
  415. }
  416. .ace_cursor {
  417. 	color: #9F9F9F !important;
  418. }
  419. .ace_marker-layer .ace_selection {
  420. 	background: #424242 !important;
  421. }
  422. .ace_multiselect .ace_selection.ace_start {
  423. 	box-shadow: 0 0 3px 0px #000000 !important;
  424. }
  425. .ace_marker-layer .ace_step {
  426. 	background: rgb(102, 82, 0) !important;
  427. }
  428. .ace_marker-layer .ace_bracket {
  429. 	margin: -1px 0 0 -1px !important;
  430. 	border: 1px solid #888888 !important;
  431. }
  432. .ace_marker-layer .ace_highlight {
  433. 	border: 1px solid rgb(110, 119, 0) !important;
  434. 	border-bottom: 0 !important;
  435. 	box-shadow: inset 0 -1px rgb(110, 119, 0) !important;
  436. 	margin: -1px 0 0 -1px !important;
  437. 	background: rgba(255, 235, 0, 0.1) !important;
  438. }
  439. .ace_marker-layer .ace_active-line {
  440. 	background: #2A2A2A !important;
  441. }
  442. .ace_gutter-active-line {
  443. 	background-color: #2A2A2A !important;
  444. }
  445. .ace_stack {
  446. 	background-color: rgb(66, 90, 44) !important;
  447. }
  448. .ace_marker-layer .ace_selected-word {
  449. 	border: 1px solid #888888 !important;
  450. }
  451. .ace_invisible {
  452. 	color: #343434 !important;
  453. }
  454. .ace_keyword,
  455. .ace_meta,
  456. .ace_storage,
  457. .ace_storage.ace_type,
  458. .ace_support.ace_type {
  459. 	color: #C397D8 !important;
  460. }
  461. .ace_keyword.ace_operator {
  462. 	color: #70C0B1 !important;
  463. }
  464. .ace_constant.ace_character,
  465. .ace_constant.ace_language,
  466. .ace_constant.ace_numeric,
  467. .ace_keyword.ace_other.ace_unit,
  468. .ace_support.ace_constant,
  469. .ace_variable.ace_parameter {
  470. 	color: #E78C45 !important;
  471. }
  472. .ace_constant.ace_other {
  473. 	color: #EEEEEE !important;
  474. }
  475. .ace_invalid {
  476. 	color: #CED2CF !important;
  477. 	background-color: #DF5F5F !important;
  478. }
  479. .ace_invalid.ace_deprecated {
  480. 	color: #CED2CF !important;
  481. 	background-color: #B798BF !important;
  482. }
  483.  
  484. .ace_fold {
  485. 	background-color: #7AA6DA !important;
  486. 	border-color: #DEDEDE !important;
  487. }
  488. .ace_entity.ace_name.ace_function,
  489. .ace_support.ace_function,
  490. .ace_variable {
  491. 	color: #7AA6DA !important;
  492. }
  493. .ace_support.ace_class,
  494. .ace_support.ace_type {
  495. 	color: #E7C547 !important;
  496. }
  497. .ace_heading,
  498. .ace_markup.ace_heading,
  499. .ace_string {
  500. 	color: #B9CA4A !important;
  501. }
  502. .ace_entity.ace_name.ace_tag,
  503. .ace_entity.ace_other.ace_attribute-name,
  504. .ace_meta.ace_tag,
  505. .ace_string.ace_regexp,
  506. .ace_variable {
  507. 	color: #D54E53 !important;
  508. }
  509. .ace_comment {
  510. 	color: #969896 !important;
  511. }
  512. .ace_c9searchresults.ace_keyword {
  513. 	color: #C2C280 !important;
  514. }
  515. .ace_indent-guide {
  516. 	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAEklEQVQImWNgYGBgYFBXV/8PAAJoAXX4kT2EAAAAAElFTkSuQmCC') right repeat-y !important;
  517. }
  518.  
  519.  
  520. form.external-login-form,
  521. form.new_user {
  522.     background-color: bg;
  523.     border: none;
  524. }
  525. form.new_user input[type="text"], form.new_user input[type="email"], form.new_user input[type="password"] {
  526.     color: texxt-color;
  527.     background-color: textarea-color;
  528.     border: 1px solid rgba(255, 255, 255, .1);
  529.     box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
  530. }
  531.  
  532. //forum
  533. .ItemDiscussion .Meta, .DataList .Meta,
  534. dl.About dt {
  535. 	color: t-2;
  536. }
  537. .Item.Read {
  538. 	background: rgba(255, 255, 255, 0.02);
  539. }
  540. .MenuItems, .FlyoutMenu {
  541. 	border: 1px solid rgba(255, 255, 255, 0.1);
  542. 	background: bg-sidebar;
  543. 	color: t-1;
  544. }
  545. .Flyout:after {
  546. 	border-bottom: 7px solid bg-sidebar;
  547. }
  548. .MenuItems a, .MenuItems a:link, .MenuItems a:visited, .MenuItems a:active {
  549. 	color: t-1 !important;
  550. }
  551. .MenuItems a:hover {
  552. 	color: t-1 !important;
  553. 	text-decoration: none !important;
  554. 	background-color: bg-sidebar-btn-h !important;
  555. }
  556. .MenuItems hr {
  557. 	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  558. }
  559. .PopList .Meta {
  560. 	color: t-2;
  561. }
  562. .FlyoutMenu a {
  563. 	color: t-link;
  564. }
  565. blockquote.Quote, blockquote.UserQuote {
  566. 	background: rgba(255, 255, 255, 0.05);
  567. 	border-left: 4px solid rgba(255, 255, 255, 0.1);
  568. }
  569. .OptionsTitle {
  570. 	filter: invert(1);
  571. }
  572. .ReactSprite, .SpEditProfile {
  573. 	background-image: url(https://i.imgur.com/HbaKg8l.png);
  574. }
  575. .SpNotifications, .SpGlobe {
  576. 	background-position: -32px -212px;
  577. }
  578. .SpInbox, .SpEnvelope {
  579. 	background-position: 0 -228px;
  580. }
  581. .SpBookmarks, .SpStar {
  582. 	background-position: -80px -245px;
  583. }
  584. .SpDashboard, .SpOptions, .SpCog {
  585. 	background-position: 0 -211px;
  586. }
  587. table.PreferenceGroup tbody tr:hover td {
  588. 	background: rgba(255, 255, 255, 0.05);
  589. }
  590. .WarningMessage {
  591. 	background: #19100f;
  592. 	border: 1px solid #4c2825;
  593. }
  594. .DismissMessage {
  595. 	color: t-1;
  596. }
  597. .NavButton, .NavButton:hover, .ButtonGroup.Open .NavButton.Handle {
  598. 	border: 1px solid rgba(255, 255, 255, 0.1);
  599. 	background-color: bg-sidebar;
  600. 	color: t-1!important;
  601. 	text-decoration: none!important;
  602. }
  603.  
  604. .PoweredByVanilla {
  605. 	display: none;
  606. }
  607.  
  608. #Panel {
  609. 	margin: unset;
  610. }
  611. #Body {
  612. 	max-width: none;
  613. }
  614. #Body .Row {
  615. 	width: max-content;
  616. }
  617. #Content {
  618. 	width: maxwidthf - 200 px;
  619. }
  620.  
  621. //
  622. .tabs>*:not(.current) a {
  623. 	margin-top: unset;
  624. 	padding-top: unset;
  625. }
  626. .tabs .current {
  627. 	border-top: none;
  628. }
  629. .tabs>*>* {
  630. 	padding: 0.25em .5em .5em!important;
  631. }
  632. .current {
  633. 	font-weight: bold;
  634. }
  635.  
  636. .PageControls {
  637. 	margin: 0px;
  638. }
  639.  
  640. #Content .HomepageTitle {
  641. 	border-top: none;
  642. 	margin: 0px;
  643. 	padding: 0px;
  644. }
  645.  
  646. img[src*="images/defaulticon.png"] {
  647. 	opacity: 0.5;
  648. }
  649.  
  650. if scrollbar {
  651. 	//chrome
  652. 	::-webkit-scrollbar {
  653. 		width: 8px;
  654. 		background-color: rgba(0, 0, 0, 0);
  655. 	} 
  656. 	::-webkit-scrollbar-thumb {
  657. 		background-color: #444;
  658. 	}
  659. 	::-webkit-scrollbar-thumb:hover {
  660. 		background: #777 !important;
  661. 	}
  662. 	::-webkit-scrollbar-corner {
  663. 		background: #444;
  664. 	}
  665. 	//firefox
  666. 	html {
  667. 		scrollbar-color: #444 bg !important;
  668. 		scrollbar-width: thin !important;
  669. 	}
  670. }
  671.  
  672.  
  673. //ads
  674. div#cf, div#cf span.cf-wrapper {
  675. 	background-color: rgba(255, 255, 255, .03) !important;
  676. }
  677. div#cf span.cf-wrapper span.cf-text,
  678. div#cf span.cf-wrapper a.cf-text,
  679. div#cf span.cf-wrapper a.cf-powered-by {
  680. 	color: hsla(0,0%,100%,.7) !important;
  681. }
  682. div#cf span.cf-wrapper a.cf-text span.cf-cta {
  683. 	color: #fff !important;
  684. }
  685.  
  686. }