Steemit.com Mod: Night Mode v0.0.3 (Revised)

klye(75)

Published in

#steemit

Words

107

Reading

1 min

Listen

Play

Tired of having your eyes burnt out with the stock white theme on Steemit?

What if I told you another option exists..?

Introducing Steemit.com Night mode:

alt

A screencap of the trending page with night mode on

alt

Sexy, isn't it?

No more white screen induced eye strain!

Installation

Chrome or Firefox (possibly other browsers) users should install Tampermonkey and create a new script, then copy the code below. For further installation help check out this post from earlier this week with in-depth instruction..!

// ==UserScript==
// @name          Steemit.com Night Mode
// @namespace     http://userstyles.org
// @description   Easier CSS on the eyes for Steemit.
// @author        KLYE
// @include       http://steemit.com/*
// @include       https://steemit.com/*
// @include       http://*.steemit.com/*
// @include       https://*.steemit.com/*
// @run-at        document-start
// @version       0.0.3
// ==/UserScript==

(function() {var css = [
    ".VerticalMenu>li>a:hover {",
    "background-color: #040404;",
    "}",
    ".UserProfile__top-nav .menu>li>a:hover {",
    "background-color: transparent;",
    "border-radius: 15px;",
    "}",
    ".UserProfile__top-nav .menu>li>a.active {",
    "background-color: #000;",
    "z-index: 2;",
    "color: #4ba2f2;",
    "font-weight: 700;",
    "}",
    "table tbody td, table tbody th {",
    "background: #000 !important;",
    "}",
    ".UserWallet__balance.UserWallet__balance.zebra {",
    "background: #000 !important;",
    "}",
        ".App__content, div.Header__top.header, .UserProfile__top, .drag-and-drop, .App, .index-page, .PostSummary__content, .PostSummary, .Header, .menu, div.Header__sub-nav.expanded.show-for-medium.row, .Reputation, .PostsList__post_container {",
           "background-color: none !important;",
    "background: #000 !important;",
        "}",
        " .Header__sub-nav li>a {",
"border: none !important;",
    "}",
            " #body {",
"color: #000 !important;",
    "min-height: 100%",
    "}",
    ".PostsList__post_container .PostFull, .ReplyEditor__options select  {",
    "background-color: #000 !important;",
    "color: #ccc !important;",
"}",
    "[type=text], textarea[rows], code, .ReplyEditor__title, .dropzone, .upload-enabled, .category, .Markdown blockquote>p {",
    "background-color: #111 !important;",
    "color: #ccc !important;",
    "}",
    ".SubmitPost {",
    "min-height: 1000px !important;",
    "}",
    ".UserProfile__top-nav {",
    "background-color: #000;",
    "padding: 0;",
    "}",
    ".UserProfile__banner>div.column, .UserProfile__banner>div.columns {",
   " background: #23579d;",
    "background: linear-gradient(180deg,#1a4072 0,#000);",
   " min-height: 155px;",
"}",
    ".callout {",
    "background-color: #000;",
    "color: #ccc;",
    "}",
    "div.Header__top.header {",
    "border-bottom: #000 !important;",
    "}"
].join("\n");

if (typeof GM_addStyle != "undefined") {
    GM_addStyle(css);
} else if (typeof PRO_addStyle != "undefined") {
    PRO_addStyle(css);
} else if (typeof addStyle != "undefined") {
    addStyle(css);
} else {
    var node = document.createElement("style");
    node.type = "text/css";
    node.appendChild(document.createTextNode(css));
    var heads = document.getElementsByTagName("head");
    if (heads.length > 0) {
        heads[0].appendChild(node);
    } else {
        // no head yet, stick it whereever
        document.documentElement.appendChild(node);
    }
}
})();