MediaWiki:Vector.css

From Fiend Folio Wiki
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.
/* Global variables */
:root {
    --text-color: #FDF0FF;
    --unvisited-link-color: #F4D34E;
    --visited-link-color: #E58E2B;
    --table-header-color: #142E59;
}
/* var(--) */

/***************
/* Page styles *
/***************/
#content {
    color: var(--text-color);
    font-family: sans-serif, cursive; /* 2nd font is for backup*/
    border-bottom-color: #D1BCD6; /* changes the line color at the top */
    background-color: #150D16;
    border: 1px solid #110A11;
}

/* Changes the Page Title and Main Page Box font */
h1, .mw-headline {
    font-family: sans-serif, cursive !important; /* 2nd font is for backup */
}

/* changes the lists dots color */
ul {
  list-style-image: url("none");
}

/*****************
/* Footer styles *
/*****************/
/* footer text */
#footer ul li {
    color: var(--text-color)
}

.catlinks,
#catlinks,
ul#filetoc {
    background-color: transparent;
    border: 1px solid #000;
    margin: 10px;
}

.warning {
    color: #FFA500;
}

/* Thumbnails */
li.gallerybox div.thumb,
div.thumbinner {
    background-color: rgba(221, 179, 226, 0.05);
    border: 1px solid #6F5B6E;
}
div.thumb {
    background-color: rgba(221, 179, 226, 0.05);
}

/* Controlls the text color of all headers */
h1, h2, h3, h4, h5, h6 {
    color: var(--text-color);
}

.pi-data-label.pi-secondary-font, .pi-data-value, .pi-title, .pi-header {
    color: #372B2D;
}

#mw-toc-heading {
    color: #372B2D;
}

.toctogglespan{
	color: #AA8ED6;
}
.toctogglelabel{
	color: #633F82;
}

.portable-infobox .pi-border-color {
  border-color: #BB97BF;
}

/***************
/* Table Styles *
/***************/
.skin-vector .TablePager,
.skin-vector .mw-datatable,
table.mw_metadata {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid #000;
    color: #c0c0c0;  
}

.skin-vector .TablePager th,
.skin-vector .mw-datatable th,
table.mw_metadata th {
    background-color: #0E0E10;
    border: 1px solid #000;
    color: #FFF;    
}

.skin-vector .TablePager tr:hover td,
.skin-vector .mw-datatable tr:hover td {
    background-color: rgba(0, 0, 0, 0.2) !important;
    color: #c0c0c0;
}

.skin-vector .TablePager th a,
.skin-vector .mw-datatable th a,
table.mw_metadata th a {
    background-color: #0E0E10;
    color: #FFF !important;
}
 
.skin-vector .TablePager td,
.skin-vector .mw-datatable td,
table.mw_metadata td {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid #000;
    color: #c0c0c0;
}
table.wikitable {
    background-color: rgba(255,255,255,0.05);
    border: 1px solid #00000;
    color: #FFF;
}

table.wikitable > tr > td,
table.wikitable > * > tr > td {
    border: 1px solid #000;
}

table.skin-vector .mw-datatable > tr > th,
table.skin-vector .mw-datatable > * > tr > th,
table.wikitable > tr > th,
table.wikitable > * > tr > th {
    background: var(--table-header-color);
    border: 1px solid #000;
    font-size: 10pt;
    color: #FFF;
    font-weight: bold;
}

table.striped tr:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0.1);
}

/* changes the text color of cargo Query Table */
table.cargoQueryTable {
    color: #000;
}

/* Changes the Cargo tables */
table.cargoTable > * > tr > th {
    background: var(--table-header-color);
    border: 1px solid #000;
    color: #FFF;
}

/* Makes the Cargo Table Info look more like the normal tables */
table.cargoTable.noMerge tr:nth-child(odd), table.cargoTable.noMerge tr:nth-child(even), table.cargoTable td {
    background: rgba(255,255,255,0.05);
    border: 1px solid #000;
    color: #FFF;
}

/***************
/* Link styles *
/***************/

/* Non existing page link */
a.new {
    color: #E0434C !important;
}
/* Infobox Non existing link */
.pi-data-value a.new{
    color: #E0434C !important;
}

/* remove this one later or do tests */
/* default link color */
a:link {
    color: var(--unvisited-link-color);
}

