Better StackOverflow

adds outline to code blocks, ad block, no cookie modal, various fixes.

当前为 2023-05-23 提交的版本,查看 最新版本

  1. /* ==UserStyle==
  2. @name Better StackOverflow
  3. @description adds outline to code blocks, ad block, no cookie modal, various fixes.
  4. @author NotYou
  5. @match *://stackoverflow.com/*
  6. @match *://*.stackoverflow.com/*
  7. @match *://stackexchange.com/*
  8. @match *://superuser.com/*
  9. @match *://serverfault.com/*
  10. @match *://askubuntu.com/*
  11. @match *://stackapps.com/*
  12. @match *://mathoverflow.net/*
  13. @namespace -
  14. @version 1.2.0
  15. @license GPL-3.0-or-later
  16. ==/UserStyle== */
  17.  
  18. /* Darker Accepted Mark Background in questions list */
  19.  
  20. .s-post-summary--stats .s-post-summary--stats-item.has-answers.has-accepted-answer {
  21. background-color: var(--green-600);
  22. border-color: var(--green-600);
  23. }
  24.  
  25. /* Fix; Keyboard and Tag Elements | https://meta.stackexchange.com/a/257138/260841 */
  26.  
  27. kbd,
  28. .s-prose .post-tag {
  29. white-space: pre-wrap;
  30. max-width: 100%;
  31. }
  32.  
  33. /* Fix; Keyboard and Quote Elements | https://meta.stackexchange.com/a/296077/230144 */
  34.  
  35. kbd, blockquote {
  36. overflow: hidden;
  37. }
  38.  
  39. /* Fix; Non-Vertically Aligned Elements at Sidebar | https://meta.stackexchange.com/q/388770/ */
  40.  
  41. #sidebar .related a,
  42. #sidebar .linked a {
  43. margin: auto 0;
  44. }
  45.  
  46. /* Fix; Overflowing Text | https://meta.stackexchange.com/a/296077/131428 */
  47.  
  48. .answer .js-post-body,
  49. .question .js-post-body {
  50. overflow: hidden;
  51. }
  52.  
  53. /* Fix; Remove Default FF styles for <select> */
  54.  
  55. select {
  56. text-indent: 0.01px;
  57. -webkit-appearance: none;
  58. -moz-appearance: none;
  59. appearance: none;
  60. }
  61.  
  62. /* Ad Block */
  63.  
  64. .img_ad,
  65. #dfp-tsb,
  66. #dfp-smlb,
  67. #dfp-tlb,
  68. #dfp-mlb,
  69. .js-report-ad-button-container,
  70. .adsbox,
  71.  
  72. /* Cookie */
  73.  
  74. .js-consent-banner {
  75. display: none !important;
  76. }
  77.  
  78. .js-tag-editor.tag-editor.multi-line.s-input {
  79. width: 100% !important;
  80. }
  81.  
  82. /* Code Outline */
  83.  
  84. .default.s-code-block {
  85. --color: rgba(0, 0, 0, .2);
  86. }
  87.  
  88. [class*="lang-"] {
  89. border: 2px solid var(--color);
  90. }
  91.  
  92. [class*="lang-"]::after {
  93. content: '\a'var(--content);
  94. color: var(--color) !important;
  95. padding: 2px 5px 5px 5px;
  96. font-weight: 800;
  97. }
  98.  
  99. .snippet-code [class*="lang-"]::after {
  100. content: '\a\a'var(--content);
  101. }
  102.  
  103. .s-code-block::after {
  104. font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  105. }
  106.  
  107. .lang-none {
  108. --content: "Plain";
  109. --color: rgb(100, 0, 0);
  110. }
  111.  
  112. .lang-js,
  113. .lang-javascript {
  114. --color: rgb(247, 223, 30);
  115. --content: "JS";
  116. }
  117.  
  118. .lang-js::after {
  119. color: rgb(0, 0, 0);
  120. }
  121.  
  122. .lang-html {
  123. --color: rgb(242, 103, 44);
  124. --content: "HTML";
  125. }
  126.  
  127. .lang-css {
  128. --color: rgb(52, 169, 222);
  129. --content: "CSS";
  130. }
  131.  
  132. .lang-java {
  133. --color: rgb(234, 146, 5);
  134. --content: "Java";
  135. }
  136.  
  137. .lang-py,
  138. .lang-python {
  139. --color: rgb(54, 119, 173);
  140. --content: "Python";
  141. }
  142.  
  143. .lang-cpp {
  144. --color: rgb(101, 154, 210);
  145. --content: "C++";
  146. }
  147.  
  148. .lang-cs,
  149. .lang-csharp {
  150. --color: rgb(93, 108, 189);
  151. --content: "C#";
  152. }
  153.  
  154. .lang-c {
  155. --color: rgb(93, 108, 189);
  156. --content: "C";
  157. }
  158.  
  159. .lang-php {
  160. --color: rgb(93, 108, 189);
  161. --content: "PHP";
  162. }
  163.  
  164. .lang-rb {
  165. --color: rgb(174, 21, 5);
  166. --content: "Ruby";
  167. }
  168.  
  169. .lang-r {
  170. --color: rgb(35, 105, 190);
  171. --content: "R";
  172. }
  173.  
  174. .lang-perl {
  175. --color: rgb(66, 68, 109);
  176. --content: "Perl";
  177. }
  178.  
  179. .lang-bsh {
  180. --color: rgb(41, 48, 54);
  181. --content: "Bash";
  182. }
  183.  
  184. .lang-kotlin {
  185. --color: rgb(117, 114, 227);
  186. --content: "Kotlin";
  187. }
  188.  
  189. .lang-rust {
  190. --color: rgb(0, 0, 0);
  191. --content: "Rust";
  192. }
  193.  
  194. .lang-regex {
  195. --color: rgb(64, 209, 178);
  196. --content: "RegEx";
  197. }
  198.  
  199. .lang-sql {
  200. --color: rgb(192, 207, 212);
  201. --content: "SQL";
  202. }
  203.  
  204. .lang-pascal {
  205. --color: rgb(50, 96, 160);
  206. --content: "Pascal";
  207. }
  208.  
  209. .lang-vb {
  210. --color: rgb(60, 110, 179);
  211. --content: "VB";
  212. }
  213.  
  214. .lang-xml {
  215. --color: rgb(0, 95, 174);
  216. --content: "XML";
  217. }
  218.  
  219. .lang-lua {
  220. --color: rgb(0, 0, 128);
  221. --content: "Lua";
  222. }
  223.  
  224. .lang-go {
  225. --color: rgb(106, 215, 228);
  226. --content: "Go";
  227. }
  228.  
  229. .lang-swift {
  230. --color: rgb(250, 42, 31);
  231. --content: "Swift";
  232. }
  233.  
  234. .lang-clj {
  235. --color: rgb(145, 180, 255);
  236. --content: "Clojure";
  237. }
  238.  
  239. .lang-scala {
  240. --color: rgb(234, 2, 0);
  241. --content: "Scala";
  242. }
  243.  
  244. .lang-typescript {
  245. --color: rgb(49, 120, 198);
  246. --content: "TypeScript";
  247. }