Sleazy Fork is available in English.

ShadeRoot 4Chan

Eye-friendly magic in your browser for 4Chan

  1. //
  2. // Written by Glenn Wiking
  3. // Script Version: 1.0.2
  4. // Date of issue: 06/12/14
  5. // Date of resolution: 06/12/14
  6. //
  7. // ==UserScript==
  8. // @name ShadeRoot 4Chan
  9. // @namespace YT
  10. // @description Eye-friendly magic in your browser for 4Chan
  11. // @version 1.0.2
  12. // @icon https://i.imgur.com/8vq9zZn.png
  13.  
  14. // @include http://*.4chan.*
  15. // @include https://*.4chan.*
  16. // @include http://*.4cdn.org*
  17. // @include https://*.4cdn.org*
  18.  
  19. // ==/UserScript==
  20.  
  21. function ShadeRoot4Chan(css) {
  22. var head, style;
  23. head = document.getElementsByTagName('head')[0];
  24. if (!head) { return; }
  25. style = document.createElement('style');
  26. style.type = 'text/css';
  27. style.innerHTML = css;
  28. head.appendChild(style);
  29. }
  30.  
  31. ShadeRoot4Chan(
  32. 'html, iframe html, body {background: #112 !important; border-top: none;}'
  33. +
  34. '.top-box {background: none repeat scroll 0% 0% rgba(17, 29, 81, 1) !important;}'
  35. +
  36. '.box-outer {border: 1px solid #113 !important;}'
  37. +
  38. '#logo {opacity: .42 !important;}'
  39. +
  40. '.boxbar, .boxcontent {background-color: rgba(29, 31, 47, 1) !important;}'
  41. +
  42. '.boxbar h2, .shown a, #copyright {color: rgba(24, 93, 213, 1) !important;}'
  43. +
  44. 'video, .fileThumb img, .boxcontent img {opacity: .88;}'
  45. +
  46. '.reply {background-color: rgba(29, 31, 47, 1) !important; border-color: -moz-use-text-color rgba(15, 27, 45, 1) rgba(22, 40, 66, 1) -moz-use-text-color !important;}'
  47. +
  48. '.dateTime {color: rgba(60, 93, 122, 1) !important;}'
  49. +
  50. 'div.postInfo span.postNum a, div.postInfo span.subject {color: rgba(38, 78, 123, 1) !important;}'
  51. +
  52. 'a, a:visited, .boardTitle, .boardSubtitle {color: rgba(81, 105, 161, 1) !important;}'
  53. +
  54. '.quotelink {color: rgba(24, 102, 191, 1) !important;}'
  55. +
  56. '.yotsuba_b_new .backlink a {color: #117743 !important;}'
  57. +
  58. '#boardNavDesktop a {color: rgba(62, 101, 195, 1) !important;}'
  59. +
  60. 'hr {border-color: rgba(33, 41, 68, 1) -moz-use-text-color -moz-use-text-color !important;}'
  61. +
  62. 'blockquote, label, .fileText, .navLinks, .desktop, .center div, .boxcontent p, .boxcontent ul li {color: rgba(137, 140, 143, 1) !important;}'
  63. +
  64. '#announce, .top-box, .right-box, .left-box, #ft li.current, #ft li.fill {background: none repeat scroll 0% 0% #1D1F2F !important;}'
  65. +
  66. '#ft li {background: none repeat scroll 0% 0% rgba(28, 32, 36, 1);}'
  67. +
  68. '#ft li a, a.replylink:not(:hover) {color: rgba(135, 144, 153, 1) !important;}'
  69. +
  70. '.summary span a, .replylink, .replylink {color: 1C509E !important;}'
  71. +
  72. '#options-container a#option-button {color: #185DD5;}'
  73. +
  74. '.replyContainer .post {color: rgba(42, 48, 51, 1) !important;}'
  75. +
  76. '.redtxt {color: rgba(55, 80, 141, 1) !important;}'
  77. +
  78. '.quotelink {color: #117743 !important;}'
  79. +
  80. '.reply:target, .reply.highlight {background: none repeat scroll 0% 0% rgba(23, 42, 60, 1) !important; border-color: -moz-use-text-color rgba(33, 48, 92, 1) rgba(13, 32, 86, 1) -moz-use-text-color !important;}'
  81. +
  82. '.pagelist {background: none repeat scroll 0% 0% #112 !important; border-color: -moz-use-text-color #111122 #111122 -moz-use-text-color !important;}'
  83. +
  84. '.quoteLink, .quotelink, .deadlink {color: rgba(28, 80, 158, 1) !important;}'
  85. +
  86. '.closed, .tu-error, .meta {color: rgba(17, 83, 170, 1) !important;}'
  87. +
  88. '.teaser {color: rgba(45, 104, 147, 1) !important;}'
  89. +
  90. '.pages {font-size: 15px;}'
  91. +
  92. '.pages strong {font-weight: bold; font-size: 20px !important; font-family: Georgia;}'
  93. +
  94. '.pagelist > .prev {padding: 4px; font-weight: bold;}'
  95. +
  96. '.pages, .prev {color: rgba(137, 140, 143, 0.42) !important;}'
  97. +
  98. '.boardList a {font-size: 1.3em;}'
  99. +
  100. '.boardList a:last-child {font-weight: bold;}'
  101. +
  102. '.boardList a:nth-child(2) {font-weight: bold;}'
  103. +
  104. '.boardList a:nth-child(15) {font-weight: bold;}'
  105. +
  106. '.center, #bannerCnt {border: 1px solid #212944 !important;}'
  107. +
  108. '.yui-panel {background-color: rgba(24, 40, 57, 1);}'
  109. +
  110. '.yui-panel .bd p, .yui-panel .dp ol, .bd li {color: rgba(61, 130, 189, 1);}'
  111. +
  112. '#disclaimer-dialog .hd {background: none repeat scroll 0% 0% rgba(11, 102, 170, 1);}'
  113. +
  114. '#disclaimer-dialog {border: 1px solid rgba(30, 86, 170, 1) !important;}'
  115. +
  116. '.mask {background-color: rgba(13, 21, 33, 1);}'
  117. +
  118. '.ft .button-group button {background-color: rgba(37, 91, 161, 1); color: rgba(111, 188, 218, 1);}'
  119. +
  120. '.ft .button-group button {border-color: rgba(9, 66, 165, 1) rgba(14, 63, 128, 1); border-radius: 5px;}'
  121. +
  122. '.newPostsMarker:not(#quote-preview) {box-shadow: 0px 3px rgba(19, 84, 198, 1);}'
  123. +
  124. '.ctrl-wrap, .btn-wrap {color: rgba(26, 70, 146, 1) !important;}'
  125. +
  126. 'a, #absbot a, .button, #filters-ctrl {color: rgba(19, 81, 217, 1) !important;}'
  127. +
  128. '#togglePostFormLink a, .boardList a, #footer-links a, a.replylink:not(:hover), div#absbot a:not(:hover) {color: rgba(33, 80, 176, 1) !important;}'
  129. +
  130. '#absbot, .absBotDisclaimer {color: rgba(0, 136, 83, 1) !important;}'
  131. +
  132. '#entries th {border-left: 1px solid rgba(15, 50, 113, 1) !important; background-color: rgba(12, 69, 134, 1) !important; color: rgba(35, 129, 222, 1) !important;}'
  133. +
  134. '#entries tr {border-bottom: 1px solid rgba(18, 59, 120, 1) !important;}'
  135. +
  136. '#entries td {border-left: 1px solid rgba(18, 59, 120, 1) !important; background: rgba(9, 31, 56, 1) !important; color: rgba(32, 96, 168, 1) !important;}'
  137. +
  138. 'footer {color: rgba(13, 72, 149, 1) !important;}'
  139. +
  140. 'footer li {background-color: rgba(6, 26, 68, 1) !important;}'
  141. +
  142. '.boxcontent hr, .left-box hr, hr {color: rgba(0, 59, 136, 1) !important; background-color: rgba(11, 63, 155, 1) !important;}'
  143. +
  144. '#doc .boxcontent hr, .search-label-bottom hr {display: none;}'
  145. +
  146. '.boxcontent {color: rgba(29, 101, 228, 1) !important;}'
  147. +
  148. '.boxcontent dt {color: rgba(92, 146, 255, 1) !important;}'
  149. +
  150. '.stripe-button-el:disabled span, .stripe-button-el.disabled span {color: rgba(127, 172, 231, 1) !important; background: none repeat scroll 0% 0% rgba(20, 65, 144, 1) !important; text-shadow: 0px 1px 0px rgba(25, 77, 137, 0.5) !important;}'
  151. +
  152. '#ft, #ft li.current, #ft li.fill {color: rgba(24, 63, 159, 1) !important;}'
  153. +
  154. 'input[type="text"]:focus, input[type="password"]:focus, input:focus:not([type]), textarea:focus {border: 1px solid rgba(43, 108, 192, 1) !important;}'
  155. +
  156. '.form-row input[type="text"] {background-color: rgba(21, 52, 86, 1) !important; border: 1px solid rgba(48, 98, 219, 1) !important;}'
  157. +
  158. '.content h3 {background: none repeat scroll 0% 0% rgba(16, 63, 146, 1) !important; border: 1px solid rgba(22, 73, 195, 1) !important; color: rgba(92, 143, 246, 1) !important;}'
  159. +
  160. '.content, tbody {color: rgba(59, 115, 200, 1) !important;}'
  161. +
  162. 'p strong {color: #185DBA !important;}'
  163. // // // // // BLOG
  164. +
  165. '#masthead {background-color: rgba(6, 45, 104, 1) !important; color: rgba(77, 111, 209, 1) !important; border-top: .5rem solid rgba(24, 71, 167, 1) !important;}'
  166. +
  167. '#masthead #logo a {background: none repeat scroll 0% 0% rgba(66, 155, 211, 1) !important;}'
  168. +
  169. '#content article.post .post-inner {background: #062D68 !important;}'
  170. +
  171. '.post-inner p a {border-bottom: 1px solid #5169A1 !important;}'
  172. +
  173. '#content article.post .post-meta {border-top: 1px solid rgba(8, 64, 162, 1) !important; background: #062D68 !important;}'
  174. +
  175. '.post-inner blockquote {border-left: 1px solid #185DBA !important;}'
  176. +
  177. 'footer .tags li {background-color: #062D68 !important;}'
  178. +
  179. '#sidebar .widget {border-bottom: 1px solid #0840A2 !important;}'
  180. +
  181. '#sidebar {background-color: #062D68 !important;}'
  182. +
  183. '#sidebar h1, #sidebar h2, #sidebar h3, #sidebar h4, #sidebar h5, #sidebar h6, .date a, .share a, .note-count a {color: rgba(17, 96, 215, 1) !important;}'
  184. +
  185. '#sidebar #search-input {background-color: rgba(10, 62, 141, 1) !important; color: rgba(128, 191, 252, 1) !important;}'
  186. +
  187. '#sidebar #twitter .button.follow {background: none repeat scroll 0% 0% rgba(27, 104, 219, 1) !important;}'
  188. +
  189. '#sidebar #twitter .button.follow:hover {background: none repeat scroll 0% 0% rgba(52, 165, 237, 1) !important; color: rgba(198, 220, 242, 1) !important;}'
  190. +
  191. '.post-inner p img {opacity: .8 !important;}'
  192. +
  193. '#content article.text h1 a {color: rgba(46, 130, 225, 1) !important;}'
  194. +
  195. '.boxcontent hr, .left-box hr, hr {color: rgba(0, 59, 136, 0) !important; background-color: rgba(11, 63, 155, 0) !important;}'
  196. +
  197. '.yotsuba_new .panelHeader {border-bottom: 1px solid rgba(42, 91, 177, 1) !important;}'
  198. +
  199. '.settings-expand, .pointer {color: rgba(46, 139, 230, 1) !important;}'
  200. +
  201. 'table.postForm > tbody > tr > td:first-child {background-color: rgba(25, 52, 108, 1) !important; color: rgba(56, 128, 189, 1) !important; border: 1px solid rgba(12, 41, 93, 1) !important;}'
  202. +
  203. '.rc-anchor-light {background: none repeat scroll 0% 0% rgba(17, 103, 186, 1) !important; border: 1px solid rgba(26, 112, 186, 1) !important;}'
  204. +
  205. 'table.postForm > tbody > tr > td > input[type="text"], textarea[name="com"] {background-color: rgba(36, 47, 60, 1) !important; color: #BBC !important; border: 1px solid rgba(19, 31, 54, 1) !important;}'
  206. +
  207. 'div.post div.postInfoM {border-bottom: 1px solid rgba(25, 79, 132, 1) !important; background-color: rgba(31, 64, 129, 1) !important;}'
  208. +
  209. '.mobile div.reply {border: 1px solid rgba(11, 72, 140, 1) !important;}'
  210. +
  211. '.dateTime {color: rgba(60, 133, 197, 1) !important;}'
  212. +
  213. '.postLink .button, .mobile .button {background-color: rgba(24, 99, 183, 1) !important; border: 1px solid rgba(7, 62, 98, 1) !important; background-image: none !important; color: rgba(215, 222, 230, 1) !important;}'
  214. +
  215. '.backlink.mobile {background-color: rgba(14, 39, 72, 1) !important; border-top: 1px solid rgba(11, 57, 96, 1) !important;}'
  216. +
  217. 'div.opContainer {background-color: rgba(9, 20, 36, 1) !important; border: 1px solid rgba(13, 37, 68, 1) !important;}'
  218. +
  219. 'div.postLink {background-color: rgba(38, 86, 170, 1) !important; border-top: 1px solid rgba(14, 83, 161, 1) !important;}'
  220. +
  221. 'div#boardNavMobile {background-color: rgba(81, 146, 219, 1) !important; border-bottom: 2px solid rgba(44, 102, 146, 1) !important;}'
  222. +
  223. 'div.pagelist div.cataloglink {border-left: 1px solid rgba(0, 56, 140, 1) !important;}'
  224. // // // // // OVERRIDE
  225. +
  226. 'div.reply {border: 1px solid rgba(14, 34, 56, 1) !important;}'
  227. );