/* message box link color */
.mbox .mbox__content a, 
.mbox .mbox__content a:visited{
    color: #a545b0 !important;
}

/* unvisited link */
a {
    color: var(--unvisited-link-color);
}

/* external unvisited link */
#content a.extiw,
#content a.external {
    color: var(--unvisited-link-color);
}

/* Infobox unvisited link */
.pi-data-value a{
    color: #5E4D87 !important;
}


/* visited link */
#content a:visited,
a:visited {
    color: var(--visited-link-color);
}

/* external visited link */
#content a.extiw:visited,
#content a.external:visited {
    color: var(--visited-link-color);
}

/* Infobox visited link */
.pi-data-value a:visited{
    color: #1B1735 !important;
}


/* hover over link */
#content a.extiw:hover,
#content a.external:hover,
#content a.extiw:visited:hover,
#content a.external:visited:hover {
    color: var(--visited-link-color);
}

/* hover over link */
a:hover,
#content a:visited:hover,
a:visited:hover {
    color: var(--visited-link-color);
}


/* When clicked on changes the link color */
/* TEMP COLOR */
a:active {
    color: #ddb3e2;
}

/*******************
/* Link styles END *
/*******************/

/* page history */
.skin-vector table.diff,
.skin-vector td.diff-otitle,
.skin-vector td.diff-ntitle {
    background: none repeat scroll 0 0 transparent;
}

.skin-vector #pagehistory li {
    background-color: transparent;
    border: medium none;
    padding: 3px;
}

.skin-vector #pagehistory li.selected {
    background-color: #261713;
    background-image: none;
    border: 1px dashed #384a62;
    padding: 3px;
}

td.diff-context {
    background: none repeat scroll 0 0 transparent;
    color: #c0c0c0;
}

td.diff-deletedline {
    background-color: #420303;
    border-color: #420303;
    color: #FFF;
}

td.diff-addedline {
    background-color: var(--table-header-color);
    border-color: var(--table-header-color);
    color: #FFF;
}

.mw-plusminus-pos {
    color: #00ff00;
}

.mw-plusminus-neg {
  color: #fa0000;
}

/* Page history tweaks */
td.diff-addedline .diffchange {
    background: none;
    color: #bfd959;
}

td.diff-deletedline .diffchange {
    background: none;
    color: #e62444;
}

td.diff-addedline,
td.diff-deletedline {
    border-color: transparent;
}


.history-size, .mw-history-histlinks, .mw-usertoollinks, .mw-changeslist-separator, .comment, .mw-changeslist-links, .mw-tag-marker, .mw-tag-markers, .minoredit {
    color: var(--text-color);
}

/* Changes the color of code preview */
pre, code, .mw-code /*, .linenos, .data-line*/ {
    background-color: #191919;
    color: #c5c5c5;
    border: 1px solid #535353;
}

/* Changes the TOC to be more like the infoboxes*/
#toc {
	box-sizing  : content-box;
	border      : 24px solid;
	border-image: url( https://fiendfolio.wiki.gg/images/4/4a/CSS_Border_Infobox.png ) 24 fill round;
	text-align  : center;
	background: none;
	font-size: 1.05em;
}
.toctext{
	color: #633F82;
}

/* for "edit this page" tab and "discussion" tab etc */
.pagetab {
     border-style: solid solid none;
     border-width: thin;
     border-color: #808080;
     padding: 0.25ex 1ex 0ex;
     font-size: 95%;
}

/* Makes it so the stuff at the top (Read, Edit and etc) aren't in boxes */
#mw-head { top: 0px; }
.vector-menu-tabs li,
.vector-menu-tabs .selected,
.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown .vector-menu-heading { background: none; }

.vector-menu-dropdown .vector-menu-heading,
.vector-menu-tabs li a,
.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited {
	color: #fff;
	font-weight: bold;
}

.vector-menu-dropdown .vector-menu-heading:after { filter: invert(1); }

/* search bar */
.vector-menu-portal .vector-menu-heading { font-weight: bolder; }
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { color: #000; }
#searchInput { background-color: rgb(255 255 255 / 67%); }
/* test
.mw-searchSuggest-link .suggestions-result,
.mw-searchSuggest-link .suggestions-result:hover,
.suggestions-special,
.suggestions-special:hover {
    color: #4CFF00 !important;
}*/