Dark Theme for Demon's Souls Wikidot

a Dark Theme for Demon's Souls Wikidot
换行
/* ==UserStyle==
@name         Dark Theme for Demon's Souls Wikidot
@version      0.0.4
@description  a Dark Theme for Demon's Souls Wikidot
@include      http://demonssouls.wikidot.com/*
@author       wowyesokay / dogboydog https://github.com/dogboydog/
@namespace    dogboydog-demon
==/UserStyle== */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

/*
        Demon's souls Wikidot 

	 Original by:	Bunny (Gwyndolin-chan)
		https://github.com/gwyndolin-chan
		[email protected]

    Modified by dogboydog https://github.com/dogboydog/
	*/
@document url-prefix("http://demonssouls.wikidot.com") {
    :root {
        --link-color: #6094AA;
        --link-hover-color: #D9E0E0;
        --bg-color: #202321;
        --bg-color-lighter: #4d4f4d;
        --table-tab-bg: #304a55;
        --table-cell-bg: #202020;
        --main-text-color: #ffffff;
    }
    
    blockquote {
        background-color: var(--table-cell-bg);
    }

    td {
        color: var(--main-text-color) !important;
    }
    a {
        color: var(--link-color);
    }
    a:hover {
        color: var(--link-hover-color);
    }

    /**
    *  TODO: Doesn't work for ESRB banner... 
    *  But some images look better with white background
    */
    img[src*="wiki-forum"],
    img[src*="esrb"],
    .esrc-banner {
        background-color: white !important;
        border-radius: 10px 10px 10px 10px;
    }

    #header {
        height: 10em;
    }
    #top-bar {
        width: 75%;
    }

    #top-bar ul {
        padding: 5px;
    }
    #top-bar ul li {
        border-color: var(--link-color) !important;
        padding-top: 7px;
        /* Don't know why right padding needs to be bigger... */
        padding-right: 14px;
        padding-bottom: 7px;
        padding-left: 7px;
        background-image: none;
        background-color: var(--bg-color);
        color: var(--link-color);
    }

    #top-bar a {
        background-image: none;
        color: var(--link-color);
    }
    /**
    * Dropdowns from the top bar
    */
    #top-bar li ul li a {
        background-image: none;
        color: var(--link-color);
        background-color: var(--bg-color) !important;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    /**
    * Hovering over an item in dropdowns from the top bar
    */
    #top-bar ul li ul li.sfhover a {
        background-image: none;
        color: var(--link-hover-color);
        background-color: var(--bg-color);
        padding-top: 5px;
        padding-bottom: 5px;
    }

    #search-top-box-input {
        background-color: #252726;
        padding: 4px;
        color: var(--link-color)
    }

    #search-top-box input.empty {
        color: #BCCAA0;
    }

    input.button,
    #account-topbutton,
    #account-options {
        background-color: var(--bg-color);
        padding: 4px;
        color: var(--link-color);
    }

    #account-options li a:hover {
        color: var(--link-hover-color);
    }
    /**
    * This fixes a little bar of color to the right of 
    * items in the top dropdown that aren't being hovered over
    */
    #top-bar ul li ul li {
        background-color: var(--bg-color);
    }

    #top-bar a:hover {
        background-image: none;
        background-color: var(--bg-color-lighter);
        color: var(--link-hover-color);
        padding-left: 8px;
    }

    body,
    h1 a,
    h2,
    #container,
    #header,
    #side-bar,
    #header-extra-div-1,
    #header-extra-div-2,
    #header-extra-div-3 {
        font-family: 'Open Sans', sans-serif;
        background-color: #202321 !important;
    }
    iframe.html-block-iframe {
        background: none;
        background-color: #404040;
    }

    .tr {
        background: none !important;
    }

    body,
    #toc {
        color: #FFFFFF;
    }

    a,
    #login-status a,
    #toc-list a,
    #toc #toc-action-bar a {
        padding-top: 5px;
        padding-bottom: 5px;
        color: var(--link-color);
    }

    a:hover,
    .table a:hover,
    #login-status a:hover,
    #toc-list a:hover,
    #toc #toc-action-bar a:hover {
        color: var(--link-hover-color);
    }

    table.wiki-content-table {
        font-size: 0.9em;
        color: #a0a0a0;
        background-color: #202020;
    }

    table.wiki-content-table th,
    th.table {
        font-size: 1.0em;
        color: #101010;
        background-color: #606060;
    }

    input.text {
        background-color: #C0C0C0;
    }

    #toc #toc-action-bar::before,
    #toc #toc-action-bar a::before,
    #toc #toc-action-bar a::after {
        color: inherit;
    }

    #top-bar ul li,
    #top-bar ul li ul li {
        margin-left: 3px;
        border-color: #F0F0F0;
    }

    table.wiki-content-table th {
        background: var(--table-tab-bg);
        color: var(--link-hover-color);
    }

    .table th {
        background: var(--table-tab-bg);
        font-family: 'Open Sans', sans-serif;
    }

    table.wiki-content-table,
    table {
        border: none;
    }
}
欢迎访问Greasy Fork镜像
