API tools faq
paste
Gomuboy

4chan CSS guide

Gomuboy
Apr 30th, 2016
182
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 3.22 KB | None | 0 0
raw download clone embed print report diff
  1. @namespace url(http://www.w3.org/1999/xhtml);
  2.  
  3. @-moz-document domain("4chan.org"){
  4.  
  5.  
  6.  
  7. /*------------------------------------------------------*/
  8.  
  9. /*You can thank Moko for this
  10.  *declare as many colors as you want, there is no limit
  11.  *use like this - "background-color: var(--body-text);"
  12.  */
  13.  
  14. /*declare your colors as variables in ":root"
  15.  *where r = red, g = green, b = blue, a = opacity in this order
  16.  *use easy to remember variable names
  17.  *don't forget your syntax
  18.  */
  19.  
  20. /*example*/
  21.  
  22. :root{
  23.   --back-bg: rgba(16,19,39,1) !important;
  24.   --reply-bg: rgba(222,207,185,1) !important;
  25.   --thread-bg: rgba(192, 192, 192, 1) !important;
  26.   --shad-txt: rgba(0,0,0,0.35) !important;
  27.   --high-txt: rgba(219,75,96,1) !important;
  28.   --content-txt: rgba(55,28,0,1) !important;
  29. }
  30.  
  31.  
  32.  
  33. /*------------------------------------------------------*/
  34.  
  35. /*front page of 4chan*/
  36. div#popular-threads.box-outer.top-box,
  37. div#boards.box-outer.top-box,
  38. div#site-stats.box-outer.top-box{
  39.  
  40. }
  41.  
  42. /*main background*/
  43. body, html{
  44.  
  45. }
  46.  
  47. /*when hovering over replies
  48.  *this is the preview box*/
  49. #quote-preview{
  50.  
  51. }
  52.  
  53. /*opening post*/
  54. div.postContainer.opContainer{
  55.  
  56. }
  57.  
  58. /*replies*/
  59. div.thread div.reply{
  60.  
  61. }
  62.  
  63. /*quick reply box, captcha and user interface*/
  64. #quickReply textarea,
  65. div#qrHeader.drag.postblock,  
  66. input#qrFile,
  67. #quickReply input[type="submit"],
  68. .postblock,
  69. #quickReply input[type="text"],
  70. #quickReply textarea,
  71. #quickReply #recaptcha_response_field,
  72. .extPanel input[type="text"], .extPanel textarea,
  73. #qrCaptchaContainer,
  74. #qrCaptchaContainer > div > div{
  75.  
  76. }
  77.  
  78. /*"Browse - no file selected" box*/
  79. input#qrFile{
  80.  
  81. }
  82.  
  83. /*MOOT
  84.  *try messing with this then
  85.  *look at catalog and then at a thread*/
  86. .thread{
  87.  
  88. }
  89.  
  90. /*[code]install gentoo appearance[/code]*/
  91. .prettyprint{
  92.  
  93. }
  94.  
  95. /*image thumbnails in replies*/
  96. div.post div.file .fileThumb img{
  97.  
  98. }
  99.  
  100. /*expanded view*/
  101. .expandedWebm,
  102. .expanded-thumb{
  103.  
  104. }
  105.  
  106. /*youtube box*/
  107. div.media-embed iframe{
  108.  
  109. }
  110.  
  111. /*404*/
  112. .boxcontent,
  113. .boxbar{
  114.  
  115. }
  116.  
  117. /*------------------------------------------------------*/
  118.  
  119. /*catalog, when you hover over an image
  120.  *this is the box and its contents*/
  121. #post-preview,
  122. .post-author,
  123. .post-subject,
  124. .post-tripcode,
  125. .post-teaser,
  126. .post-page:before,
  127. .post-page,
  128. .post-page:after,
  129. .post-last{
  130.  
  131. }
  132.  
  133. /*affects thread appearance in catalog*/
  134. .extended-small .teaser,
  135. .extended-large .teaser{
  136.  
  137. }
  138.  
  139. /*the text preview in catalog*/
  140. div.teaser{
  141.  
  142. }
  143.  
  144. /*contains the box, reply stats and image stats*/
  145. .meta,
  146. .meta b{
  147.  
  148. }
  149.  
  150. /*catalog thumbnail*/
  151. .thumb{
  152.  
  153. }
  154.  
  155. /*filter box in catalog*/
  156. div#filters.panel{
  157.  
  158. }
  159.  
  160. /*------------------------------------------------------*/
  161.  
  162. /*DEATH TO BOMBASTIC ADVERTISING*/
  163. img.bottomad,
  164. div#absbot,
  165. .center,
  166. div.center.middlead,
  167. strong,
  168. img#toggleMsgBtn,
  169. img.middlead,
  170. .click-me{
  171.   display: none !important;
  172. }
  173.  
  174. /*------------------------------------------------------*/
  175.  
  176. /*annoyed by trip-codes, then use this*/
  177. span.postertrip{
  178.  
  179. }
  180.  
  181. /*------------------------------------------------------*/
  182.  
  183. /*for the rest in firefox right click
  184.  *go to "inspect element"
  185.  *click right-hand arrow box icon "pick an element"
  186.  *hover over what you want to change in page
  187.  *copy the name
  188.  */
  189.  
  190.  
  191.  
  192. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!