Custom Styling for Manning LiveBook

Apply custom CSS to improve readability on Manning LiveBook

当前为 2024-10-09 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name Custom Styling for Manning LiveBook
  3. // @namespace http://tampermonkey.net/
  4. // @version 0.13
  5. // @description Apply custom CSS to improve readability on Manning LiveBook
  6. // @match https://livebook.manning.com/*
  7. // @grant GM_addStyle
  8. // @run-at document-start
  9. // @license MIT
  10. // ==/UserScript==
  11.  
  12. (function() {
  13. 'use strict';
  14.  
  15. // Add Google Fonts link
  16. const linkElement = document.createElement('link');
  17. linkElement.rel = 'stylesheet';
  18. linkElement.href = 'https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap';
  19. document.head.appendChild(linkElement);
  20.  
  21. GM_addStyle(`
  22. @import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');
  23.  
  24. div.text-marginalia-item {
  25. font-size: 15px;
  26. font-family: 'Source Serif 4', serif;
  27. font-weight: 350;
  28. line-height: 22px;
  29. color: #cccccc;
  30. }
  31.  
  32. span.highlighted-note-text, span.highlighted-text {
  33. background-color: hsl(50deg 100% 50% / 15%) !important;
  34. border-bottom-color: hsl(50deg 100% 50% / 80%) !important;
  35. background-repeat: no-repeat !important;
  36. background-size: 100% 90% !important;
  37. background-position: 0 75% !important;
  38. color: rgb(255, 255, 255) !important;
  39. }
  40.  
  41. #main-page-content {
  42. background-color: #151c23;
  43. font-size: 15px;
  44. }
  45.  
  46. #book-markup-container {
  47. max-width: 760px;
  48. margin-left: auto;
  49. margin-right: auto;
  50. }
  51.  
  52. div div p, li {
  53. font-family: 'Source Serif 4';
  54. color: rgb(193, 199, 206);
  55. line-height: 22px;
  56. font-weight: 350;
  57. font-size: 15px;
  58. font-feature-settings: "kern", "liga", "clig", "calt", "onum";
  59. font-variation-settings: "opsz" 16;
  60. font-kerning: auto;
  61. text-rendering: optimizelegibility;
  62. font-optical-sizing: auto;
  63. }
  64. li {
  65. line-height: 28px;
  66. }
  67.  
  68. div p i {
  69. font-family: 'Source Serif 4' !important;
  70. font-weight: 550 !important;
  71. font-style: italic !important;
  72. }
  73. `);
  74. })();