Check out Sunborn's two newly announced games (official English titles pending): Girls' Frontline: Blue Butterfly Contract and Reverse Collapse: F !
You don't need an account to join in. Learn how to contribute, browse Bounties and join our Discord server.

MediaWiki:Vector.css: Difference between revisions

Welcome to IOP Wiki. This website is maintained by the Girls' Frontline community and is free to edit by anyone.
Jump to navigation Jump to search
No edit summary
Adding styling to overwrite bullets from Vector's legacy skin
Line 225: Line 225:
}
}


 
.skin-vector-legacy ul {
 
    list-style-image: inherit;
}


.errorbox, .warningbox, .successbox, .comment-toolbar {text-shadow: none;}
.errorbox, .warningbox, .successbox, .comment-toolbar {text-shadow: none;}

Revision as of 22:34, 30 July 2025

/* Also see MediaWiki:Gadget-DesignTokens.css */

:root {
	--iopw-ref-resources-background: url("/images/1/1b/background.jpg");
	--iopw-ref-resources-background-gradient: url("/images/7/7b/Bannerbg.png");
	--iopw-ref-resources-logo-medium: url("/images/c/c9/Logo.png");
	--iopw-ref-resources-logo-big: url("/images/a/a6/Header.png");
	
	--iopw-sys-wiki-background: var(--iopw-ref-resources-background);
	--iopw-sys-wiki-logo: var(--iopw-ref-resources-logo-medium);
	--iopw-sys-wiki-header-background-img: var(--iopw-ref-resources-logo-big), var(--iopw-ref-resources-background-gradient);
	
	--iopw-ref-transparency-90: 90%;
	--iopw-ref-palette-gray-10: #0C0C0C;
	--iopw-sys-palette-surface: color-mix(in srgb, var(--iopw-ref-palette-gray-10) var(--iopw-ref-transparency-90), transparent);
}

body {
	background-image: var(--iopw-sys-wiki-background);
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: right top;
	background-size: cover;
	font-family: var(--iopw-sys-typeface-base), var(--iopw-sys-typeface-base-alt), var(--iopw-sys-typeface-base-fallback);
}

/* Logo */
#mw-panel #p-logo {
	padding: 0.3rem 0.3rem 1rem 0.3rem;
	width: 100%;
	height: auto;
	
	& .mw-wiki-logo {
		background-image: var(--iopw-sys-wiki-logo);
	    background-color: transparent;
	    background-size: contain;
	    width: 100%;
		height: auto;
		aspect-ratio: 1;
	}
}

/* link colors */
a,
.vector-menu-dropdown .vector-menu-content,
.vector-menu-dropdown .mw-list-item a,
.vector-menu-dropdown .vector-menu-heading,
#mw-panel.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a,
.vector-menu-tabs-legacy li a,
.mw-body a.external,
.mw-body a.extiw
{
	color: var(--iopw-sys-palette-primary);
	
	&.mw-usertoollinks-contribs-no-edits,
	&.new,
	&.new:visited,
	&.new:hover {
		color: var(--iopw-sys-palette-font-negative);
	}
	
	&:hover {
		color: var(--iopw-sys-palette-primary-lighter);
	}
	
	&.extiw,
	&.external {
		background-position: center right;
		background-repeat: no-repeat;
		background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22%3E %3Cpath fill=%22%23fff%22 stroke=%22%2336c%22 d=%22M1.5 4.518h5.982V10.5H1.5z%22/%3E %3Cpath fill=%22%2336c%22 d=%22M5.765 1H11v5.39L9.427 7.937l-1.31-1.31L5.393 9.35l-2.69-2.688 2.81-2.808L4.2 2.544z%22/%3E %3Cpath fill=%22%23fff%22 d=%22M9.995 2.004l.022 4.885L8.2 5.07 5.32 7.95 4.09 6.723l2.882-2.88-1.85-1.852z%22/%3E %3C/svg%3E");
		padding-right: 0.8125rem;
	}
}

a:visited {
	color: var(--iopw-sys-palette-primary-darker);
}

.mw-parser-output a.extiw:visited, .mw-parser-output a.external:visited {
	color: #977097;
}

#editform {
	& #mw-editform-cancel a.oo-ui-buttonElement-button,
	& #mw-editform-cancel a.oo-ui-buttonElement-button:visited {
		color: var(--iopw-sys-palette-font-negative);
	}
}

/** User Menu */
.oo-ui-icon-bell,
.oo-ui-icon-tray {
	background-color: var(--iopw-sys-palette-gray-90);
}

/** Navigation */
div#mw-panel div.portal h3 {
	color: var(--iopw-sys-palette-gray-99);
	text-shadow: 0 0 0.2rem black, 0 0 0.2rem black;
}
#mw-navigation #mw-panel.collapsible-nav h3 a {
	color: var(--iopw-sys-palette-gray-99);
	text-decoration: none;
}
.vector-menu-dropdown .vector-menu-content {
	background-color: var(--iopw-sys-palette-surface);
}

/** Tabber */
.tabber__tab[aria-selected="true"], .tabber__tab[aria-selected="true"]:visited {
	color: var(--iopw-sys-palette-gray-99);
	background-color: var(--iopw-sys-palette-primary);
}
.tabber__tab {
	background-color: var(--iopw-sys-palette-gray-50);
	opacity: 0.45;
	box-shadow: none;
	--tabber-color: var(--iopw-sys-palette-primary);
	
	&[aria-selected="true"] {
		box-shadow: none;
		opacity: 1;
	}
}

