MediaWiki:Common.css: Difference between revisions

/* Vector Skin Color Scheme - Complete Color Definitions */

/* Primary Background Colors */
body {
    background: linear-gradient(0deg, #1f1e1d 0%, #1f1e1d 80%, #242422 100%);
    background-color: #1f1e1d;
}

#content {
    background-color: #262626;
}

#mw-page-base {
    background-color: #131313;
    background-image: linear-gradient(to bottom, #262626 50%, black 100%);
}

.mw-body,
.parsoid-body {
    background-color: #262626;
    color: #b9b7b5;
}

/* Text Colors */
.vector-body h1,
.vector-body h2,
.vector-body h3,
.vector-body h4,
.vector-body h5,
.vector-body h6 {
    color: white;
    background: none;
}

.vector-body h1.firstHeading {
    color: green;
}

.vector-body p {
    color: #b9b7b5;
}

/* Links */
a {
    color: #648cc8;
    text-decoration: none;
}

a:visited {
    color: #648cc8;
}

a:hover {
    text-decoration: underline !important;
}

a:active {
    color: #ffa500;
}

a.new {
    color: #bf6060;
}

a.new:visited {
    color: #c72e2e;
}

a.stub {
    color: #772233;
}

/* Steam Links */
a[href^="steam://"],
.link-steam {
    color: #86BF39;
}

/* User Links */
a[class="mw-userlink"] {
    background-color: #3C3C3C !important;
    color: #ACACAC;
    margin: 0 2px 0 2px;
    padding: 0 3px 0 2px;
}

/* Borders and Accents */
.mw-body {
    border: 1px solid #525252;
}

.vector-body h1,
.vector-body h2 {
    border-bottom: 1px solid #65635f;
}

hr {
    background-color: #65635F;
    border: 0 none;
    color: #65635F;
    height: 1px;
    margin: 0.2em 0;
}

/* Search Box */
.vector-search-box-input {
    background: linear-gradient(to bottom, #242424 0%, #141414 60%);
    color: #f2f2f2;
    border: 1px solid #666666;
}

.vector-search-box-input:focus {
    border-color: #7391C8;
    box-shadow: #525252;
}

/* Navigation Menus */
.vector-menu-dropdown .vector-menu-content {
    background-color: #4B4B4B;
    border: 1px solid #52575d;
    box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
}

.vector-menu-dropdown .vector-menu-heading {
    color: #54595d;
}

.vector-menu-dropdown .vector-menu-heading:hover,
.vector-menu-dropdown .vector-menu-heading:focus {
    color: #b9b7b5;
}

.vector-menu-dropdown .mw-list-item a {
    color: #898785;
}

.vector-menu-dropdown .mw-list-item.selected a,
.vector-menu-dropdown .mw-list-item.selected a:visited {
    color: #b9b7b5;
}

/* Menu Tabs */
.vector-menu-tabs-legacy li {
    background: linear-gradient(0deg, #2d2b2a 0%, #2d2b2a 20%, #373534 60%);
    border-bottom: 1px #525252 solid;
}

.vector-menu-tabs-legacy li a {
    color: #898785;
}

.vector-menu-tabs-legacy .new a,
.vector-menu-tabs-legacy .new a:visited {
    color: #688ba8;
}

.vector-menu-tabs-legacy .selected {
    background: linear-gradient(0deg, #262626 0%, #262626 20%, rgba(38,38,38,0) 85%);
    border-bottom: none;
}

.vector-menu-tabs-legacy .selected a,
.vector-menu-tabs-legacy .selected a:visited {
    color: #b9b7b5;
}

/* Tables */
table {
    background-color: #262626;
    color: #B9B7B5;
}

.wikitable > tr > th,
.wikitable > tr > td,
.wikitable > * > tr > th,
.wikitable > * > tr > td {
    background-color: #262626;
    border: 1px #525252 solid;
    color: #B9B7B5;
}

.mw-datatable tr:hover td,
.mw-datatable th {
    background-color: #525252;
}

.mw-datatable td {
    background-color: #262626;
}

.mw-datatable,
.mw-datatable td,
.mw-datatable th {
    border: 1px solid #646464;
}

/* Code Blocks */
pre,
.mw-code {
    color: #d1d1d1 !important;
    background-color: #1f1f1f !important;
    border: 0px solid #1c1c1c !important;
    border-left: 0px solid #2f2f2f !important;
    border-radius: 4px;
}

code {
    background: rgba(0,0,0,0.16) !important;
    color: #b9b7b5 !important;
    border: none !important;
}

/* Code Syntax Highlighting */
.mw-highlight .kt {
    color: #ff1f71; /* Keywords */
}

.mw-highlight .nc,
.mw-highlight .nn,
.mw-highlight .nf,
.mw-highlight .nv {
    color: #0082ff; /* Functions and variables */
}

.mw-highlight .s2,
.mw-highlight .sx {
    color: #ff3535; /* Strings */
}

.mw-highlight .mi,
.mw-highlight .mf,
.mw-highlight .mh,
.mw-highlight .o {
    color: #b5b5b5; /* Numbers and operators */
}

.mw-highlight .hll {
    background-color: #41410e !important;
}

.mw-highlight .linenos {
    color: #b5b5b5 !important;
}

.mw-highlight a:hover .linenos {
    color: white !important;
}

.mw-highlight .c {
    color: #3D7B7B;
    font-style: italic;
}

.mw-highlight .k {
    color: #008000;
    font-weight: bold;
}

.mw-highlight .s {
    color: #BA2121;
}

.mw-highlight .na {
    color: #687822;
}

.mw-highlight .nb {
    color: #008000;
}

.mw-highlight .no {
    color: #880000;
}

.mw-highlight .nd {
    color: #AA22FF;
}

.mw-highlight .ni {
    color: #717171;
    font-weight: bold;
}

.mw-highlight .ne {
    color: #CB3F38;
    font-weight: bold;
}

.mw-highlight .nl {
    color: #767600;
}

.mw-highlight .nt {
    color: #008000;
    font-weight: bold;
}

.mw-highlight .nv {
    color: #19177C;
}

.mw-highlight .ow {
    color: #AA22FF;
    font-weight: bold;
}

.mw-highlight .w {
    color: #bbbbbb;
}

.mw-highlight .mb,
.mw-highlight .mf,
.mw-highlight .mh,
.mw-highlight .mi,
.mw-highlight .mo {
    color: #666666;
}

.mw-highlight .sa,
.mw-highlight .sb,
.mw-highlight .sc,
.mw-highlight .dl,
.mw-highlight .s2,
.mw-highlight .sh,
.mw-highlight .s1 {
    color: #BA2121;
}

.mw-highlight .sd {
    color: #BA2121;
    font-style: italic;
}

.mw-highlight .se {
    color: #AA5D1F;
    font-weight: bold;
}

.mw-highlight .si {
    color: #A45A77;
    font-weight: bold;
}

.mw-highlight .sr {
    color: #A45A77;
}

.mw-highlight .ss {
    color: #19177C;
}

.mw-highlight .bp {
    color: #008000;
}

.mw-highlight .fm {
    color: #0000FF;
}

.mw-highlight .vc,
.mw-highlight .vg,
.mw-highlight .vi,
.mw-highlight .vm {
    color: #19177C;
}

.mw-highlight .il {
    color: #666666;
}

/* Form Inputs */
input,
select,
textarea {
    background-color: #202020;
    color: #B9B7B5;
    border: 1px solid #666666;
}

.mw-ui-vform input:not([type=button]):not([type=submit]):not([type=file]) {
    color: #F2F2F2;
    background: #111111;
    border: 1px solid #65635F;
}

.mw-ui-vform label {
    color: #b9b7b5;
}

/* Login Form */
.mw-ui-container #userloginForm input {
    color: #F2F2F2;
    border-color: #65635F;
    background-color: #111111;
}

.mw-ui-container #userloginForm label {
    color: #D6D6D6;
}

.mw-ui-container #userloginForm input#wpUsername,
.mw-ui-container #userloginForm input#wpLoginAttempt,
.mw-ui-container #userloginForm input#wpCreateaccount {
    background: #744C10;
    color: #FFFFFF;
    border: 1px solid #EB9B24;
}

.mw-ui-container #userloginForm input#wpCreateaccount.mw-ui-button-disabled {
    background: #47433D;
    border-color: #8D8383;
    color: #AFA9A9;
}

.mw-ui-container #userloginForm .mw-ui-button.mw-ui-progressive,
.mw-ui-container #userloginForm .mw-ui-button.mw-ui-primary {
    background: #7D90B1;
    color: #fff;
    border: 1px solid #B5C8E9;
}

/* Buttons */
input.mw-htmlform-submit.disabled {
    color: #B97373;
    border: 1px dotted #B97373;
}

input[id='wpCreateaccount'][disabled=''] {
    color: #B97373;
    border: 1px dotted #B97373;
}

/* Personal Menu */
#p-personal li a {
    color: #dcdedf !important;
}

#p-personal li a:hover {
    color: white !important;
}

#p-personal li a.new,
#p-personal a.new:visited {
    color: #E3BBBB;
}

/* Footer */
.mw-footer li {
    color: #707070 !important;
}

#footer #footer-places li a,
#footer #footer-places li a:visited,
#footer #footer-places li a:active {
    color: #688ba8 !important;
}

/* Category Links */
.catlinks {
    border: 1px solid #525252 !important;
    border-radius: 4px;
    background-color: #303030 !important;
    padding: 5px 5px 5px 8px !important;
}

