☰

FC - Dark Mode

Aplica el modo noche a Forocoches

  1. // ==UserScript==
  2. // @name         FC - Dark Mode
  3. // @run-at        document-start
  4. // @namespace    https://greasyfork.org/es/scripts/446037-fc-dark-mode
  5. // @version      6
  6. // @description  Aplica el modo noche a Forocoches
  7. // @author       DonNadie
  8. // @match        http://*.forocoches.com/*
  9. // @match        https://*.forocoches.com/*
  10. // @match        http://www.forocoches.com/*
  11. // @match        https://www.forocoches.com/*
  12. // @grant        none
  13. // @license MIT
  14. // ==/UserScript==
  15. /* jshint -W097 */
  16. 'use strict';
  17.  
  18. let style = document.createElement('style');
  19.         style.innerHTML = `
  20.         body, .tborder-author, .page, .tborder-author, .panel, #tablist li a, .alt1, .alt1Active, .contenido, .alt1-user, #profile_box div, .tborder.content_block {
  21.             background: #323639 !important;
  22.             color: white !important;
  23.         }
  24.  
  25.         td {
  26.             background-color: #323639 !important;
  27.         }
  28.  
  29.         .controlbar, .controlbar td {
  30.             background-color: #e1e1e2 !important;
  31.         }
  32.  
  33.         .tcat, thead, .thead a:link, .thead_alink, .alt2, .alt2Active, .tborder, .thead, .alt1-author, legend, .texto {
  34.             color: white !important;
  35.         }
  36.  
  37.         a:link, body_alink, .texto a, a {
  38.             color: #00a6cc !important;
  39.         }
  40.  
  41.         .tborder-author {
  42.             border-left: 3px solid #00a6cc !important;
  43.             border-right: 3px solid #00a6cc !important;
  44.         }
  45.  
  46.         .alt1-author, .thead, .alt2, .alt2Active {
  47.             background: #4a4a4a !important;
  48.         }
  49.  
  50.         .tborder, textarea, input, select {
  51.             background: #4a4a4a !important;
  52.             color: white !important;
  53.         }
  54.         textarea, input {
  55.             border: 1px;
  56.         }
  57.  
  58.         .cajasprin, .cajascat, .cajastip {
  59.             BORDER-RIGHT: #4a4a4a 1px solid !important;
  60.             BORDER-TOP: #4a4a4a 1px solid !important;
  61.             BORDER-LEFT: #4a4a4a 1px solid !important;
  62.             BORDER-BOTTOM: #4a4a4a 1px solid !important;
  63.             background: #4a4a4a !important;
  64.         }
  65.         td {
  66.             border-right-color: #4a4a4a !important;
  67.             border-left-color: #4a4a4a !important;
  68.             border-top-color: #4a4a4a !important;
  69.             border-bottom-color: #4a4a4a !important;
  70.         }
  71.  
  72.         .panel, .vBulletin_editor {
  73.             border: 2px !important;
  74.         }
  75.  
  76.         .fieldset {
  77.             border-style: solid;
  78.             border-color: #4a4a4a;
  79.         }
  80.         `;
  81.  
  82. const addStyles = () => {
  83.     document.head.prepend(style);
  84. }
  85.  
  86. const replaceImages = () => {
  87.     document.body.querySelectorAll('[background="/image/tbase_hd.png"]').forEach(el => {
  88.         el.removeAttribute("background");
  89.     });
  90.  
  91.     document.body.querySelector('[src="/image/top_c1_hd.png"]').src = "https://i.imgur.com/hJGDXqM.png";
  92.     document.body.querySelector('[src="/image/top_c2_fcs_hd5.png"]').src = "https://i.imgur.com/HoBcv8z.png";
  93. };
  94.  
  95. const observer = new MutationObserver((mutations) => {
  96.     mutations.forEach((mutation) => {
  97.         if (mutation.addedNodes.length > 0) {
  98.             const $node = mutation.addedNodes[0];
  99.  
  100.             switch ($node.tagName) {
  101.                 case "HTML":
  102.                     observer.observe(mutation.addedNodes[0], {
  103.                         attributes: true,
  104.                         childList: true
  105.                     });
  106.                     break;
  107.                 case "HEAD":
  108.                     addStyles();
  109.                     break;
  110.                 case "BODY":
  111.                     setTimeout(() => {
  112.                         replaceImages();
  113.                     }, 200);
  114.                     break;
  115.             }
  116.         }
  117.     });
  118. });
  119.  
  120. [1, 50, 100, 200, 300, 400, 500].forEach(ms => {
  121.     setTimeout(() => {
  122.         addStyles();
  123.         replaceImages();
  124.     }, ms);
  125. });
  126.  
  127. observer.observe(document, {
  128.     attributes: true,
  129.     childList: true
  130. });