🏠 Home 

Better Searx Dark Theme(searx.be)

SearX(BE) dark theme.

  1. // ==UserScript==
  2. // @name Better Searx Dark Theme(searx.be)
  3. // @namespace -
  4. // @version 0.2
  5. // @description SearX(BE) dark theme.
  6. // @author Not You
  7. // @match *searx.be/*
  8. // @require https://code.jquery.com/jquery-3.3.1.min.js
  9. // @license GPLv3
  10. // @license-link https://www.gnu.org/licenses/gpl-3.0.txt
  11. // @grant none
  12. // @run-at document-body
  13. // ==/UserScript==
  14. /*
  15. Features:
  16. - Invisible Navigation Bar
  17. - Darker links
  18. - Darker categories font and color under them
  19. - Darker description
  20. - Darker description for Wikipedia bar
  21. - Works With Dark Theme
  22. Bonus Features:
  23. - Change Title
  24. - Replaced Main Logo with old one
  25. - Replaced Favicon with old one
  26. - Fixed Main Logo Margin
  27. - Adding Fake History
  28. */
  29. // Change Main Logo //
  30. if(window.location.pathname.indexOf('/') != -1) {
  31. document.title = "SearX";
  32. $('.center-block.img-responsive').attr('src', 'https://searx.bar/static/themes/oscar/img/logo_searx_a.png')
  33. }
  34. // Change Title //
  35. document.title = 'SearX'
  36. // Change Favicon //
  37. $('link[rel*="icon"]').prop('href','https://searx.bar/static/themes/oscar/img/favicon.png');
  38. // Add Fake History //
  39. window.history.pushState('', '', '/search?q=i%20<3%20GNU&categories=general');
  40. window.history.pushState('', '', '/search?q=microsoft%20malware%20gnu&categories=general');
  41. window.history.pushState('', '', '/search?q=google%20malware%20gnu&categories=general');
  42. window.history.pushState('', '', '/search?q=GNU%20FSF&categories=images');
  43. window.history.pushState('', '', '/search?q=hello%20kitty&categories=general');
  44. window.history.pushState('', '', '/search');
  45. // CSS //
  46. (function() {
  47. let css = `
  48. body {
  49. background: rgb(25, 25, 25) !important;
  50. }
  51. select, option {
  52. background-color: rgb(25, 25, 25) !important;
  53. border: 1px solid rgb(20, 20, 20) !important;
  54. color: rgb(236, 236, 236) !important;
  55. }
  56. button, input, select, textarea {
  57. border: 1px solid rgb(19, 19, 19) !important;
  58. background-color: rgb(25, 25, 25) !important;
  59. color: rgb(210, 210, 210) !important;
  60. }
  61. td, tr, tbody, thead, table {
  62. color: rgb(210, 210, 210) !important;
  63. }
  64. span::before, span::after {
  65. color: rgb(210, 210, 210) !important;
  66. }
  67. p {
  68. color: rgb(210, 210, 210) !important;
  69. }
  70. li {
  71. color: rgb(210, 210, 210) !important;
  72. }
  73. .small, small {
  74. color: rgb(210, 210, 210) !important;
  75. }
  76. #q {
  77. background-color: rgb(25, 25, 25) !important;
  78. border: 1px solid rgb(20, 20, 20) !important;
  79. color: rgb(238, 238, 238) !important;
  80. }
  81. .btn {
  82. color: rgb(238, 238, 238) !important;
  83. background-color: rgb(25, 25, 25) !important;
  84. border: 1px solid rgb(20, 20, 20) !important;
  85. }
  86. .btn:hover {
  87. color: 0 !important;
  88. background-color: rgb(22, 22, 22) !important;
  89. }
  90. label[for="check-advanced"] {
  91. color: rgb(238, 238, 238);
  92. }
  93. .searxng-navbar {
  94. background: rgba(0, 0, 0, 0) !important;
  95. }
  96. .searxng-navbar .instance a {
  97. color: rgb(220, 220, 220) !important;
  98. }
  99. .searxng-navbar a, .searxng-navbar a:hover {
  100. color: rgb(220, 220, 220) !important;
  101. }
  102. #main-logo {
  103. margin-top: 10vh;
  104. }
  105. #categories input[type="checkbox"]:checked + label, .search_categories input[type="checkbox"]:checked + label {
  106. background-color: rgba(0, 0, 0, 0) !important;
  107. border-bottom: rgb(220, 220, 220) 5px solid !important;
  108. color: rgb(220, 220, 220) !important;
  109. }
  110. #categories *, .modal-wrapper * {
  111. background: rgb(25, 25, 25) none repeat scroll 0% 0% !important;
  112. color: rgb(219, 219, 219) !important;
  113. }
  114. .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  115. color: rgb(110, 110, 110) !important;
  116. }
  117. .col-sm-3.col-md-2 {
  118. color: rgb(110, 110, 110) !important;
  119. }
  120. .nav-tabs.nav-justified > .active > a, .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
  121. background-color: rgb(22, 22, 22) !important;
  122. color: rgb(110, 110, 110) !important;
  123. }
  124. .nav-tabs.nav-justified > li > a {
  125. color: rgb(110, 110, 110) !important;
  126. }
  127. .nav > li > a:focus, .nav > li > a:hover {
  128. background-color: rgb(22, 22, 22) !important;
  129. }
  130. .table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th, .table-striped > thead > tr:nth-child(2n+1) > th {
  131. background: rgb(24, 24, 24) none repeat scroll 0% 0% !important;
  132. color: rgb(150, 150, 150) !important;
  133. }
  134. .table-hover > tbody > tr:hover > td, .table-hover > tbody > tr:hover > th {
  135. background: rgb(22, 22, 22) none repeat scroll 0% 0% !important;
  136. }
  137. .name {
  138. color: rgb(110, 110, 110) !important;
  139. }
  140. .stacked-bar-chart-median {
  141. background: rgb(226, 226, 226) none repeat scroll 0% 0%;
  142. border: 1px solid rgba(12, 12, 12, 0.9);
  143. }
  144. .text-right {
  145. color: rgb(110, 110, 110) !important;
  146. }
  147. .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
  148. right: 73px !important;
  149. }
  150. .onoffswitch-inner::after, .onoffswitch-inner::before {
  151. background: rgb(24, 24, 24) none repeat scroll 0% 0% !important;
  152. }
  153. .panel {
  154. border: 1px solid rgb(20, 20, 20);
  155. background: rgba(0, 0, 0, 0) none repeat scroll 0px 0px;
  156. }
  157. .panel-heading {
  158. color: rgb(110, 110, 110) !important;
  159. background: rgba(21, 21, 21, 0.4) none repeat scroll 0% 0% !important;
  160. }
  161. .panel-body {
  162. color: rgb(110, 110, 110) !important;
  163. background: rgb(22, 22, 22) none repeat scroll 0% 0% !important;
  164. border-color: rgb(21, 21, 21) !important;
  165. }
  166. div#advanced-search-container div#categories label {
  167. color: rgb(220, 220, 220) !important;
  168. }
  169. .text-muted > small > a {
  170. color: rgb(255, 255, 255) !important;
  171. }
  172. .infobox_part {
  173. color: rgb(230, 230, 230) !important;
  174. }
  175. .r###lt-content {
  176. color: rgb(252, 252, 252) !important;
  177. }
  178. .r###lt-content, .r###lt-format, .r###lt-source {
  179. margin-top: 2px !important;
  180. margin-bottom: 0 !important;
  181. word-wrap: break-word !important;
  182. color: color: rgb(238, 238, 328) !important;
  183. font-size: 13px !important;
  184. }
  185. .label-default {
  186. color: rgb(11, 11, 11);
  187. }
  188. .external-link {
  189. color: rgb(28, 225, 135) !important;
  190. }
  191. .r###lt_header a .highlight {
  192. color: rgb(255, 255, 255) !important;
  193. background-color: rgba(0, 0, 0, 0) !important;
  194. }
  195. .highlight {
  196. color: rgb(255, 255, 255) !important;
  197. }
  198. span {
  199. color: rgb(110, 110, 110) !important;
  200. }
  201. .r###lt_header {
  202. color: rgb(110, 110, 110) !important;
  203. }
  204. .r###lt_header a {
  205. color: rgb(232, 232, 232) !important;
  206. }
  207. .r###lt_header a:hover {
  208. color: rgb(214, 214, 214) !important;
  209. }
  210. .r###lt_header a:visited {
  211. color: rgb(225, 225, 225) !important;
  212. }
  213. .r###lt-code:hover, .r###lt-default:hover, .r###lt-map:hover, .r###lt-torrent:hover, .r###lt-videos:hover {
  214. background-color: rgb(24, 24, 24) !important;
  215. }
  216. a:hover {
  217. text-decoration: underline !important;
  218. }
  219. #categories input[type="checkbox"]:checked + label, .search_categories input[type="checkbox"]:checked + label {
  220. border-bottom: rgb(220, 220, 220) 5px solid !important;
  221. }
  222. `;
  223. if (typeof GM_addStyle !== 'undefined') {
  224. GM_addStyle(css);
  225. } else {
  226. let styleNode = document.createElement("style");
  227. styleNode.appendChild(document.createTextNode(css));
  228. (document.querySelector("head") || document.documentElement).appendChild(styleNode);
  229. }
  230. })();
  231. // Hi There Again (: