User:RaiderAlpha/common.css

From Totem Arts Wiki
Revision as of 17:52, 24 April 2022 by RaiderAlpha (talk | contribs) (Created page with "→‎Totem Arts Wiki CSS: →‎This goes under Common.css (rip IE users): :root { --theme-body-background-color: #060f1b; --theme-page-background-color: #0b1a2d;...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* Totem Arts Wiki CSS */

/* This goes under Common.css (rip IE users) */
:root {
    --theme-body-background-color: #060f1b;
    --theme-page-background-color: #0b1a2d;
    --theme-page-background-color--inverted: #f4e5d2;
    --theme-table-background-color: #0c1c33;
    --theme-table-background-color--secondary: #102543;
    --theme-table-title-background-color: #112a4b;
    --theme-table-subtitle-background-color: #14335b;
    --theme-text-color: rgb(188, 198, 209);
    --theme-link-color: #f28e04;
    --theme-link-color--visited: #f6b459; /* #f6b459 */
    --theme-border-color: #383f49;
    --theme-table-border-color: #4a535f;
    --theme-heading-color: #fff;
    --theme-code-color: #eee;
    --theme-search-color: #2b333d;
    --theme-tab-color: #112a4b;
    --theme-tab-color--selected: #14335b;
}
#mw-head, #mw-page-base, body {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 90%, rgba(0,0,0,0) 90%), linear-gradient(to bottom, transparent, rgba(10, 17, 28, 0.78)), linear-gradient(to right, #092b57, #59021a);
    background-size: auto 8px, auto, auto;
    background-attachment: fixed;
    color: var(--theme-text-color);
}
a {
    color: var(--theme-link-color);
}
a:visited {
    color: var(--theme-link-color--visited);
}
h1, h2, h3, h4, h5, h6 {
    color: var(--theme-heading-color);
}
h1, h2 {
    border-bottom: 1px solid var(--theme-border-color);
}
ul {
    list-style-image: none;
}

/* MediaWiki:Vector.css - Vector side bar -*/
.vector-menu-portal h3 {
    color: var(--theme-heading-color);
}
.vector-menu-portal .vector-menu-content li a {
    color: var(--theme-link-color);
}
.vector-menu-portal .vector-menu-content li a:visited {
    color: var(--theme-link-color--visited);
}
#p-tb-label {
    background-image: linear-gradient(to right,rgba(200,204,209,0) 0,var(--theme-border-color) 33%,var(--theme-border-color) 66%,rgba(200,204,209,0) 100%);
}

/* MediaWiki:Vector.css - Vector top menu tabs */
.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3 {
    background-image: none;
}
.vector-menu-tabs li {
    background: var(--theme-tab-color);
    background-image: none;
}
.vector-menu-tabs li.selected  {
    background: var(--theme-tab-color--selected);
}
.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited {
    color: var(--theme-heading-color);
}
.vector-menu-tabs li a {
    color: var(--theme-link-color);
}
.vector-menu-dropdown .vector-menu-content {
	background-color: var(--theme-tab-color);
	border: 1px solid var(--theme-border-color);
	border-top: none;
}

/* Everything below can go under MediaWiki:Common.css */
/* Page actions dropdown (More) */
#p-cactions {
    background: var(--theme-tab-color);
}
#p-cactions-label {
    color: var(--theme-heading-color);
}
#p-cactions-label::after {
    filter: invert(100%);
}
.vector-menu-dropdown li a {
	color: var(--theme-link-color);
}

/* Search form */
#searchInput {
    background-color: var(--theme-search-color);
    color: var(--theme-text-color);
}

/* Page body */
.mw-body {
    border: 1px solid var(--theme-border-color);
}
.mw-body, .parsoid-body {
    background-color: var(--theme-page-background-color);
    color: var(--theme-text-color);
}
.mw-body h1, .mw-body-content h1, .mw-body-content h2 {
    font-family: rubik,helvetica,arial,sans-serif;
}

/* External links */
.mw-parser-output a.extiw, .mw-parser-output a.external {
    color: var(--theme-link-color);
}
.mw-parser-output a.extiw:visited, .mw-parser-output a.external:visited {
    color: var(--theme-link-color--visited);
}

/* Category links */
.catlinks {
    border: 1px solid var(--theme-border-color);
    background-color: var(--theme-body-background-color);
}

