Dark Mode for Elitepvpers

[forfeitsol]

Hello, my eyes was hurting from ePvp's light theme. Normally I'm using an extension called Dark Reader but it messing up ePvp so I decided to make my own. I just learn javascript so pretty sure you can loop every item by their color, but it's still a thing tho. I know, the style is the worst, everything is black, I can improve the design if you guys want.

Download any kind of userscript manager from your favorite browser extension market.

    var div = document.querySelectorAll("div");
    for (i = 0; i < div.length; i++) {
        div[i].style.backgroundColor = "black";
        div[i].style.color = "#fff";
    }

    var table = document.querySelectorAll("table");
    for (i = 0; i < table.length; i++) {
        table[i].style.backgroundColor = "black";
        table[i].style.color = "#fff";
    }

    var a = document.querySelectorAll("a");
    for (i = 0; i < a.length; i++) {
        if (a[i].getAttribute('style') != 'color:BlueViolet;')
            a[i].setAttribute('style', 'color:White;');
    }

    var td = document.querySelectorAll("td");
    for (i = 0; i < td.length; i++) {
        td[i].setAttribute('style', 'background: black');
        td[i].style.color = "#fff";
    }

    alt2 = document.getElementsByClassName("alt2");
    for (i = 0; i < alt2.length; i++) {
        alt2[i].setAttribute('style', 'background: black;');
        alt2[i].style.color = "#fff";
    }

    strong = document.querySelectorAll("strong");
    for (i = 0; i < strong.length; i++) {
        strong[i].setAttribute('onmousehover', 'this.style.opacity = "70%";');
    }

    panel = document.getElementsByClassName("panel");
    for (i = 0; i < panel.length; i++) {
        panel[i].setAttribute('style', 'background: black !important');
    }

    li2 = document.querySelectorAll("li");
    for (i = 0; i < li2.length; i++) {
        li2[i].setAttribute('style', 'background: black !important; border: 1px solid #252525 !important;');
    }

    img = document.querySelectorAll("img");
    for (i = 0; i < img.length; i++) {
        if (img[i].classList.contains('fancybox-expandable') || img[i].classList.contains('fancybox-disabled'))
			if ((img[i].getAttribute('src')).substr(-1) != "?")
				img[i].setAttribute('style', 'filter: invert(1)');
    }
    
    pln = document.getElementsByClassName("pln");
    for (i = 0; i < pln.length; i++) {
        pln[i].setAttribute('style', 'color: wheat !important');
    }

const credit = document.createElement("li");
credit.innerHTML = "Dark Mode v1.02, by <a href='https://www.elitepvpers.com/forum/members/8325310-forfeitsol.html'>forfeitsol</a> ";

document.getElementById("userbaritems").appendChild(credit);

Preview:


Update Notes:

 Spoiler

v1.01:Color for bumped threads seperated from normal ones.
________
v1.02:Added support for images. If the image url has "?" end of it, the image colors won't inverted. For example;

Inverted for dark mode:

[IMG=expandable: 1]http://i.epvpimg.com/fRhvfab.png[/IMG]

Compatible for dark mode:

[IMG=expandable: 1]http://i.epvpimg.com/fRhvfab.png?[/IMG]

Tampermonkey version:

Originally Posted by Zagith

// ==UserScript==
//  [MENTION=286917]name[/MENTION]         New Userscript
//  [MENTION=1005418]namespace[/MENTION]    [url]http://tampermonkey.net/[/url]
//  [MENTION=1805674]Version[/MENTION]      0.1
//  [MENTION=3833773]Description[/MENTION]  try to take over the world!
//  [MENTION=1332190]author[/MENTION]       You
//  [MENTION=340885]match[/MENTION]        [url]https://www.elitepvpers.com/*[/url]
//  [MENTION=283894]icon[/MENTION]         [url]https://www.google.com/s2/favicons?sz=64&domain=elitepvpers.com[/url]
//  [MENTION=551144]grant[/MENTION]        none
// ==/UserScript==

