MediaWiki:Common.css
From Portals of Phereon Wiki
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.
/* SKIN SPECIFIC STUFF IS IN HERE: MediaWiki:Timeless.css */
/* widget mitigation */
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:TempWidget.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:ProgressRing.css");
/* Imports go here */
@import url('https://fonts.googleapis.com/css?family=Tinos&display=swap');
@import url('https://fonts.googleapis.com/css?family=Inknut+Antiqua:700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Tienne&display=swap');
@import url('https://fonts.googleapis.com/css?family=Bitter&display=swap');
@import url('https://fonts.googleapis.com/css?family=Volkhov&display=swap');
/* Imports:
> MediaWiki:Tabber.css - Tabber styles
> MediaWiki:NavSpecies.css - Species tabber tab color styles
> MediaWiki:NavTown.css - Town tabber with scroll styles
> MediaWiki:ThemeInfobox.css - Default infobox styles
> MediaWiki:ThemeSpecies.css - Species infobox styles
> MediaWiki:ThemeNPC.css - NPC infobox styles
> MediaWiki:Mbox.css - Mbox styles
*/
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:Tabber.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:NavSpecies.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:NavTown.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:ThemeInfobox.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:ThemeSpecies.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:ThemeNPC.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:Mbox.css");
/* Default image CSS */
img {
max-width: 100%;
height: auto;
}
/* Make images responsive */
.responsive img,img.responsive {
max-width: 100%;
height: auto;
}
.banner img,img.banner {
max-width: 100%;
height: auto;
max-height: 10rem;
width: auto;
}
/* Hide main page title */
body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; }
/* Clearfix */
.clearfix::before,
.clearfix::after {
content: "";
display: table;
}
.clearfix::after {
clear: both;
}
.clearfix {
zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}
.cf-fix::before {
content: none; /* Make top margins collapse nicely */
}
/*****************************
* Stuff from Gamepedia start *
******************************/
/* Navbox template style */
/* Navbox container style */
.navbox {
border: 1px solid #9F6A00;
font-size: 88%;
text-align: center;
width: 100%;
margin: auto;
padding: 1px;
clear: both;
}
.navbox-inner,
.navbox-subgroup {
width: 100%;
}
/* Title, group and above/below styles */
.navbox-group,
.navbox-title,
.navbox-abovebelow {
text-align: center;
padding: 0.25em 1em;
line-height: 1.5em;
}
/* Group style */
th.navbox-group {
white-space: nowrap;
/* @noflip */
text-align: right;
}
.navbox,
.navbox-subgroup {
background-color: transparent;
}
.navbox-list {
line-height: 1.8em;
border-color: transparent; /* Must match background color */
}
/* Level 1 color */
.navbox th,
.navbox-title {
background-color: #282828;
border: 0 solid #9F6A00;
color: #FFFFFF;
}
/* Level 2 color */
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
background: #282828;
}
/* Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
background: #444444;
}
/* Odd row striping */
.navbox-odd {
background: transparent;
}
/* Even row striping */
.navbox-even {
background-color: rgba(128,128,128,0.3);
}
/* Single pixel border between adjacent navboxes */
table.navbox + table.navbox {
margin-top: -1px;
}
/* Default styling for Navbar template */
.navbar {
font-size: 88%;
font-weight: normal;
}
/* Navbar styling when nested in infobox and navbox */
.navbox .navbar {
display: block;
font-size: 100%;
}
.navbox-title .navbar {
float: left;
text-align: left;
margin-right: 0.5em;
width: 6em;
}
/* Styling for JQuery makeCollapsible, matching that of collapseButton */
.mw-collapsible-toggle {
font-weight: normal;
/* @noflip */
text-align: right;
}
.navbox .mw-collapsible-toggle {
width: 6em;
}
/* .navbox .mw-collapsible-toggle a, */
.wikitable .mw-collapsible-toggle a {
color: #F58120 !important;
}
.mw-collapsible-toggle.mw-collapsible-toggle-expanded a,
.mw-collapsible-toggle.mw-collapsible-toggle-collapsed a {
color: #F37F20;
}
/* Infobox template style */
.infobox {
background-color: rgba(0, 0, 0, 0);
border: 1px solid #505050;
float: right;
font-size: 89%;
margin-bottom: 0.5em;
padding: 0.2em;
width: 300px;
}
.infobox td.infoboxlabel {
border: 2px solid inherit;
font-weight: bold;
padding: 0.5px 7px;
text-align: right;
}
.infoboxname {
background-color: #f58120;
color: #000;
font-size: 110%;
font-weight: bold;
padding: 0.5em;
}
.infoboxdescription {
background-color: #f58120;
color: #000;
}
fieldset { border-color: #F37F20; }
#global-wrapper #preferences legend { color: #F37F20; }
.client-js #preferences fieldset { background: none; }
/* [[Template:Message]] */
table.gpmbox {
background:var(--message-background);
color:var(--text-color);
}
/***************************
* Stuff from Gamepedia end *
****************************/
/**********************
* Main page CSS start *
***********************/
/* Main page */
/* MP-Box stuff*/
.mp-box,
.mp-banner {
margin: 0.5em 0;
box-shadow: 0 0.25rem 0.35rem -0.25rem var(--mp-border,black);
}
.mp-box {
border: 1px solid var(--mp-border,black);
background: var(--secondary-lighter,#FAFAFA);
padding: 0.75em 1.5em;
width: 100%;
box-sizing: border-box;
}
.mp-box > * {
width: 100%;
}
.mp-heading {
color: var(--text);
font-size: 132%;
font-weight: bold;
margin: 0 0 0.5em;
padding: 0 0 0.25em;
text-align: center;
border-bottom: 1px solid var(--mp-border,black);
}
/* Progress ring stuff */
.progress-ring > svg {
transform: rotate(-90deg);
position: absolute;
}
.progress-ring {
display: inline-flex;
justify-content: center;
align-items: center;
/* font-family: 'Segoe UI','Segoe UI Emoji','Segoe UI Symbol','Lato','Liberation Sans','Noto Sans','Helvetica Neue','Helvetica',sans-serif; */
}
.progress-ring .preline {
stroke-dashoffset: 0;
}
.mp-box hr {
border-style: solid none none none;
}
/* Announcement box stuff */
#announcement-mpbox hr:nth-last-of-type(1) {
display: none;
}
#announcement-mpbox > * > h4 {
margin: 0 0;
}
#announcement-mpbox > * > p {
margin: 0.25em 0;
}
#announcement-mpbox > * > p:nth-last-of-type(1) > small:nth-last-of-type(1),
#announcement-mpbox > * > p:nth-last-of-type(1) > small:nth-last-of-type(2) {
float: left;
}
/* Recent Changes stuff */
.mp-box .mw-changeslist {
font-size: 80%;
white-space: nowrap;
overflow: hidden;
padding-bottom: 0.5em;
}
.mp-box .mw-enhancedchanges-arrow-space,
.mp-box .mw-rcfilters-ui-highlights-enhanced-nested,
.mp-box .mw-changeslist-legend,
.mp-box .mw-rollback-link,
.mp-box .mw-changeslist-line-inner-userTalkLink,
.mp-box .mw-changeslist-line-inner-rollback,
.mp-box .mw-changeslist-line-inner-tags,
.mp-box .mw-changeslist-line-inner-watchingUsers {
display: none;
}
.mp-box .mw-changeslist-line-inner > * {
vertical-align: baseline;
}
.mp-box .mw-changeslist-line-inner-comment {
display: inline-block;
vertical-align: bottom;
overflow: hidden;
text-overflow: ellipsis;
max-width: 10em;
vertical-align: bottom;
margin-left: 3px;
}
.mp-box .mw-changeslist > h4 {
margin: 0.8em 0 0.4em;
}
/*.mp-box .mw-changeslist-line > tbody > tr > .mw-enhanced-rc {
max-width: 6em;
direction: rtl;
}
.mp-box .mw-changeslist-line-inner {
position: relative;
right: 2em;
}*/
.mp-box .mw-changeslist-line-inner .mw-title::after {
content:"";
display:block;
}
.mp-box .mw-changeslist-separator:empty::before {
content: "";
}
.mp-box .mw-changeslist-history {
display:none;
}
.mp-box .mw-changeslist-links > span:nth-child(2)::before,
.mp-box .mw-changeslist-links::before,
.mp-box .mw-changeslist-links::after {
content:"";
}
.mp-box .mw-changeslist-line-inner-userLink::before {
content:"["
}
.mp-box .mw-changeslist-line-inner-userLink::after {
content:"]"
}
.mp-box .mw-changeslist-diff {
text-transform: capitalize;
}
table.mw-enhanced-rc th,
table.mw-enhanced-rc td {
padding:0;
vertical-align:baseline;
}
.mp-box .mw-enhanced-rc > abbr {
position: relative;
left: 2em;
}
.mp-box .mw-changeslist > div {
position: relative;
right: 1.5em;
}
.mp-box .comment--without-parentheses:before,
.mp-box .comment--without-parentheses:after {
content:"";
}
/********************
* Main page CSS end *
*********************/
#mw-site-navigation .sidebar-inner h3,
#mw-related-navigation .sidebar-inner h3,
#mw-site-navigation .dropdown h3,
#mw-related-navigation .dropdown h3 {
border-color: var(--gray-lightish);
}
/* Default table style */
table {
background: #d6d0c5;
border-collapse: collapse;
border: 0px none #aeaaa2;
margin:1em 1em 1em 0;
}
th {
background: #cfc9bc;
text-align: left;
}
th, td {
border: 1px #aeaaa2 solid;
padding: 6px 12px;
}
tr:nth-child(odd) {
background: var(--secondary);
}
tr:nth-child(even) {
background: hsl(var(--z-secondary-h), calc(var(--z-secondary-s) * 1%), calc(var(--z-secondary-l) * (100 - var(--x-darkish)) / 90 * 1%));
}