☰

NTComps Klavia Monkey Theme

Klavia Monkey Theme for https://www.ntcomps.com

目前为 2025-04-14 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         NTComps Klavia Monkey Theme
  3. // @version      2024-03-27.4
  4. // @namespace    https://greasyfork.org/users/1331131-tensorflow-dvorak
  5. // @description  Klavia Monkey Theme for https://www.ntcomps.com
  6. // @author       TensorFlow - Dvorak
  7. // @match        *://*.ntcomps.com/*
  8. // @match        *://*.klavia.io/*
  9. // @match        *://*.playklavia.com/*
  10. // @license      MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14.     'use strict';
  15.  
  16.     function applyCustomStyles() {
  17.         let style = document.getElementById('custom-typing-styles');
  18.         if (!style) {
  19.             style = document.createElement('style');
  20.             style.id = 'custom-typing-styles';
  21.             document.head.appendChild(style);
  22.         }
  23.         style.innerHTML = `
  24.             body {
  25.               background-color: #000000 !important;
  26.             }
  27.             #typing-text-container {
  28.                 font-size: 90px !important;
  29.                 height: fit-content !important;
  30.                 background-color: #060516 !important;
  31.                 width: 100% !important;
  32.                 max-width: 100% !important;
  33.                 font-family: monospace;
  34.             }
  35.             #typing-text {
  36.                 font-size: 90px !important;
  37.                 width: 93% !important;
  38.                 max-width: 100% !important;
  39.             }
  40.             #dashboard {
  41.                 height: 20rem !important;
  42.                 max-height: 1000px !important;
  43.                 background-color: #060516 !important;
  44.                 width: 100% !important;
  45.                 max-width: 100% !important;
  46.             }
  47.             #game-container {
  48.                 height: fit-content !important;
  49.                 width: 80% !important;
  50.                 max-width: 80% !important;
  51.             }
  52.             #dashboard[data-bs-theme=dark] #typing-text {
  53.                 color: #acaaff !important;
  54.             }
  55.             #canvas-container, #track {
  56.                 width: 100% !important;
  57.                 max-width: 100% !important;
  58.             }
  59.             #content {
  60.                 width: 100% !important;
  61.                 max-width: 100% !important;
  62.             }
  63.         `;
  64.     }
  65.  
  66.     const observer = new MutationObserver(() => {
  67.         if (document.getElementById('typing-text-container')) {
  68.             applyCustomStyles();
  69.         }
  70.         const canvasContainer = document.getElementById('canvas-container');
  71.         const track = document.getElementById('track');
  72.         if (canvasContainer && track) {
  73.             canvasContainer.style.width = '100%';
  74.             track.style.width = '100%';
  75.         }
  76.     });
  77.  
  78.     observer.observe(document.body, { childList: true, subtree: true });
  79.     applyCustomStyles();
  80. })();
  81.  
  82.