CSS: meteoblue.com

Corrections to UI of meteoblue.com

目前為 2022-07-06 提交的版本,檢視 最新版本

  1. // ==UserScript==
  2. // @name CSS: meteoblue.com
  3. // @description Corrections to UI of meteoblue.com
  4. // @author MK
  5. // @namespace max44
  6. // @homepage https://greasyfork.org/en/users/309172-max44
  7. // @match *://www.meteoblue.com/*
  8. // @icon https://www.meteoblue.com/favicon.ico
  9. // @version 1.3.5
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14. //CSS for any mode
  15. var cssUniversal = `
  16. /*Position of cloud icons*/
  17. .picto .weekday.alt {
  18. line-height: unset !important;
  19. }
  20.  
  21. /*Font size of temperature*/
  22. .tab-content .tab-temp-max, .tab-content .tab-temp-min {
  23. line-height: 24.5px;
  24. font-size: 17.5px;
  25. }
  26.  
  27. /*Font size in hourly forecast table*/
  28. /*.hourly-forecast .hourlywind > tbody {
  29. font-size: 70% !important;
  30. }*/
  31.  
  32. /*Dividers between cloud icons on 3 hours table*/
  33. /*.hourly-forecasr .hourlywind > tbody > tr:nth-of-type(1),*/
  34. .hourly-forecast .hourlywind tr.pictos_3h td {
  35. padding: 0 !important;
  36. border-right-color: gray !important;
  37. border-right-style: solid !important;
  38. border-right-width: thin !important;
  39. }
  40.  
  41. /*Headers*/
  42. h2, h3 {
  43. font-size: 150% !important;
  44. }
  45.  
  46. /*Adblock warning*/
  47. /*div[filter] {
  48. filter: none !important;
  49. }*/
  50. .page-header, .wrapper-main, .wrapper-sda, .navigation-scroll-container, .footer, .footer-quick {
  51. filter: none !important;
  52. }
  53. .unblock-div {
  54. display: none !important;
  55. }
  56. body.unblock {
  57. overflow: visible !important;
  58. margin-right: 0px !important;
  59. }
  60. `;
  61.  
  62. //CSS for light mode only
  63. var cssLight = `
  64. /*Active tab colour*/
  65. .tab.active {
  66. background: #fffeefff !important;
  67. /*background: #ffffff !important;*/
  68. }
  69. /*Tab colour*/
  70. .tab {
  71. background: #e7ecf0 !important;
  72. /*background: #eaeaea !important;*/
  73. }
  74. /*Predictability meter background*/
  75. .tab_content .tab_predictability .meter_outer {
  76. background-color: hsl(0, 0%, 96.9%) !important;
  77. }
  78.  
  79. /*Font color of precipitation probability in hourly forecast table*/
  80. tr.precip-prop > td > span {
  81. color: rgb(0, 64, 128) !important;
  82. }
  83. `;
  84.  
  85. //Change body class to remove adblock warning
  86. const body = document.querySelector("body.unblock");
  87. if (body != null) {
  88. body.setAttribute("class", " ");
  89. }
  90.  
  91. const bodyMode = document.querySelector("body.dark");
  92. var css;
  93. if (bodyMode != null) {
  94. css = cssUniversal;
  95. } else {
  96. css = cssUniversal + cssLight;
  97. }
  98.  
  99. if (typeof GM_addStyle != 'undefined') {
  100. GM_addStyle(css);
  101. } else if (typeof PRO_addStyle != 'undefined') {
  102. PRO_addStyle(css);
  103. } else if (typeof addStyle != 'undefined') {
  104. addStyle(css);
  105. } else {
  106. var node = document.createElement('style');
  107. node.type = 'text/css';
  108. node.appendChild(document.createTextNode(css));
  109. document.documentElement.appendChild(node);
  110. }
  111. })();