Blue Balls のソースコード

Blue Balls

Turns almost everything on Torn blue.
右端で折り返す
// ==UserScript==
// @name         Blue Balls
// @namespace    https://torn.com/
// @version      1.0
// @description  Turns almost everything on Torn blue.
// @match        https://www.torn.com/*
// @license      MIT
// @grant        none
// ==/UserScript==


(function() {
    'use strict';

    const style = document.createElement('style');
    style.id = 'torn-blue-everything';

    style.textContent = `
        /* Main backgrounds */
        html,
        body,
        #mainContainer,
        #content-wrapper,
        .content-wrapper,
        .wrapper,
        .content,
        .container,
        div,
        section,
        article,
        aside,
        nav,
        header,
        footer {
            background-color: #0b1d3a !important;
            border-color: #3b82f6 !important;
        }

        /* Alternate shades for nested elements */
        div div {
            background-color: #102850 !important;
        }

        div div div {
            background-color: #16376d !important;
        }

        div div div div {
            background-color: #1b4b91 !important;
        }

        /* Text */
        *,
        p,
        span,
        label,
        td,
        th,
        li,
        h1,
        h2,
        h3,
        h4,
        h5,
        h6 {
            color: #d8ecff !important;
            text-shadow: none !important;
        }

        /* Links */
        a {
            color: #7cc8ff !important;
        }

        a:hover {
            color: #b3e3ff !important;
        }

        /* Inputs */
        input,
        textarea,
        select {
            background: #12345d !important;
            color: #ffffff !important;
            border: 1px solid #5aa9ff !important;
        }

        /* Buttons */
        button,
        .btn,
        input[type="button"],
        input[type="submit"] {
            background: linear-gradient(
                180deg,
                #4b8cff,
                #1d5fd6
            ) !important;

            color: white !important;
            border: 1px solid #8ec5ff !important;
        }

        button:hover,
        .btn:hover {
            background: #5ea0ff !important;
        }

        /* Tables */
        table {
            background: #102850 !important;
        }

        tr:nth-child(even) {
            background: #16376d !important;
        }

        tr:nth-child(odd) {
            background: #12345d !important;
        }

        /* Images slightly blue */
        img {
            filter:
                hue-rotate(180deg)
                saturate(1.2)
                brightness(0.95);
        }

        /* SVG icons */
        svg,
        svg * {
            fill: #8cc7ff !important;
            stroke: #8cc7ff !important;
        }

        /* Scrollbars */
        ::-webkit-scrollbar {
            width: 12px;
            height: 12px;
        }

        ::-webkit-scrollbar-track {
            background: #0b1d3a;
        }

        ::-webkit-scrollbar-thumb {
            background: #4b8cff;
        }

        /* Selection */
        ::selection {
            background: #4b8cff;
            color: white;
        }
    `;

    document.head.appendChild(style);

    // Force blue tint on dynamically added elements
    const observer = new MutationObserver(() => {
        document.querySelectorAll('*').forEach(el => {
            if (!el.dataset.blueified) {
                el.dataset.blueified = '1';

                const bg = getComputedStyle(el).backgroundColor;
                if (bg !== 'rgba(0, 0, 0, 0)' && bg !== 'transparent') {
                    el.style.backgroundColor =
                        'rgb(16, 40, 80)';
                }
            }
        });
    });

    observer.observe(document.documentElement, {
        childList: true,
        subtree: true
    });

})();