(function() {
    'use strict';
    var div = document.querySelectorAll("div");
    for (var i = 0; i < div.length; i++) {
        div[i].style.backgroundColor = "black";
        div[i].style.color = "#fff";
    }

    var table = document.querySelectorAll("table");
    for (i = 0; i < table.length; i++) {
        table[i].style.backgroundColor = "black";
        table[i].style.color = "#fff";
    }

    var a = document.querySelectorAll("a");
    for (i = 0; i < a.length; i++) {
        if (a[i].getAttribute('style') != 'color:BlueViolet;')
        {a[i].setAttribute('style', 'color:White;');}
        }

        var td = document.querySelectorAll("td");
        for (i = 0; i < td.length; i++) {
            td[i].setAttribute('style', 'background: black');
            td[i].style.color = "#fff";
        }

        var alt2 = document.getElementsByClassName("alt2");
        for (i = 0; i < alt2.length; i++) {
            alt2[i].setAttribute('style', 'background: black;');
            alt2[i].style.color = "#fff";
        }

        var strong = document.querySelectorAll("strong");
        for (i = 0; i < strong.length; i++) {
            strong[i].setAttribute('onmousehover', 'this.style.opacity = "70%";');
        }

        var panel = document.getElementsByClassName("panel");
        for (i = 0; i < panel.length; i++) {
            panel[i].setAttribute('style', 'background: black !important');
        }

        var li2 = document.querySelectorAll("li");
        for (i = 0; i < li2.length; i++) {
            li2[i].setAttribute('style', 'background: black !important; border: 1px solid #252525 !important;');
        }

        var img = document.querySelectorAll("img");
        for (i = 0; i < img.length; i++) {
            if (img[i].classList.contains('fancybox-expandable') || img[i].classList.contains('fancybox-disabled'))
            {
                if ((img[i].getAttribute('src')).substr(-1) != "?")
                {
                    img[i].setAttribute('style', 'filter: invert(1)');
                }
            }
        }

        var pln = document.getElementsByClassName("pln");
        for (i = 0; i < pln.length; i++) {
            pln[i].setAttribute('style', 'color: wheat !important');
        }

       const credit = document.createElement("li");
        credit.innerHTML = "Dark Mode v1.02, by <a href='https://www.elitepvpers.com/forum/members/8325310-forfeitsol.html'>forfeitsol</a> ";

        document.getElementById("userbaritems").appendChild(credit);
    })();

Thanks to @ for putting effort onto it!

[TrilogyMods]

Thanks it works well, much better on my eyes.

[forfeitsol]

Originally Posted by MrHoliday

Thanks it works well, much better on my eyes.

You're welcome.

[ilikebacon]

Would be sick if Luke could make epvp a dark mode theme

[forfeitsol]

Originally Posted by ilikebacon

Would be sick if Luke could make epvp a dark mode theme

Would be much better if the website was IPboard instead of vbulletin..

[gotstyle]

Originally Posted by ilikebacon

Would be sick if Luke could make epvp a dark mode theme

Originally Posted by forfeitsol

Would be much better if the website was IPboard instead of vbulletin..

In the near future there will be something better than just a dark mode .

[zerogott]

Originally Posted by gotstyle

In the near future there will be something better than just a dark mode .

I hope its not a april fools joke or a blizz soon™

[Cooperjo77]

And i was confused why the site looked so shity... downloaded the reader a few days ago thanks for solving my issues

[Zubatque]

I always use only dark themes where it is possible, it would be great if it was sewn into the functions of the site

[JakeSeller]

I like the design very much, well done

[Gepix]

i like the looks very cool well done

[OldMunke]

My eyes thank you! I was getting such bad headaches...

[wilvin0]

lifesaver

[Exit]

Originally Posted by OldMunke

My eyes thank you! I was getting such bad headaches...

Originally Posted by wilvin0

lifesaver

Should check this one out

[Basizx]

Lifesaver, thank you so much for this!!