/* Table of contents */
.toc, .toccolours {
    border: 1px solid var(--theme-border-color);
    background-color: var(--theme-table-background-color);
}
.tocnumber {
    color: var(--theme-text-color);
}
.toctogglelabel {
    color: var(--theme-link-color);
}

/* Image thumb */
div.thumbinner, img.thumbimage {
	border: 1px solid var(--theme-border-color);
	background-color: var(--theme-body-background-color);
}

/* Gallery */
li.gallerybox div.thumb {
	border: 1px solid var(--theme-border-color);
	background-color: var(--theme-body-background-color);
}

/* Page history */
#pagehistory li.selected {
	background-color: var(--theme-tab-color--selected);
    color: var(--theme-text-color);
	outline: 1px dashed var(--theme-table-border-color);
}
.oo-ui-fieldsetLayout.mw-collapsible.mw-collapsed .mw-collapsible-toggle .oo-ui-icon-expand,
.oo-ui-fieldsetLayout.mw-collapsible .mw-collapsible-toggle .oo-ui-iconElement-icon {
    color: var(--theme-page-background-color--inverted);
    filter: invert(100%);
}

/* Footer */
.mw-footer li {
    color: var(--theme-text-color);
}

/* Notice boxes */
.noticebox, .warningbox {
	background-color: var(--theme-tab-color--selected) !important;
	border: 1px solid var(--theme-table-border-color);
    color: var(--theme-text-color) !important;
}

/* Code preview */
pre, code, .mw-code {
	background-color: var(--theme-table-background-color);
    border-color: var(--theme-border-color);
    color: var(--theme-code-color);
}

/* Table */
.mw-datatable, .mw-datatable td, .mw-datatable th, 
.mw-datatable, .wikitable td, .wikitable th {
	background-color: var(--theme-table-background-color);
	border: 1px solid var(--theme-table-border-color);
    color: var(--theme-text-color);
}
.mw-datatable > tr > th, .mw-datatable > * > tr > th,
.wikitable > tr > th, .wikitable > * > tr > th {
    background: var(--theme-table-title-background-color);
}
.mw-datatable tr:hover td {
	background-color: var(--theme-table-background-color--secondary);
}

/* Main page portal */
.mainpage-portal {
    border: 1px solid var(--theme-table-border-color) !important;
}
.mainpage-portal-title {
    background: var(--theme-table-title-background-color) !important;
}
.mainpage-portal-content {
    background: var(--theme-table-background-color) !important;
}

/* Infobox */
.infobox {
	background-color: var(--theme-table-background-color);
	border: 1px solid var(--theme-table-border-color);
    color: var(--theme-text-color);
}
.infobox .infobox-title {
    background: var(--theme-table-title-background-color) !important;
    vertical-align: middle;
}
.infobox tr > th {
    background: var(--theme-table-subtitle-background-color) !important;
    height: 1.5em;
}
.infobox td ul {
	margin: 0 0 0 1em;
	padding: 0;
}
.infobox .infobox-title {
    background: var(--theme-table-title-background-color);
}
.infobox .infobox-label {
    background: var(--theme-table-subtitle-background-color);
}
.infobox td table.damage-multipliers th {
    background: none !important;
}

/* Navbox */
.navbox {
    background-color: var(--theme-table-background-color);
	border: 1px solid var(--theme-table-border-color);
    color: var(--theme-text-color);
}
.navbox, .navbox-subgroup {
    background: var(--theme-table-background-color);
}
.navbox th.navbox-title {
	background: var(--theme-table-title-background-color);
    color: var(--theme-heading-color);
}
.navbox th.navbox-title a {
    color: var(--theme-heading-color);
}
.navbox th.navbox-group {
	background: var(--theme-table-subtitle-background-color);
    color: var(--theme-heading-color);
}
.navbox-list {
	border-color: var(--theme-table-background-color);
}
.navbox-even {
    background: var(--theme-table-background-color--secondary);
}

/* Editor */
.wikiEditor-ui .wikiEditor-ui-view {
    border: 1px solid var(--theme-border-color);
}
.mw-editform #wpTextbox1 {
    background: var(--theme-body-background-color);
    color: var(--theme-code-color);
}
.editOptions {
	background: var(--theme-tab-color);
	border: 1px solid var(--theme-border-color);
	color: var(--theme-code-color);
}

/* Related changes */
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
	background: var(--theme-table-color);
	border: 1px solid var(--theme-border-color);
}