.catlinks li {
    border-left: 1px solid #505050 !important;
}

/* TOC */
#toc,
.toc,
.mw-warning {
    border: 1px solid #525252;
    background-color: #3A3A3A;
    padding: 8px 8px 5px 8px;
}

#toc a,
.tocnumber,
.toctogglelabel {
    color: #8BB9E0 !important;
}

/* Message Boxes */
.mw-message-box {
    color: #b9b7b5;
    background-color: #eaecf0;
    border-color: #a2a9b1;
}

.mw-message-box p strong {
    color: #c74343;
}

.mw-message-box-warning {
    background-color: #5d5028;
    border-color: #b4932e;
}

.mw-message-box-error {
    color: red;
}

.usermessage {
    background-color: #273458;
    border: 2px solid #3393ea;
    color: white;
}

/* Thumbnails */
div.thumbinner {
    border: 1px solid #525252 !important;
    background-color: #353535 !important;
}

html .thumbimage {
    border: 1px solid #525252;
    background-color: #353535;
}

html .thumbcaption {
    color: #b9b7b5;
}

/* Gallery */
table.gallery {
    background-color: #3A3A3A !important;
    border: 1px solid #525252 !important;
}

table.gallery td {
    background-color: #3A3A3A !important;
    border: 2px solid #3A3A3A !important;
}

div.gallerybox div.thumb {
    border: 1px solid #525252 !important;
}

li.gallerybox div.thumb {
    border: 1px solid #5e5e5e;
}

/* Diff Tables */
table.diff {
    background-color: #202020;
    color: white;
    border: 1px solid #666666;
}

td.diff-otitle,
td.diff-ntitle {
    background-color: #3A3A3A;
    color: #D8D7D6;
}

td.diff-deletedline,
td.diff-addedline {
    color: #D8D7D6;
    background-color: #404040;
    border-color: #666;
}

td.diff-context {
    background: #303030;
    color: #D8D7D6;
    border-color: transparent;
}

.diff-addedline .diffchange {
    background: #194C7D;
}

.diff-deletedline .diffchange {
    background: #B78100;
}

/* Changes List */
.mw-changeslist .mw-changeslist-legend {
    background-color: #3c3c3c !important;
    border-color: #525252 !important;
}

#pagehistory li.selected {
    color: #b9b7b5 !important;
    background-color: #404040;
    border: 1px solid #646464;
}

.mw-plusminus-neg {
    color: #bf6060 !important;
}

.mw-plusminus-pos {
    color: #629360 !important;
}

/* Fieldset */
fieldset {
    background-color: #2b2b2b;
    border: #ffff0d 1px solid;
    border-radius: .35em;
}

/* Dialog */
div.ui-dialog-titlebar {
    border: 1px solid #636363;
    background: #414141;
    color: #BDBDBD;
}

div.ui-dialog-buttonpane {
    background: #242424;
}

/* WikiEditor */
div.wikiEditor-ui,
div.wikiEditor-ui-view,
div.wikiEditor-ui-view-wikitext,
div.wikiEditor-ui-top {
    border-color: #525252 !important;
}

div.wikiEditor-toolbar-dialog {
    background: #242424;
}

div.editOptions {
    background-color: #262626;
    border-color: #666666;
    color: #b9b7b5;
}

/* Search */
.mw-search-profile-tabs {
    background-color: #2b2b2b;
    border: #525252 1px solid;
}

#mw-searchoptions {
    background-color: #2b2b2b;
    border: #525252 1px solid;
}

.search-types .current a {
    color: #b9b7b5;
}

/* Preferences */
.client-js #preferences .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed {
    background-color: #3C3C3C;
}

.client-js #preferences .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed .oo-ui-tabSelectWidget-framed {
    background-color: #262626;
}

.client-js #preferences .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed .oo-ui-tabSelectWidget-framed .oo-ui-labelElement-label {
    color: gray;
}

.client-js #preferences .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected {
    background-color: #3C3C3C;
    color: white;
}

.client-js #preferences .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
    color: lightgray;
}

.client-js #preferences .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input,
.client-js #preferences .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle,
.client-js #preferences .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
    background-color: #202020;
    border-color: #626262;
    color: #B9B7B5;
}

.client-js #preferences div.mw-prefs-buttons {
    background: #626262;
    border-color: #3C3C3C;
}

/* Print Styles */
@media print {
    .wikitable > tr > th,
    .wikitable > tr > td,
    .wikitable > * > tr > th,
    .wikitable > * > tr > td {
        background: #fff !important;
        color: #000 !important;
        border: 1pt solid #aaa;
    }
    
    pre,
    .mw-code {
        background: #fff;
        color: #000;
        border: 1pt dashed #000;
    }
    
    a,
    a.external,
    a.new,
    a.stub {
        color: inherit !important;
        text-decoration: inherit !important;
    }
}