GW2Wiki:Proyectos/CSS/noncontent ui- monobook
De Guild Wars 2 Wiki
< GW2Wiki:Proyectos | CSS
Ir a la navegaciónIr a la búsqueda
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/b/b1/Skin_header_(Janthir_Wilds).png"); background-size: 1050px; 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; } }