☰

Klevo paturbintas CSS'as

Pakeičia kaip atrodo visi puslapiai klevas.mif.vu.lt/*

  1. // ==UserScript==
  2. // @name         Klevo paturbintas CSS'as
  3. // @version      0.1
  4. // @description  Pakeičia kaip atrodo visi puslapiai klevas.mif.vu.lt/*
  5. // @author       Dom__
  6. // @match        https://klevas.mif.vu.lt/*
  7. // @match        http://klevas.mif.vu.lt/*
  8. // @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
  9. // @grant        none
  10. // @license      AGPLv3 
  11. // @namespace http://tampermonkey.net/
  12. // ==/UserScript==
  13.  
  14.     // Shamelessly taken and adapted from here: https://github.com/jez/pandoc-markdown-css-theme/blob/master/public/css/theme.css
  15.     let mycss = `<style>
  16. :root {
  17.   --text-color: #24292e;
  18.   --background-color: #ffffff;
  19.   --alt-background-color: #f6f8fa;
  20.   --link-color: #0366d6;
  21.   --blockquote-text-color: #6a737d;
  22.   --blockquote-border-color: #dfe2e5;
  23.   --header-border-color: #eaecef;
  24.   --hr-background-color: #e1e4e8;
  25.   --table-tr-border-color: #c6cbd1;
  26.   --table-td-border-color: #dfe2e5;
  27.   --kbd-text-color: #444d56;
  28.   --kbd-background-color: #fafbfc;
  29.   --kbd-border-color: #c6cbd1;
  30.   --kbd-shadow-color: #959da5;
  31. }
  32. * {
  33.   box-sizing: border-box;
  34. }
  35. html {
  36.   font-size: 16px;
  37. }
  38. body {
  39.   color: var(--text-color);
  40.   background-color: var(--background-color);
  41.   font-family: "Fira Sans", fira-sans, sans-serif, color-emoji;
  42.   line-height: 1.5;
  43.   word-wrap: break-word;
  44.   max-width: 980px;
  45.   margin: auto;
  46.   padding: 4em;
  47. }
  48. @media screen and (max-width: 799px) {
  49.   html {
  50.     font-size: 14px;
  51.   }
  52.   body {
  53.     padding: 1em;
  54.   }
  55. }
  56. @media screen and (min-width: 1280px) {
  57.   html {
  58.     font-size: 18px;
  59.   }
  60. }
  61. a {
  62.   background-color: transparent;
  63.   color: var(--link-color);
  64.   text-decoration: none;
  65. }
  66. a:active,
  67. a:hover {
  68.   outline-width: 0;
  69. }
  70. a:hover {
  71.   text-decoration: underline;
  72. }
  73. strong {
  74.   font-weight: 600;
  75. }
  76. img {
  77.   border-style: none;
  78. }
  79. hr {
  80.   box-sizing: content-box;
  81.   height: 0.25em;
  82.   padding: 0;
  83.   margin: 1.5em 0;
  84.   overflow: hidden;
  85.   background-color: var(--hr-background-color);
  86.   border: 0;
  87. }
  88. hr::before {
  89.   display: table;
  90.   content: "";
  91. }
  92. hr::after {
  93.   display: table;
  94.   clear: both;
  95.   content: "";
  96. }
  97. input {
  98.   font-family: inherit;
  99.   font-size: inherit;
  100.   line-height: inherit;
  101.   margin: 0;
  102.   overflow: visible;
  103. }
  104. [type="checkbox"] {
  105.   box-sizing: border-box;
  106.   padding: 0;
  107. }
  108. table {
  109.   border-spacing: 0;
  110.   border-collapse: collapse;
  111. }
  112. td,
  113. th {
  114.   padding: 0;
  115. }
  116. h1,
  117. h2,
  118. h3,
  119. h4,
  120. h5,
  121. h6 {
  122.   font-weight: 600;
  123.   margin: 0;
  124. }
  125. h1 {
  126.   font-size: 2em;
  127. }
  128. h2 {
  129.   font-size: 1.5em;
  130. }
  131. h3 {
  132.   font-size: 1.25em;
  133. }
  134. h4 {
  135.   font-size: 1em;
  136. }
  137. h5 {
  138.   font-size: 0.875em;
  139. }
  140. h6 {
  141.   font-size: 0.85em;
  142. }
  143. p {
  144.   margin-top: 0;
  145.   margin-bottom: 0.625em;
  146. }
  147. blockquote {
  148.   margin: 0;
  149. }
  150. ul,
  151. ol {
  152.   padding-left: 0;
  153.   margin-top: 0;
  154.   margin-bottom: 0;
  155. }
  156. ol ol,
  157. ul ol {
  158.   list-style-type: lower-roman;
  159. }
  160. ul ul ol,
  161. ul ol ol,
  162. ol ul ol,
  163. ol ol ol {
  164.   list-style-type: lower-alpha;
  165. }
  166. dd {
  167.   margin-left: 0;
  168. }
  169. code,
  170. kbd,
  171. pre {
  172.   font-family: "Fira Mono", fira-mono, monospace, color-emoji;
  173.   font-size: 1em;
  174.   word-wrap: normal;
  175. }
  176. code {
  177.   border-radius: 0.1875em;
  178.   font-size: 0.85em;
  179.   padding: 0.2em 0.4em;
  180.   margin: 0;
  181. }
  182. pre {
  183.   margin-top: 0;
  184.   margin-bottom: 0;
  185.   font-size: 0.75em;
  186. }
  187. pre>code {
  188.   padding: 0;
  189.   margin: 0;
  190.   font-size: 1em;
  191.   word-break: normal;
  192.   white-space: pre;
  193.   background: transparent;
  194.   border: 0;
  195. }
  196. .highlight {
  197.   margin-bottom: 1em;
  198. }
  199. .highlight pre {
  200.   margin-bottom: 0;
  201.   word-break: normal;
  202. }
  203. .highlight pre,
  204. pre {
  205.   padding: 1em;
  206.   overflow: auto;
  207.   font-size: 0.85em;
  208.   line-height: 1.5;
  209.   background-color: var(--alt-background-color);
  210.   border-radius: 0.1875em;
  211. }
  212. pre code {
  213.   background-color: transparent;
  214.   border: 0;
  215.   display: inline;
  216.   padding: 0;
  217.   margin: 0;
  218.   overflow: visible;
  219.   line-height: inherit;
  220.   word-wrap: normal;
  221. }
  222. .pl-0 {
  223.   padding-left: 0 !important;
  224. }
  225. .pl-1 {
  226.   padding-left: 0.25em !important;
  227. }
  228. .pl-2 {
  229.   padding-left: 0.5em !important;
  230. }
  231. .pl-3 {
  232.   padding-left: 1em !important;
  233. }
  234. .pl-4 {
  235.   padding-left: 1.5em !important;
  236. }
  237. .pl-5 {
  238.   padding-left: 2em !important;
  239. }
  240. .pl-6 {
  241.   padding-left: 2.5em !important;
  242. }
  243. a:not([href]) {
  244.   color: inherit;
  245.   text-decoration: none;
  246. }
  247. .anchor {
  248.   float: left;
  249.   padding-right: 0.25em;
  250.   margin-left: -1.25em;
  251.   line-height: 1;
  252. }
  253. .anchor:focus {
  254.   outline: none;
  255. }
  256. p,
  257. blockquote,
  258. ul,
  259. ol,
  260. dl,
  261. table,
  262. pre {
  263.   margin-top: 0;
  264.   margin-bottom: 1em;
  265. }
  266. blockquote {
  267.   padding: 0 1em;
  268.   color: var(--blockquote-text-color);
  269.   border-left: 0.25em solid var(--blockquote-border-color);
  270. }
  271. blockquote>:first-child {
  272.   margin-top: 0;
  273. }
  274. blockquote>:last-child {
  275.   margin-bottom: 0;
  276. }
  277. kbd {
  278.   display: inline-block;
  279.   padding: 0.1875em 0.3125em;
  280.   font-size: 0.6875em;
  281.   line-height: 1;
  282.   color: var(--kbd-text-color);
  283.   vertical-align: middle;
  284.   background-color: var(--kbd-background-color);
  285.   border: solid 1px var(--kbd-border-color);
  286.   border-bottom-color: var(--kbd-shadow-color);
  287.   border-radius: 3px;
  288.   box-shadow: inset 0 -1px 0 var(--kbd-shadow-color);;
  289. }
  290. h1,
  291. h2,
  292. h3,
  293. h4,
  294. h5,
  295. h6 {
  296.   margin-top: 1.5em;
  297.   margin-bottom: 1em;
  298.   font-weight: 600;
  299.   line-height: 1.25;
  300. }
  301. h1:hover .anchor,
  302. h2:hover .anchor,
  303. h3:hover .anchor,
  304. h4:hover .anchor,
  305. h5:hover .anchor,
  306. h6:hover .anchor {
  307.   text-decoration: none;
  308. }
  309. h1 {
  310.   padding-bottom: 0.3em;
  311.   font-size: 2em;
  312.   border-bottom: 1px solid var(--header-border-color);
  313. }
  314. h2 {
  315.   padding-bottom: 0.3em;
  316.   font-size: 1.5em;
  317.   border-bottom: 1px solid var(--header-border-color);
  318. }
  319. h3 {
  320.   font-size: 1.25em;
  321. }
  322. h4 {
  323.   font-size: 1em;
  324. }
  325. h5 {
  326.   font-size: 0.875em;
  327. }
  328. h6 {
  329.   font-size: 0.85em;
  330.   opacity: 0.67;
  331. }
  332. ul,
  333. ol {
  334.   padding-left: 2em;
  335. }
  336. ul ul,
  337. ul ol,
  338. ol ol,
  339. ol ul {
  340.   margin-top: 0;
  341.   margin-bottom: 0;
  342. }
  343. li {
  344.   overflow-wrap: break-word;
  345. }
  346. li>p {
  347.   margin-top: 1em;
  348. }
  349. li+li {
  350.   margin-top: 0.25em;
  351. }
  352. dl {
  353.   padding: 0;
  354. }
  355. dl dt {
  356.   padding: 0;
  357.   margin-top: 1em;
  358.   font-size: 1em;
  359.   font-style: italic;
  360.   font-weight: 600;
  361. }
  362. dl dd {
  363.   padding: 0 1em;
  364.   margin-bottom: 1em;
  365. }
  366. table {
  367.   display: block;
  368.   width: 100%;
  369.   overflow: auto;
  370. }
  371. table th {
  372.   font-weight: 600;
  373. }
  374. table th,
  375. table td {
  376.   padding: 0.375em 0.8125em;
  377.   border: 1px solid var(--table-td-border-color);
  378. }
  379. table tr {
  380.   background-color: var(--background-color);
  381.   border-top: 1px solid var(--table-tr-border-color);
  382. }
  383. table tr:nth-child(2n) {
  384.   background-color: var(--alt-background-color);
  385. }
  386. img {
  387.   max-width: 100%;
  388.   box-sizing: content-box;
  389. }
  390. img[align=right] {
  391.   padding-left: 1.25em;
  392. }
  393. img[align=left] {
  394.   padding-right: 1.25em;
  395. }
  396. .task-list-item {
  397.   list-style-type: none;
  398. }
  399. .task-list-item+.task-list-item {
  400.   margin-top: 0.1875em;
  401. }
  402. .task-list-item input {
  403.   margin: 0 0.2em 0.25em -1.6em;
  404.   vertical-align: middle;
  405. }
  406. :root {
  407.   --text-color: #2e3436;
  408.   --background-color: #f6f5f4;
  409.   --alt-background-color: #edeeef;
  410.   --link-color: #0d71de;
  411.   --blockquote-text-color: #747e85;
  412.   --blockquote-border-color: #d6d8da;
  413.   --header-border-color: #e1e2e4;
  414.   --hr-background-color: #d8dadd;
  415.   --table-tr-border-color: #bdc1c6;
  416.   --table-td-border-color: #d6d8da;
  417.   --kbd-text-color: #4e585e;
  418.   --kbd-background-color: #f1f1f1;
  419.   --kbd-border-color: #bdc1c6;
  420.   --kbd-shadow-color: #8c939a;
  421. }
  422. @media (prefers-color-scheme: dark) {
  423.   :root {
  424.     --text-color: #eeeeec;
  425.     --background-color: #353535;
  426.     --alt-background-color: #3a3a3a;
  427.     --link-color: #b5daff;
  428.     --blockquote-text-color: #a8a8a6;
  429.     --blockquote-border-color: #525252;
  430.     --header-border-color: #474747;
  431.     --hr-background-color: #505050;
  432.     --table-tr-border-color: #696969;
  433.     --table-td-border-color: #525252;
  434.     --kbd-text-color: #cececc;
  435.     --kbd-background-color: #3c3c3c;
  436.     --kbd-border-color: #696969;
  437.     --kbd-shadow-color: #979797;
  438.   }
  439. }
  440.  </style>`;
  441.  
  442.     document.head.insertAdjacentHTML("afterbegin", mycss);
  443.     document.body.style = null;