// ==UserScript== // @name vjudge dark theme // @namespace https://github.com/notwatermango/vjudge-dark-theme // @version 0.1.2 // @description with some github dark color scheme // @author notwatermango // @match https://vjudge.net/* // @icon https://www.google.com/s2/favicons?sz=64&domain=vjudge.net // @grant GM_addStyle // @downloadURL none // ==/UserScript== (function () { 'use strict'; var colors = { background: '#0d1117', superblack: '#0A0908', navbar_background: '#161b22', }; function overrideStyleAttribute(elm, prop, value) { elm.setAttribute("style", elm.getAttribute("style") + `; ${prop}: ${value} !important; `); } function applyFuncWhenElmLoaded(sel, func, delay = 100) { var elm = document.querySelectorAll(sel); if (!elm || elm.length == 0) return setTimeout(applyFuncWhenElmLoaded, delay, sel, func); for (let i = 0, len = elm.length; i < len; i++) func(elm[i]); } var body_elm = document.querySelectorAll('body')[0]; overrideStyleAttribute(body_elm, "color", "white"); overrideStyleAttribute(body_elm, "background", "none"); overrideStyleAttribute(body_elm, "background-color", colors.background); applyFuncWhenElmLoaded( 'body', function (elm) { overrideStyleAttribute(elm, "color", "white"); overrideStyleAttribute(elm, "background", "none"); overrideStyleAttribute(elm, "background-color", colors.background) } ); applyFuncWhenElmLoaded( '.bg-inverse', function (elm) { overrideStyleAttribute(elm, "color", "white"); overrideStyleAttribute(elm, "background", "none"); overrideStyleAttribute(elm, "background-color", colors.navbar_background) } ); function rank_functions() { applyFuncWhenElmLoaded( '#contest-rank-table tr.this td.meta', function (elm) { overrideStyleAttribute(elm, "background-color", "#003540"); overrideStyleAttribute(elm, "color", "#fff"); } ); applyFuncWhenElmLoaded( '.modal-content, .modal-body', function (elm) { overrideStyleAttribute(elm, "background-color", "#003540"); overrideStyleAttribute(elm, "color", "#fff"); }, 1500 ); applyFuncWhenElmLoaded( '#solutionModal #info-panel td', function (elm) { overrideStyleAttribute(elm, "background-color", "#121212"); overrideStyleAttribute(elm, "color", "#fff"); }, 1500 ) applyFuncWhenElmLoaded( '#contest-rank-table tr.this.myself td.meta', function (elm) { overrideStyleAttribute(elm, "background-color", "#0a697d"); overrideStyleAttribute(elm, "color", "#fff"); }, 1500 ); applyFuncWhenElmLoaded( '#contest-rank-table td.failed', function (elm) { overrideStyleAttribute(elm, "background-color", "#321010"); overrideStyleAttribute(elm, "color", "#fff"); } ); applyFuncWhenElmLoaded( '#contest-rank-table td.accepted', function (elm) { overrideStyleAttribute(elm, "background-color", "#366039"); overrideStyleAttribute(elm, "color", "#fff"); } ); applyFuncWhenElmLoaded( '#contest-rank-table td.prob.fb', function (elm) { overrideStyleAttribute(elm, "background-color", "#037603"); overrideStyleAttribute(elm, "color", "#fff"); } ); applyFuncWhenElmLoaded( // needs delay '#contest-rank-table th', function (elm) { overrideStyleAttribute(elm, "background-color", "#091122"); overrideStyleAttribute(elm, "color", "#fff"); }, 1500 ); applyFuncWhenElmLoaded( // needs delay '#contest-rank-table a ', function (elm) { overrideStyleAttribute(elm, "color", "#fff"); }, 1500 ); applyFuncWhenElmLoaded( ' table.table thead', function (elm) { overrideStyleAttribute(elm, "background-color", "#06162e"); } ); applyFuncWhenElmLoaded( ' #description-container dd', function (elm) { overrideStyleAttribute(elm, "background-color", "#101935"); overrideStyleAttribute(elm, "color", "#F2FDFF"); overrideStyleAttribute(elm, "box-shadow", "none"); } ); applyFuncWhenElmLoaded( 'table.vjudge_sample tbody tr td', function (elm) { overrideStyleAttribute(elm, "background-color", colors.superblack); overrideStyleAttribute(elm, "color", "white"); } ); applyFuncWhenElmLoaded( 'table.vjudge_sample thead tr th, li.list-group-item', function (elm) { overrideStyleAttribute(elm, "background-color", colors.superblack); overrideStyleAttribute(elm, "color", "white"); }, 1000 ); //#description-container>dd } function list_update() { applyFuncWhenElmLoaded( 'li.list-group-item', function (elm) { overrideStyleAttribute(elm, "background-color", colors.superblack); overrideStyleAttribute(elm, "color", "white"); }, 1000 ); } applyFuncWhenElmLoaded( '.card-block, .list-group-item, .card, .btn', function (elm) { overrideStyleAttribute(elm, "color", "white"); overrideStyleAttribute(elm, "background", "none"); overrideStyleAttribute(elm, "background-color", "#121212") } ); // 86c2f7 rank_functions(); let currentPage = location.href; const mutationObserver = new MutationObserver(function (mutations_list) { mutations_list.forEach(function (mutation) { mutation.addedNodes.forEach(function (added_node) { console.log("observing...:"); rank_functions(); list_update(); }); }); }); function handleHashChange() { let urlParam = window.location.hash; if (urlParam == '#rank') { setTimeout(rank_functions); mutationObserver.observe(document.querySelector('#contest-rank-table'), { subtree: false, childList: true }); } else if (urlParam[1] == 'p') { var li_elm = document.querySelector('#prob-descs'); mutationObserver.observe(li_elm, { subtree: false, childList: true }); } }; handleHashChange(); window.addEventListener('hashchange', handleHashChange); function onClassChange(elm, callback) { const observer = new MutationObserver((mutations) => { mutations.forEach((mutation) => { if ( mutation.type === 'attributes' && mutation.attributeName === 'class' ) { callback(mutation.target); } }); }); observer.observe(elm, { attributes: true }); return observer.disconnect; } onClassChange(body_elm, (node) => { node.classList.contains('active') ? '' : rank_functions(); }); mutationObserver.observe(body_elm, { subtree: false, childList: true }); function parentHasClass(elm, classname, depth = 0) { if (depth == 2) return false; if (elm.className.split(' ').indexOf(classname) >= 0) return true; return elm.parentNode && parentHasClass(elm.parentNode, classname, depth + 1); } function fixLinkColor() { if (document.readyState != "complete") { return setTimeout(fixLinkColor, 100); } var elms = document.querySelectorAll("a"); list_update(); for (let i = 0, len = elms.length; i < len; i++) { if (!elms[i].classList.contains('btn') && !parentHasClass(elms[i], 'name')) { overrideStyleAttribute(elms[i], "color", "#86c2f7"); } } }; fixLinkColor(); })();