MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
no edit summary
imported>Hb1290 No edit summary |
imported>Hb1290 No edit summary |
||
| Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
/* | /* Code copied from [[wikipedia:MediaWiki:Common.css]] */ | ||
.infobox { | |||
border: 1px solid #a2a9b1; | |||
border-spacing: 3px; | |||
background-color: #f8f9fa; | |||
color: black; | |||
/* @noflip */ | |||
margin: 0.5em 0 0.5em 1em; | |||
padding: 0.2em; | |||
/* @noflip */ | |||
float: right; | |||
/* @noflip */ | |||
clear: right; | |||
font-size: 88%; | |||
line-height: 1.5em; | |||
} | } | ||
.infobox caption { | |||
font-size: 125%; | |||
font-weight: bold; | |||
padding: 0.2em; | |||
} | |||
.infobox td, | |||
.infobox th { | |||
vertical-align: top; | |||
/* @noflip */ | |||
text-align: left; | |||
} | |||
.infobox.bordered { | |||
border-collapse: collapse; | |||
} | |||
.infobox.bordered td, | |||
.infobox.bordered th { | |||
border: 1px solid #a2a9b1; | |||
} | |||
.infobox.bordered .borderless td, | |||
.infobox.bordered .borderless th { | |||
border: 0; | |||
} | |||
.infobox.sisterproject { | |||
width: 20em; | |||
font-size: 90%; | |||
} | |||
.infobox.standard-talk { | |||
border: 1px solid #c0c090; | |||
background-color: #f8eaba; | |||
} | |||
.infobox.standard-talk.bordered td, | |||
.infobox.standard-talk.bordered th { | |||
border: 1px solid #c0c090; | |||
} | |||
/* END Infobox template style */ | |||
/* styles for bordered infobox with merged rows */ | |||
/* Code copied from [[wikipedia:MediaWiki:Common.css]] */ | |||
.infobox.bordered .mergedtoprow td, | |||
.infobox.bordered .mergedtoprow th { | |||
border: 0; | |||
border-top: 1px solid #a2a9b1; | |||
/* @noflip */ | |||
border-right: 1px solid #a2a9b1; | |||
} | |||
.infobox.bordered .mergedrow td, | |||
.infobox.bordered .mergedrow th { | |||
border: 0; | |||
/* @noflip */ | |||
border-right: 1px solid #a2a9b1; | |||
} | |||
/* Styles for geography infoboxes, eg countries, | |||
country subdivisions, cities, etc. */ | |||
.infobox.geography { | |||
border-collapse: collapse; | |||
line-height: 1.2em; | |||
font-size: 90%; | |||
} | |||
.infobox.geography td, | |||
.infobox.geography th { | |||
border-top: 1px solid #a2a9b1; | |||
padding: 0.4em 0.6em 0.4em 0.6em; | |||
} | |||
.infobox.geography .mergedtoprow td, | |||
.infobox.geography .mergedtoprow th { | |||
border-top: 1px solid #a2a9b1; | |||
padding: 0.4em 0.6em 0.2em 0.6em; | |||
} | |||
.infobox.geography .mergedrow td, | |||
.infobox.geography .mergedrow th { | |||
border: 0; | |||
padding: 0 0.6em 0.2em 0.6em; | |||
} | |||
.infobox.geography .mergedbottomrow td, | |||
.infobox.geography .mergedbottomrow th { | |||
border-top: 0; | |||
border-bottom: 1px solid #a2a9b1; | |||
padding: 0 0.6em 0.4em 0.6em; | |||
} | |||
.infobox.geography .maptable td, | |||
.infobox.geography .maptable th { | |||
border: 0; | |||
padding: 0; | |||
} | |||
/* END styles for bordered infobox with merged rows */ | |||
/* Make Main Page title invisible */ | |||
body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; } | |||
/* Make Images Work in Dark Mode. Particularly for Main Page icons.*/ | |||
@media (prefers-color-scheme: dark) { | |||
.image { | |||
background-image: url(<path>); | |||
} | |||
} | |||
/* Cell sizes for ambox/tmbox/imbox/cmbox/ombox/fmbox/dmbox message boxes */ | |||
th.mbox-text, td.mbox-text { /* The message body cell(s) */ | |||
border: none; | |||
padding: 0.25em 0.9em; /* 0.9em left/right */ | |||
width: 100%; /* Make all mboxes the same width regardless of text length */ | |||
} | |||
td.mbox-image { /* The left image cell */ | |||
border: none; | |||
padding: 2px 0 2px 0.9em; /* 0.9em left, 0px right */ | |||
text-align: center; | |||
} | |||
td.mbox-imageright { /* The right image cell */ | |||
border: none; | |||
padding: 2px 0.9em 2px 0; /* 0px left, 0.9em right */ | |||
text-align: center; | |||
} | |||
td.mbox-empty-cell { /* An empty narrow cell */ | |||
border: none; | |||
padding: 0; | |||
width: 1px; | |||
} | |||
/* Article message box styles */ | |||
table.ambox { | |||
margin: 0 10%; /* 10% = Will not overlap with other elements */ | |||
border: 1px solid #a2a9b1; | |||
border-left: 10px solid #36c; /* Default "notice" blue */ | |||
background: #fbfbfb; | |||
} | |||
table.ambox + table.ambox { /* Single border between stacked boxes. */ | |||
margin-top: -1px; | |||
} | |||
.ambox th.mbox-text, | |||
.ambox td.mbox-text { /* The message body cell(s) */ | |||
padding: 0.25em 0.5em; /* 0.5em left/right */ | |||
} | |||
.ambox td.mbox-image { /* The left image cell */ | |||
padding: 2px 0 2px 0.5em; /* 0.5em left, 0px right */ | |||
} | |||
.ambox td.mbox-imageright { /* The right image cell */ | |||
padding: 2px 0.5em 2px 0; /* 0px left, 0.5em right */ | |||
} | } | ||
/* | table.ambox-notice { | ||
. | border-left: 10px solid #36c; /* Blue */ | ||
} | |||
table.ambox-speedy { | |||
border-left: 10px solid #b32424; /* Red */ | |||
background: #fee7e6; /* Pink */ | |||
} | |||
table.ambox-delete { | |||
border-left: 10px solid #b32424; /* Red */ | |||
} | |||
table.ambox-content { | |||
border-left: 10px solid #f28500; /* Orange */ | |||
} | |||
table.ambox-style { | |||
border-left: 10px solid #fc3; /* Yellow */ | |||
} | |||
table.ambox-move { | |||
border-left: 10px solid #9932cc; /* Purple */ | |||
} | |||
table.ambox-protection { | |||
border-left: 10px solid #a2a9b1; /* Gray-gold */ | |||
} | } | ||
/* Image message box styles */ | |||
table.imbox { | |||
margin: 4px 10%; | |||
border-collapse: collapse; | |||
border: 3px solid #36c; /* Default "notice" blue */ | |||
background: #fbfbfb; | |||
} | |||
.imbox .mbox-text .imbox { /* For imboxes inside imbox-text cells. */ | |||
margin: 0 -0.5em; /* 0.9 - 0.5 = 0.4em left/right. */ | |||
} | |||
.mbox-inside .imbox { /* For imboxes inside other templates. */ | |||
margin: 4px; | |||
} | |||
/* | table.imbox-notice { | ||
. | border: 3px solid #36c; /* Blue */ | ||
} | |||
table.imbox-speedy { | |||
border: 3px solid #b32424; /* Red */ | |||
background: #fee; /* Pink */ | |||
} | |||
table.imbox-delete { | |||
border: 3px solid #b32424; /* Red */ | |||
} | |||
table.imbox-content { | |||
border: 3px solid #f28500; /* Orange */ | |||
} | |||
table.imbox-style { | |||
border: 3px solid #fc3; /* Yellow */ | |||
} | |||
table.imbox-move { | |||
border: 3px solid #9932cc; /* Purple */ | |||
} | |||
table.imbox-protection { | |||
border: 3px solid #a2a9b1; /* Gray-gold */ | |||
} | |||
table.imbox-license { | |||
border: 3px solid #88a; /* Dark gray */ | |||
background: #f7f8ff; /* Light gray */ | |||
} | |||
table.imbox-featured { | |||
border: 3px solid #cba135; /* Brown-gold */ | |||
} | |||
/* Category message box styles */ | |||
table.cmbox { | |||
margin: 3px 10%; | |||
border-collapse: collapse; | |||
border: 1px solid #a2a9b1; | |||
background: #DFE8FF; /* Default "notice" blue */ | |||
} | |||
table.cmbox-notice { | |||
background: #D8E8FF; /* Blue */ | |||
} | |||
table.cmbox-speedy { | |||
margin-top: 4px; | |||
margin-bottom: 4px; | |||
border: 4px solid #b32424; /* Red */ | |||
background: #FFDBDB; /* Pink */ | |||
} | |||
table.cmbox-delete { | |||
background: #FFDBDB; /* Red */ | |||
} | |||
table.cmbox-content { | |||
background: #FFE7CE; /* Orange */ | |||
} | } | ||
. | table.cmbox-style { | ||
background: #FFF9DB; /* Yellow */ | |||
} | } | ||
. | table.cmbox-move { | ||
background: #E4D8FF; /* Purple */ | |||
} | } | ||
. | table.cmbox-protection { | ||
background: #EFEFE1; /* Gray-gold */ | |||
} | } | ||
. | |||
/* Other pages message box styles */ | |||
table.ombox { | |||
margin: 4px 10%; | |||
border-collapse: collapse; | |||
border: 1px solid #a2a9b1; /* Default "notice" gray */ | |||
background: #f8f9fa; | |||
} | } | ||
table.ombox-notice { | |||
border: 1px solid #a2a9b1; /* Gray */ | |||
} | } | ||
. | table.ombox-speedy { | ||
border: 2px solid #b32424; /* Red */ | |||
background: #fee; /* Pink */ | |||
} | } | ||
. | table.ombox-delete { | ||
border: 2px solid #b32424; /* Red */ | |||
} | } | ||
table.ombox-content { | |||
border: 1px solid #f28500; /* Orange */ | |||
} | } | ||
. | table.ombox-style { | ||
border: 1px solid #fc3; /* Yellow */ | |||
} | } | ||
. | table.ombox-move { | ||
border: 1px solid #9932cc; /* Purple */ | |||
} | } | ||
. | table.ombox-protection { | ||
border: 2px solid #a2a9b1; /* Gray-gold */ | |||
} | } | ||
. | |||
/* Talk page message box styles */ | |||
table.tmbox { | |||
margin: 4px 10%; | |||
border-collapse: collapse; | |||
border: 1px solid #c0c090; /* Default "notice" gray-brown */ | |||
background: #f8eaba; | |||
} | } | ||
. | .mediawiki .mbox-inside .tmbox { /* For tmboxes inside other templates. The "mediawiki" */ | ||
margin: 2px 0; /* class ensures that this declaration overrides other */ | |||
width: 100%; /* For Safari and Opera */ /* styles (including mbox-small above) */ | |||
} | } | ||
. | .mbox-inside .tmbox.mbox-small { /* "small" tmboxes should not be small when */ | ||
. | line-height: 1.5em; /* also "nested", so reset styles that are */ | ||
. | font-size: 100%; /* set in "mbox-small" above. */ | ||
} | } | ||
/* | table.tmbox-speedy { | ||
. | border: 2px solid #b32424; /* Red */ | ||
background: #fee; /* Pink */ | |||
} | |||
table.tmbox-delete { | |||
border: 2px solid #b32424; /* Red */ | |||
} | |||
table.tmbox-content { | |||
border: 2px solid #f28500; /* Orange */ | |||
} | |||
table.tmbox-style { | |||
border: 2px solid #fc3; /* Yellow */ | |||
} | } | ||
. | table.tmbox-move { | ||
border: 2px solid #9932cc; /* Purple */ | |||
} | } | ||
. | table.tmbox-protection, | ||
table.tmbox-notice { | |||
border: 1px solid #a2a9b1; /* Gray-brown */ | |||
} | } | ||
. | |||
/* Footer and header message box styles */ | |||
table.fmbox { | |||
clear: both; | |||
margin: 0.2em 0; | |||
width: 100%; | |||
border: 1px solid #a2a9b1; | |||
background: #f8f9fa; /* Default "system" gray */ | |||
} | } | ||
. | table.fmbox-system { | ||
background: #f8f9fa; | |||
} | } | ||
/* | table.fmbox-warning { | ||
border: 1px solid #bb7070; /* Dark pink */ | |||
background: #ffdbdb; /* Pink */ | |||
} | } | ||
. | table.fmbox-editnotice { | ||
background: transparent; | |||
} | } | ||
. | |||
/* These mbox-small classes must be placed after all other | |||
ambox/tmbox/ombox etc classes. "html body.mediawiki" is so | |||
they override "table.ambox + table.ambox" above. */ | |||
html body.mediawiki .mbox-small { /* For the "small=yes" option. */ | |||
/* @noflip */ | /* @noflip */ | ||
clear: right; | |||
/* @noflip */ | /* @noflip */ | ||
float: right; | |||
/* @noflip */ | /* @noflip */ | ||
margin- | margin: 4px 0 4px 1em; | ||
box-sizing: border-box; | |||
width: 238px; | |||
font-size: 88%; | |||
line-height: 1.25em; | |||
} | |||
html body.mediawiki .mbox-small-left { /* For the "small=left" option. */ | |||
/* @noflip */ | |||
margin: 4px 1em 4px 0; | |||
box-sizing: border-box; | |||
overflow: hidden; | |||
width: 238px; | |||
border-collapse: collapse; | |||
font-size: 88%; | |||
line-height: 1.25em; | |||
} | } | ||
/* | /* Style for compact ambox */ | ||
. | /* Hide the images */ | ||
.compact-ambox table .mbox-image, | |||
.compact-ambox table .mbox-imageright, | |||
.compact-ambox table .mbox-empty-cell { | |||
display: none; | |||
} | } | ||
. | /* Remove borders, backgrounds, padding, etc. */ | ||
.compact-ambox table.ambox { | |||
border: none; | |||
border-collapse: collapse; | |||
background-color: transparent; | |||
margin: 0 0 0 1.6em !important; | |||
padding: 0 !important; | |||
width: auto; | |||
display: block; | |||
} | } | ||
body.mediawiki .compact-ambox table.mbox-small-left { | |||
font-size: 100%; | |||
width: auto; | |||
margin: 0; | margin: 0; | ||
} | } | ||
/* | /* Style the text cell as a list item and remove its padding */ | ||
. | .compact-ambox table .mbox-text { | ||
. | padding: 0 !important; | ||
margin: 0 !important; | |||
margin: 0; | } | ||
display: | .compact-ambox table .mbox-text-span { | ||
display: list-item; | |||
line-height: 1.5em; | |||
list-style-type: square; | |||
list-style-image: url(/w/skins/MonoBook/resources/images/bullet.svg); | |||
} | } | ||
.skin-vector .compact-ambox table .mbox-text-span { | |||
. | list-style-type: disc; | ||
. | list-style-image: url(/w/skins/Vector/resources/skins.vector.styles/images/bullet-icon.svg); | ||
. | |||
. | |||
} | } | ||
/* | /* Allow for hiding text in compact form */ | ||
. | .compact-ambox .hide-when-compact { | ||
display: none; | display: none; | ||
} | } | ||
/* | |||
. | /* Hide (formatting) elements from screen, but not from screenreaders */ | ||
.visualhide { | |||
position: absolute; | |||
left: -10000px; | |||
top: auto; | |||
width: 1px; | |||
height: 1px; | |||
overflow: hidden; | |||
} | |||
/* Remove underlines from certain links */ | |||
.nounderlines a, | |||
.IPA a:link, .IPA a:visited { | |||
text-decoration: none !important; | |||
} | |||
/* Standard Navigationsleisten, aka box hiding thingy | |||
from .de. Documentation at [[Wikipedia:NavFrame]]. */ | |||
div.NavFrame { | |||
margin: 0; | |||
padding: 4px; | |||
border: 1px solid #a2a9b1; | |||
text-align: center; | |||
border-collapse: collapse; | |||
font-size: 95%; | |||
} | } | ||
div.NavFrame + div.NavFrame { | |||
border-top-style: none; | |||
border-top-style: hidden; | |||
} | |||
div.NavFrame div.NavHead { | |||
. | line-height: 1.6em; | ||
. | |||
font-weight: bold; | font-weight: bold; | ||
background-color: #ccf; | |||
position: relative; | |||
} | } | ||
. | div.NavFrame p, | ||
. | div.NavFrame div.NavContent, | ||
. | div.NavFrame div.NavContent p { | ||
font-size: 100%; | |||
} | } | ||
a.NavToggle { | |||
position: absolute; | |||
top: 0; | |||
/* @noflip */ | |||
right: 3px; | |||
font-weight: normal; | font-weight: normal; | ||
font-size: 90%; | |||
} | |||
/* Hatnotes and disambiguation notices */ | |||
.hatnote { | |||
font-style: italic; | |||
} | } | ||
. | .hatnote i { | ||
. | font-style: normal; | ||
. | } | ||
div.hatnote { | |||
/* @noflip */ | |||
padding-left: 1.6em; | |||
margin-bottom: 0.5em; | |||
} | |||
div.hatnote + div.hatnote { | |||
margin-top: -0.5em; | |||
} | |||
/* Allow transcluded pages to display in lists rather than a table. */ | |||
.listify td { | |||
display: list-item; | |||
} | |||
.listify tr { | |||
display: block; | |||
} | |||
.listify table { | |||
display: block; | |||
} | |||
/* Interface Style (code by Hb1290) */ | |||
div#mw-panel div.portal h3{ | |||
font-family:Century Gothic; font-weight:450; font-size: 14px; | |||
} | |||
div#mw-navigation div#mw-head div#p-personal{ | |||
font-family:Century Gothic; | |||
} | |||
div#mw-navigation div#mw-head div#right-navigation{ | |||
font-family:Century Gothic; | |||
} | |||
div#mw-navigation div#mw-head div#left-navigation{ | |||
font-family:Century Gothic; | |||
} | |||
/* keep hidden categories hidden (unless preferences set otherwise) */ | |||
.mw-hidden-cats-ns-shown {display: none} | |||
/* Unbulleted lists */ | |||
.plainlist ol, | |||
.plainlist ul { | |||
line-height: inherit; | |||
list-style: none none; | |||
margin: 0; | |||
} | |||
.plainlist ol li, | |||
.plainlist ul li { | |||
margin-bottom: 0; | |||
} | |||
/* CSS Sliding Image Gallery for Mediawiki | |||
* | |||
* @author: Unknown | |||
* current version crafted together by [[User:Christharp]] from several CSS sites. | |||
*/ | |||
.wrapper { | |||
position: absolute; | |||
top: 1%; | |||
width: 4000px; | |||
-webkit-animation: 60s credits linear infinite; | |||
-moz-animation: 60s credits linear infinite; | |||
-ms-animation:60s credits linear infinite; | |||
-o-animation: 60s credits linear infinite; | |||
animation: 60s credits linear infinite; | |||
-webkit-animation-direction: normal; | |||
-moz-animation-direction: normal; | |||
-o-animation-direction: normal; | |||
-ms-animation-direction: normal; | |||
animation-direction:normal; | |||
} | |||
.wrapper img:hover { | |||
-webkit-transform: scale(1.4); | |||
-moz-transform: scale(1.4); | |||
-o-transform: scale(1.4); | |||
-ms-transform: scale(1.4); | |||
transform: scale(1.4); | |||
cursor: pointer; | |||
} | } | ||
@keyframes credits { | |||
0% { | |||
margin-left: 0px; | |||
} | |||
100% { | |||
margin-left: -4000px; | |||
} | |||
} | } | ||
@-webkit-keyframes credits { | |||
0% { | |||
margin-left: 0px; | |||
} | |||
100% { | |||
margin-left: -4000px; | |||
} | |||
} | } | ||
@-moz-keyframes credits { | |||
0% { | |||
margin-left: 0px; | |||
} | |||
100% { | |||
margin-left: -4000px; | |||
} | |||
} | } | ||
@-o-keyframes credits { | |||
0% { | |||
margin-left: 0px; | |||
} | |||
100% { | |||
margin-left: -4000px; | |||
} | |||
} | } | ||
.mw-wiki-logo { | .mw-wiki-logo { | ||