MediaWiki:Monobook.css
De Guild Wars 2 Wiki
Ir a la navegaciónIr a la búsqueda
Nota: Después de publicar, quizás necesite actualizar la caché de su navegador para ver los cambios.
- Firefox/Safari: Mantenga presionada la tecla Shift mientras pulsa el botón Actualizar, o presiona Ctrl+F5 o Ctrl+R (⌘+R en Mac)
- Google Chrome: presione Ctrl+Shift+R (⌘+Shift+R en Mac)
- Internet Explorer/Edge: mantenga presionada Ctrl mientras pulsa Actualizar, o presione Ctrl+F5
- Opera: Presiona Ctrl+F5.
/** -------- NON-CONTENT UI -------- **/
html,
body {
min-height: 100%;
height: auto !important;
}
html {
background-color: #F3F3F3;
background-image: url("/images/3/3c/Skin_footer.png"),
url("/images/b/b0/Skin_page_bg_gradient.png");
background-repeat: repeat-x, repeat-x;
background-position: left bottom -75px, left top;
}
body {
font-size: 0.8125em;
line-height: 1.538em;
width: 100%;
background: none !important;
}
body div#globalWrapper {
font-size: 100%;
background: none !important;
}
div#column-content {
background-image: url("/images/0/00/Skin_header.png");
background-position: top left;
background-repeat: no-repeat;
background-color: transparent;
width: 100%;
position: static;
min-height: 249px;
}
div#content {
margin-top: 5.2em !important;
box-shadow: rgba(0, 0, 0, 0.15) 0 0.1em 0.75em;
border: 1px solid #CCC;
border-radius: 0;
padding: 1.2em 1.5em;
border-right-width: 0;
}
#bodyContent {
padding-top: 0.1em;
position: relative;
}
/** FOOTER **/
#footer {
background-color: transparent !important;
margin-left: 12.2em !important;
padding: 1em !important;
border-width: 0 !important;
text-align: left !important;
font-size: 1em !important;
}
#footer #f-list {
margin: 0 11em 0 0;
}
#footer li {
display: block; /* for pages with a history, this prevents the "last edited" message flying about */
font-size: 0.923em;
}
#footer #f-list #privacy,
#footer #f-list #about,
#footer #f-list #disclaimer,
#footer #f-list #mobileview {
float: left;
margin-right: 1em !important;
margin-top: 0.833em !important;
}
#f-poweredbyico,
#f-copyrightico {
margin: 30px 6px 0px !important;
}
#footer #f-copyrightico a {
background-image: url("/images/0/07/ArenaNet_logo.png");
height: 47px;
width: 116px;
display: block;
}
#footer #f-copyrightico img {
display: none;
}
body:not(.skin--responsive) #f-copyrightico,
body.skin--responsive #f-copyrightico {
float: right;
}
#f-poweredbyico a {
margin-left: 0.5em;
}
div#globalWrapper,
input,
select {
font-family: Arial, sans-serif;
line-height: 1.538em;
}
input,
select {
font-size: 1em;
}
div#content #toc {
margin: 10px 0px;
}
.special li {
line-height: 1.538em;
}
span.mw-editsection {
font-family: Arial, sans-serif;
font-size: 13px !important;
vertical-align: middle;
}
/** PAGE TABS **/
body:not(.skin--responsive) #p-cactions,
body.skin--responsive #p-cactions {
font-size: 1em;
padding: 0;
margin-left: 0.7em;
margin-top: 1.7em;
width: calc(100% - (11.5em + 0.7em)); /* fill page width instead of default 76% */
z-index: 2; /* shadow for tabs */
}
/* Need to switch the above off in mobile view */
body.skin--responsive #p-cactions.mobile-menu-active {
padding: unset;
z-index: 10000;
}
body:not(.skin--responsive) #p-cactions .pBody,
body.skin--responsive #p-cactions .pBody {
font-size: 0.923em;
margin: 0;
}
#p-cactions ul {
margin: 0 0 0 1px;
list-style-type: none;
list-style-image: none;
list-style-position: outside;
}
body:not(.skin--responsive) #p-cactions li.selected,
body:not(.skin--responsive) #p-cactions li,
body.skin--responsive #p-cactions li.selected,
body.skin--responsive #p-cactions li {
padding: 0;
}
body:not(.skin--responsive) #p-cactions li,
body.skin--responsive #p-cactions li {
border: 1px solid #AAA;
border-bottom-color: #CCC;
background-color: #EEE;
display: block;
float: left;
height: 2.3em;
line-height: 2.3em;
margin: 0 0 0 -1px;
}
body:not(.skin--responsive) #p-cactions li#ca-talk,
body.skin--responsive #p-cactions li#ca-talk {
margin-right: 1.7em;
}
body:not(.skin--responsive) #p-cactions li.selected,
body.skin--responsive #p-cactions li.selected {
background-color: #FFF;
background-image: none;
border: 1px solid #CCC;
border-bottom-width: 0px;
font-weight: normal;
margin: 0 0 0 -1px;
padding-bottom: 1px !important;
overflow: visible;
}
body:not(.skin--responsive) #p-cactions li.selected a,
body.skin--responsive #p-cactions li.selected a {
color: #000;
}
body:not(.skin--responsive) #p-cactions li:hover,
body.skin--responsive #p-cactions li:hover {
background-color: #F8F8F8;
}
body:not(.skin--responsive) #p-cactions li:first-child,
body:not(.skin--responsive) #p-cactions li#special-articlefeedback,
body:not(.skin--responsive) #p-cactions li:nth-child(4),
body.skin--responsive #p-cactions li:first-child,
body.skin--responsive #p-cactions li#special-articlefeedback,
body.skin--responsive #p-cactions li:nth-child(4) {
border-top-left-radius: 0.7em;
}
body:not(.skin--responsive) #p-cactions li:nth-child(2),
body:not(.skin--responsive) #p-cactions li:last-child,
body.skin--responsive #p-cactions li:nth-child(2),
body.skin--responsive #p-cactions li:last-child {
border-top-right-radius: 0.7em;
}
body:not(.skin--responsive) #p-cactions li a,
body:not(.skin--responsive) #p-cactions li a:hover,
body:not(.skin--responsive) #p-cactions li.istalk a,
body:not(.skin--responsive) #p-cactions #ca-addsection a,
body.skin--responsive #p-cactions li a,
body.skin--responsive #p-cactions li a:hover,
body.skin--responsive #p-cactions li.istalk a,
body.skin--responsive #p-cactions #ca-addsection a {
padding: 0.6em 1em;
background: none;
}
body:not(.skin--responsive) #p-cactions li.selected a,
body.skin--responsive #p-cactions li.selected a {
background: none;
}
/** LEFT SIDEBAR **/
#p-logo {
margin: 0;
}
#p-navigation {
margin-top: 1.5em;
}
#p-navigation h3 {
display: none;
}
body:not(.skin--responsive) .portlet,
body.skin--responsive .portlet {
width: 11em;
position: relative;
font-size: 1em;
margin: 0.833em 0.5em 0.833em;
}
body:not(.skin--responsive) .portlet h5,
body:not(.skin--responsive) .portlet h3,
body.skin--responsive .portlet h5,
body.skin--responsive .portlet h3 {
color: #4D4D4D;
font-size: 1em;
font-weight: bold;
line-height: 1.333em;
text-transform: none;
display: block;
margin: 0;
padding: 0.2em 0.9em 0.5em;
width: 9.2em;
}
body:not(.skin--responsive) .portlet .pBody,
body:not(.skin--responsive) #p-search .pBody,
body.skin--responsive .portlet .pBody,
body.skin--responsive #p-search .pBody {
border: 0;
background-color: transparent;
}
body:not(.skin--responsive) .portlet .pBody,
body.skin--responsive .portlet .pBody {
margin: 0 0.5em;
padding: 0;
}
.portlet ul {
font-size: 1em;
list-style-image: none;
list-style-type: none;
margin: 0em 0em 0em 0.5em;
}
.pBody ul {
padding-inline-start: 0em;
}
.pBody li {
line-height: 1.667em;
}
body:not(.skin--responsive) #searchInput,
body.skin--responsive #searchInput {
font-size: 1em;
}
/** PERSONAL PORTLET **/
.pBody {
font-size: 0.923em;
}
#p-personal {
text-align: right;
}
body:not(.skin--responsive) #p-personal .pBody,
body.skin--responsive #p-personal .pBody {
width: auto;
display: inline-block;
padding-right: 0.75em;
border-radius: 0 0 0 0.5em;
background-color: #FFF;
margin-left: 13.2em; /* 12em plus compensation for page padding */
}
/* With responsive mode, need to undo the margin otherwise the options in the "personal" menu are invisible */
body.skin--responsive #p-personal.mobile-menu-active .pBody {
margin-left: unset;
}
body:not(.skin--responsive) #p-personal ul,
body.skin--responsive #p-personal ul {
padding-left: 0;
padding-right: 0;
line-height: 1.667em;
text-align: left;
}
#p-personal li {
font-size: 1em;
margin: 0.5em 0 0.5em 1em;
}
body:not(.skin--responsive) #p-personal li a,
body.skin--responsive #p-personal li a {
color: #002BB8;
}
#p-personal li a:hover {
/* padding: 0; -- not sure why */
background-color: transparent;
}
body:not(.skin--responsive) li#pt-userpage,
body.skin--responsive li#pt-userpage {
background: none;
padding-left: 0px !important;
}
/* References */
ol.references > li:target,
sup.reference:target,
cite:target {
background: #EEF;
}
/* Red cancel button when editing pages, and on Special:Preferences */
.editButtons span.oo-ui-buttonElement-frameless a,
#mw-prefs-restoreprefs a {
height: 33px;
border: 1px solid #CCC;
background-image: linear-gradient(180deg, #FEE 0, #FFD6D6 100%);
}
.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button > span.oo-ui-labelElement-label {
color: rgb(51, 51, 51);
}
.editButtons span.oo-ui-buttonElement-frameless a:hover {
border-color: #B55;
}
/** MOBILE LAYOUTS **/
/* Priority 1. Hide SMW and MW icons */
@media screen and (max-width: 1000px) {
#f-poweredbyico {
display: none;
}
}
/* Priority 2. Hide any special tabs */
@media screen and (max-width: 940px) {
li#special-articlefeedback,
li#special-diff {
display: none;
}
}
/* Priority 3. Hide watch and protect tabs, full width footer, and hide popups */
@media screen and (max-width: 770px) {
body:not(.skin--responsive) li#ca-watch,
body:not(.skin--responsive) li#ca-protect,
body:not(.skin--responsive) li#pt-notifications-alert,
body:not(.skin--responsive) li#pt-notifications-notice,
body:not(.skin--responsive) li#pt-watchlist,
body:not(.skin--responsive) li#utcdate,
body.skin--responsive li#ca-watch,
body.skin--responsive li#ca-protect,
body.skin--responsive li#pt-notifications-alert,
body.skin--responsive li#pt-notifications-notice,
body.skin--responsive li#pt-watchlist,
body.skin--responsive li#utcdate{
display: none;
}
}
/* Priority 4. Remove spacing between tabs, hide all page header notifications, convert to flex-box grid */
@media screen and (max-width: 670px) {
body:not(.skin--responsive) #p-cactions li#ca-talk,
body.skin--responsive #p-cactions li#ca-talk {
margin-right: 0;
}
body:not(.skin--responsive) #p-cactions li:nth-child(2),
body:not(.skin--responsive) #p-cactions li:last-child,
body:not(.skin--responsive) #p-cactions li:first-child,
body:not(.skin--responsive) #p-cactions li#special-articlefeedback,
body:not(.skin--responsive) #p-cactions li:nth-child(4),
body.skin--responsive #p-cactions li:nth-child(2),
body.skin--responsive #p-cactions li:last-child,
body.skin--responsive #p-cactions li:first-child,
body.skin--responsive #p-cactions li#special-articlefeedback,
body.skin--responsive #p-cactions li:nth-child(4) {
border-radius: 0;
}
li#pt-mycontris,
.mw-indicators {
display: none;
}
}
/* Priority 5. Move footer to left side */
@media screen and (max-width: 550px) {
#footer {
margin-left: 0 !important;
}
/* Fixes for the responsive mode popup menus */
body.skin--responsive .portlet.mobile-menu-active,
body.skin--responsive .portlet.mobile-menu-active#p-cactions,
body.skin--responsive .mobile-menu-active#sidebar-mobilejs {
width: unset;
top: 0.5em;
left: 0.5em;
padding: 1em;
margin: 0em;
}
body.skin--responsive .mobile-menu-active#sidebar-mobilejs {
font-size: 1em;
}
body.skin--responsive .mobile-menu-active ul {
padding-top: 0;
}
body.skin--responsive .portlet.mobile-menu-active li,
body.skin--responsive .portlet.mobile-menu-active#p-personal li,
body.skin--responsive .portlet.mobile-menu-active#p-cactions li,
body.skin--responsive .portlet.mobile-menu-active#p-cactions li.selected,
body.skin--responsive .mobile-menu-active#sidebar-mobilejs li {
float: unset;
margin: 5px;
line-height: unset;
border: 1px solid #AAA;
background-color: #EEE;
display: block;
height: unset;
}
body.skin--responsive .portlet.mobile-menu-active .pBody,
body.skin--responsive .portlet.mobile-menu-active#p-personal .pBody {
margin: 0;
padding: 0;
display: block;
}
body.skin--responsive .portlet.mobile-menu-active ul,
body.skin--responsive:not(.monobook-capitalize-all-nouns) .portlet.mobile-menu-active h3 {
padding: 0;
margin: 0;
}
body.skin--responsive:not(.monobook-capitalize-all-nouns) .portlet.mobile-menu-active h3,
body.skin--responsive:not(.monobook-capitalize-all-nouns) .portlet.mobile-menu-active ul li a,
body.skin--responsive:not(.monobook-capitalize-all-nouns) #p-personal.mobile-menu-active ul,
body.skin--responsive:not(.monobook-capitalize-all-nouns) #p-cactions.mobile-menu-active ul li a,
body.skin--responsive .mobile-menu-active#sidebar-mobilejs ul li a {
padding: 0.6em 1em;
text-transform: none;
width: unset;
}
}
/** -------- CONTENT GENERAL -------- **/
h1,
#bodyContent > h1 {
font-family: "EasonPro", "Times New Roman", serif !important;
font-size: 2.231em;
font-weight: normal;
line-height: 1.2em;
margin-top: 0.724em;
margin-bottom: 0.69em;
padding: 0;
}
#firstHeading {
font-size: 2.231em;
margin-top: 0;
padding: 0;
}
h2,
#bodyContent > h2 {
font-family: "EasonPro", "Times New Roman", serif !important;
font-weight: normal;
font-size: 1.923em;
line-height: 1.2em;
margin-top: 1em;
margin-bottom: 0.4em;
padding: 0;
}
h3,
#bodyContent > h3 {
font-family: Arial, sans-serif !important;
font-weight: bold;
font-size: 1.3077em;
line-height: 1.15em;
margin-top: 1.353em;
margin-bottom: 0.588em;
padding: 0;
}
h4,
#bodyContent > h4 {
font-family: Arial, sans-serif !important;
font-size: 1.154em;
font-weight: bold;
line-height: 1.1em;
margin-top: 1em;
margin-bottom: 0.667em;
padding: 0;
}
h5,
#bodyContent > h5 {
font-family: Arial, sans-serif !important;
font-size: 1em;
font-weight: bold;
line-height: 1.15em;
margin-top: 1.308em;
margin-bottom: 0.769em;
padding: 0;
}
h6,
#bodyContent > h6 {
font-family: Arial, sans-serif !important;
font-size: 0.923em;
font-weight: bold;
line-height: 1em;
margin-top: 1.5em;
margin-bottom: 0.833em;
padding: 0;
}
table.table th > h1,
table.table th > h2,
table.table th > h3,
table.table th > h4,
table.table th > h5,
table.table th > h6 {
margin-top: 0.25em;
margin-bottom: 0.25em;
border: none;
}
p,
ul,
ol,
dl {
margin-top: 0.769em;
margin-bottom: 0.769em;
line-height: 1.538em;
}
dd,
dt,
li {
margin-top: 0;
margin-bottom: 0;
line-height: 1.538em;
}
li > ul,
li > ol {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
sup,
sub {
line-height: 0;
}
textarea,
pre,
xmp,
plaintext,
listing,
*.mw-editfont-monospace,
*.mw-editfont-sans-serif,
*.mw-editfont-serif {
} {
font-size: 1.1em;
font-family: monospace;
}
pre,
xmp,
plaintext,
listing {
white-space: pre-wrap;
}
/** -------- EXTENSIONS -------- **/
/** EXTENSION:ECHO **/
.mw-echo-ui-overlay {
font-size: 1.1em;
}
/** EXTENSION:ADVANCED SEARCH **/
/* Normalise borders and shadow between inputs as far as possible */
.mw-advancedSearch-container .oo-ui-textInputWidget .oo-ui-inputWidget-input,
.mw-advancedSearch-container .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled,
.mw-advancedSearch-container .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle {
background-color: transparent;
}
.mw-advancedSearch-container .oo-ui-tagMultiselectWidget-handle {
border-radius: 0px;
}
.mw-advancedSearch-container .oo-ui-textInputWidget-type-text input,
.mw-advancedSearch-container .oo-ui-tagMultiselectWidget-handle input,
.mw-advancedSearch-container .oo-ui-dropdownInputWidget {
box-shadow: none;
}
.mw-advancedSearch-namespace-selection {
border-color: #c8ccd1;
}
/** -------- SCRIPTS -------- **/
/* ArenaNet masthead, referenced by [[MediaWiki:Common.js]] */
#upperBar {
position: absolute;
top: 0;
left: 12em;
height: 30px;
z-index: 4;
font-size-adjust: 0.52;
}
#upperBar ul {
padding: 0px;
margin: 0px;
list-style: none;
}
#upperBar ul li {
margin: 0;
padding: 0px;
display: inline-block;
font-family: "EasonPro", "Times New Roman", "serif";
}
#upperBar ul li a {
color: #F9F1E2;
text-transform: uppercase;
font-size: 12px;
padding: 8px 10px;
line-height: 2.6;
}
#upperBar ul li a:hover {
text-decoration: none;
color: white;
}
#upperBar ul li a:hover {
background: url(/images/c/c7/Masthead_hover_background.png) no-repeat 0 -30px;
}
#upperBar ul li:nth-child(1) a:hover {
background-position: -121px -30px;
}
#upperBar ul li:nth-child(2) a:hover {
background-position: -206px -30px;
}
#upperBar ul li:nth-child(3) a:hover {
background-position: -274px -30px;
}
/* Hide ArenaNet upperbar elements below certain screen widths to prevent interaction with personal nav */
@media screen and (max-width:1120px) {
#upperBar li:nth-child(3) {
display: none;
}
}
@media screen and (max-width:1040px) {
#upperBar li:nth-child(2) {
display: none;
}
}
@media screen and (max-width:960px) {
#upperBar li:nth-child(1) {
display: none;
}
}
/* Chat link search, for [[MediaWiki:ChatLinkSearch.js]] */
.gw2w-chat-link-search {
background: #F3F3F3;
border: 1px solid #C0C0C0;
}
/** -------- WIDGETS -------- **/
/** Generic widgets - Interactive maps with leaflet plugin **/
/* Overwrite default MW responsive skin rule which has the effect of hiding map tiles at low widths */
@media screen and (max-width: 550px) {
body.skin--responsive .monobook-body .leaflet-container img {
max-width: unset !important;
}
}
/** -------- SPECIAL PAGES -------- **/
/* Special:Search */
.mw-search-exists {
background-image: linear-gradient(to bottom, #F0FBE1 0%, #C3E59A 100%);
border: 1px solid #B8D892;
}
/* action=history */
.mw-pager-body ul {
margin-top: 0;
margin-bottom: 0;
}
.mw-pager-body li {
margin-top: 0.2em;
}
/** -------- INDIVIDUAL PAGES -------- **/
/** MAIN PAGE **/
.mainpage-background-wrapper {
overflow-x: hidden;
background: url("/images/8/84/Main_page_background_left_%28Secrets_of_the_Obscure%29.png") top +50px left -30px/auto 600px no-repeat,
url("/images/3/38/Main_page_background_right_%28Secrets_of_the_Obscure%29.png") bottom +0px right -375px/auto 600px no-repeat,
#FFF;
}
body.action-view.page-Main_Page #content,
body.action-view.page-Main_Page_editcopy #content {
padding: 0em 0em 1.2em 0em;
}
.mainpage-banner > p {
font-family: EasonPro, Helvetica, Arial, sans-serif;
font-size: 1.8375em;
text-align: center;
}
.mainpage-banner > p > span {
position: relative;
bottom: 2px;
}
.mainpage-banner,
.mainpage-cell,
#editcopylink {
background: rgba(255, 255, 255, 0.85);
}
#mainpage-content {
font-family: CronosPro, Arial, Helvetica, sans-serif;
font-size: 1.225em;
}
.mainpage-cell-wrapper {
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
flex-wrap: wrap;
justify-content: center;
max-width: 96em;
margin: 0 auto;
padding-right: 0.5em;
}
.mainpage-cell {
margin: 0.5em 0em 0em 0.5em;
padding: 0.5em;
width: 21em;
border: 1px solid rgba(172, 121, 105, 0.5);
box-sizing: border-box;
}
.mainpage-cell.mainpage-cell-double {
width: 42.5em;
}
.mainpage-cell h2 {
line-height: 1.5em;
font-size: 1.75em;
margin: 0em 0em 0.5em;
}
.mainpage-cell a {
white-space: nowrap;
}
.mainpage-cell a.external {
white-space: normal;
}
.mainpage-cell dl {
margin-top: 0;
margin-bottom: 0;
}
.mainpage-featured-images {
overflow-x: hidden;
}
#editcopylink {
font-size: 0.8em;
font-style: italic;
text-align: right;
margin-top: 1em;
}
#editcopylink span {
margin-right: 2em;
}
/* Hide right background image if it would interfere with left image */
@media only screen and (max-width: 70em) {
.mainpage-background-wrapper {
background: url("/images/8/84/Main_page_background_left_%28Secrets_of_the_Obscure%29.png") top +50px left -30px/auto 600px no-repeat,
#FFF;
}
}
/* Hide featured images and set cells to full width if page width is less than two columns wide */
@media only screen and (max-width: 54.5em) {
.mainpage-featured-images {
display: none;
}
.mainpage-cell,
.mainpage-cell:first-of-type {
width: 100%;
}
}
/** -------- TEMPLATES: TABLES -------- **/
/** -------- TEMPLATES: OTHER -------- **/
/* Patch notes for skill history project */
.skill-history {
border-color: #AAA;
background-color: #F6F3E4;
}
/* [[Plantilla:Archive-box]] and [[Plantilla:Correo]] */
.archive-box {
border-color: #EA3;
background-color: #FFC;
}
.mail {
border: 1px solid silver;
background: #FFF8E8;
}
/* White rows for achievement tables where alternating light-dark rows don't work so well */
.white {
background-color: white;
}
.offwhite {
background-color: #E8F0F8;
}
/* Weekly/daily rotation data templates */
.highlight-yellow {
background-color: yellow !important;
}
.highlight-blue {
background-color: lightblue !important;
}