@media (hover: hover) {
	.tabber__tab:hover {
		text-decoration: underline;
		opacity: 1;
	}
	.tabber__tab[aria-selected="true"]:hover {
		text-decoration: none;
	}
}

/* Header */
div#mw-page-base {
    background: none;
    height: 12.5rem;
    background-image: var(--iopw-sys-wiki-header-background-img);
    background-position: center,top;
    background-repeat: no-repeat,repeat-x;
    background-size: contain;
}

.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown .vector-menu-heading {
	background: none;
	background-color: color-mix(in srgb, var(--iopw-sys-palette-surface) var(--iopw-sys-transparency-25), transparent);
}
.vector-menu-tabs-legacy li {
 	background: none;
 	font-weight: var(--iopw-sys-font-weight-bold);
}
.vector-menu-tabs-legacy .selected {
 	background: var(--iopw-sys-palette-surface);
}
#mw-navigation #mw-head .vector-menu-tabs-legacy li.selected a {
color: var(--iopw-sys-palette-on-surface);
}

div#mw-panel {
	background: var(--iopw-sys-palette-surface);
}


/* Navigation Tab */
#p-variants, 
#p-cactions { 
    background-image: none; 
    background-color: rgba(0,0,0,0.3); } 

#p-cactions:hover { 
    background-image: none; 
    background-color: rgba(0,0,0,0.5); } 


#left-navigation,
#right-navigation {
    margin-top: 10rem;
}


div#footer ul li {
	color: white;
	text-shadow: 0 0 0.2em black, 0 0 0.2em black;
}


/*personal*/

#p-personal {
	background-color: var(--iopw-sys-palette-surface);
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 10px;
}
#p-personal ul {padding-left: 0em;}

/* control panel/preferences */
.mw-echo-state .mw-echo-content .mw-echo-title, .mw-echo-state .mw-echo-content .mw-echo-notification-footer, .mw-echo-date-section {color:rgb(250,250,250);}
#contentSub, #contentSub2 {color:rgb(250,250,250);}



/*              Content               */

/* system         */
/*Editing box*/
.mw-highlight{
text-shadow:none;
}
/*Editing options*/
.editOptions {
    background-color: rgba(0,0,0,0.4);
    border: none;
    border-top: none;
}
#pagehistory li.selected {
    background-color: rgba(0,0,0,0.4);
    border:none;
}
ul#filetoc {
    background-color: rgba(0,0,0,0.4);
    border:none;
}

.skin-vector-legacy ul {
    list-style-image: inherit;
}

.errorbox, .warningbox, .successbox, .comment-toolbar {text-shadow: none;}
.comment-user, .comment-user a{color:rgb(240,240,240);}

.catlinks {
    border: none;
    background-color: rgba(0,0,0,0.4);
}


.mw-search-profile-tabs{text-shadow:none;}
.diff-context{text-shadow:none;}

.wikiEditor-ui .wikiEditor-ui-view {text-shadow:none;color:black;}



/* Content body*/
.mw-body {
    background-color: var(--iopw-sys-palette-surface);
    border:none;
    color: var(--iopw-sys-palette-on-surface);
    text-shadow: 0 0 0.2em black, 0 0 0.2em black;
}

/* Header color*/
h1, h2, h3, h4, h5, h6 {
    color: var(--iopw-sys-palette-on-surface);
}


/* Table of Contents */
#toc, .toc, .mw-warning, .toccolours {
    border: 1px solid #aaa;
    background-color: var(--iopw-sys-palette-surface);
}










/* system */
#footer-info li {
	color:white;
}

@media screen {
  figure[typeof~='mw:File/Thumb'],
  figure[typeof~='mw:File/Frame'] {
    background-color:#000;
  }
  figure[typeof~='mw:File/Thumb'] > figcaption,
  figure[typeof~='mw:File/Frame'] > figcaption {
    background-color:#000;
  }
}

table.wikitable, pre, code, tt, kbd, samp, .mw-code, table.mw_metadata, .mw-datatable, .mw-datatable td, .mw-datatable th  {
    color: black;
    text-shadow: none;
} 
table.plainlinks{
  color:white;
}
table.wikitable a {color: #0645ad;}
table.wikitable a:visited {color: #0b0080;}


/*edit history boxes*/
#pagehistory li {border: none;}


/*               tabs                 */

ul.tabbernav {border-bottom:none;margin-top: 0.4em;}

/* tab body*/
.tabber .tabbertab {
    padding: 5px;
    border: none;
    /*border-top: 0;*/
    background-color: rgba(100,100,100,0.7);
}

/* active tab */
ul.tabbernav li.tabberactive a, ul.tabbernav li.tabberactive a:link {
    background-color: rgba(100,100,100,0.7);
    border: none;
    color: white;
    font-weight: bold;
}

ul.tabbernav li.tabberactive a:hover {
    background-color: rgba(100,100,100,0.7);
    border: none;
    color: white;
    font-weight: bold;
}


/* inactive tab */
ul.tabbernav li a:link {
    color: white;
    font-weight: normal;
    font-size: 110%;
    background-color:rgba(100,100,100,0.3);
    border:none;
    padding-top: 0.5em;
}
ul.tabbernav li a:hover {background-color: rgba(127,127,127,0.4);}