User:Welpington/common.css

/** * * @title           PseudoMonobook * @description    Introduces Monobook visual design cues to the Oasis skin. * @author         Speedit * @version        1.3.10 * @license        CC-BY-SA 3.0 * */ /** * @section        Skin container styling * @element        .WikiaSiteWrapper */ .skin-oasis:not(.editor):not(.ooui-theme-fandom) .WikiaSiteWrapper { padding-left: 150px; } .skin-oasis.ooui-theme-fandom .WikiaSiteWrapper { width: 100%; } .skin-oasis .WikiaPage, .skin-oasis .wds-global-footer { margin: 0; min-width: 758px; width: 100%; } .skin-oasis:not(.editor) .WikiaPage { box-sizing: border-box; padding: 0 20px; } .skin-oasis.ooui-theme-fandom .WikiaPage { box-sizing: border-box; padding-left: 150px; } .ve-active .skin-oasis.ooui-theme-fandom .WikiaPage { padding-left: 0; } .skin-oasis .WikiaPage .WikiaPageContentWrapper { padding-top: 38px; } .ve-active .skin-oasis.ooui-theme-fandom .WikiaPage .WikiaPageContentWrapper { padding-top: 0; } @media only screen and (max-width: 1313px) { .skin-oasis:not(.editor) .wds-global-footer { padding: 0 25px; } } @media only screen and (max-width: 1243px) { .skin-oasis .WikiaMainContent { width: 100%; }   .skin-oasis .WikiaRail, .skin-oasis .main-page-tag-rcs { box-sizing: border-box; clear: both; column-count: 2; float: none; padding: 13px 10px 0; width: auto; } } .skin-oasis:not(.editor) #WikiaBarWrapper { width: calc(100% - 150px); } .skin-oasis.ooui-theme-fandom #WikiaBarWrapper { right: 0; } .ve-active .ooui-theme-fandom .ve-ui-summaryPanel { width: 100% !important; } /** * @subsection     Modal fix styling * @element        .WikiaSiteWrapper * @see            https://github.com/Wikia/app/blob/release-778.001/resources/wikia/ui_components/modal/css/modal_default.scss#L214-L236 */ .skin-oasis:not(.editor).with-blackout .WikiaSiteWrapper.fake-scrollbar { overflow-y: hidden; position: static; width: auto; } /** * @section        Typography reversion (by OneTwoThreeFall) * @see            https://dev.wikia.com/wiki/AntiBigText */ @media only screen and (min-width: 1596px) { /* typography */ .WikiaMainContentContainer h1 { font-size: 28px; line-height: 28px; }   .WikiaMainContentContainer h2 { font-size: 20px; line-height: 22px; }   .WikiaMainContentContainer h3 { font-size: 17px; line-height: 22px; }   .WikiaMainContentContainer h4, .WikiaRail .rail-module h4, .WikiaRail .module h4 { font-size: 15px; line-height: 22px; }   .WikiaMainContentContainer .WikiaArticle { font-size: 14px; line-height: 22px; }   /* fixes for other breakpoint-affected styles */ .WikiaPage .WikiaArticle .infobox, .WikiaPage blockquote { font-size: inherit; line-height: inherit; }   .WikiaArticleComments h1 { font-size: 22px; }   .WikiaRail .rail-module h2, .WikiaRail .module h2 { line-height: 22px; } } /** * @section        Banner notification styling * @element        .wds-banner-notification__container */ .skin-oasis .wds-banner-notification__container { width: 100%; } .skin-oasis:not(.editor) .wds-banner-notification__container.float { margin-left: calc(150px - 50%); width: calc(100% - 150px); } .skin-oasis .wds-banner-notification__container .wds-banner-notification { display: flex; align-items: center; } .skin-oasis .wds-banner-notification__container .wds-banner-notification__icon { min-width: 44px; align-self: stretch; } .skin-oasis .wds-banner-notification__container .wds-banner-notification__text, .skin-oasis .wds-banner-notification__container .wds-banner-notification__close { padding: 10px 12px; } /** * @section        Ad & recirculation removal * @element        .wikia-ad */ .skin-oasis .WikiaSiteWrapper #WikiaTopAds, .skin-oasis .wds-global-navigation .wds-global-navigation__link, .skin-oasis .mw-content-text .home-top-right-ads, .skin-oasis .WikiaPage #WikiaArticleBottomAd, .skin-oasis .WikiaPage #mixed-content-footer, .skin-oasis .WikiaRail #WikiaAdInContentPlaceHolder, .skin-oasis .WikiaRail .side-articles.fandom-stories, .skin-oasis .wikia-ad, .skin-oasis .wds-global-footer .wds-global-footer__fandom-sections, .skin-oasis .wds-global-footer .wds-global-footer__wikia-section.wds-is-follow-us { display: none !important; } /** * @section        Global navigation styling * @element        .wds-global-navigation */ .skin-oasis .wds-global-navigation { left: 0; right: 0; } /** * @section        Community header styling * @element        .wds-community-header * @modifier       wordmark * @type           descendant */ .skin-oasis:not(.editor) .wds-community-header { background-image: none !important; background-size: auto; display: flex; flex-flow: column nowrap; height: calc(100% - 55px); margin: 0; top: 55px; left: 0; position: absolute; width: 150px; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wordmark { float: none; height: auto; margin: 68px auto 20px; max-width: 110px; } /** * @subsection     Community header wiki styling * @element        .wds-community-header * @modifier       top-container * @type           descendant */ .skin-oasis:not(.editor) .wds-community-header .wds-community-header__top-container { flex-flow: column; height: auto; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__top-container:first-child { margin-top: 65px; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__sitename { margin: 0 20px 20px; text-align: center; text-overflow: initial; white-space: normal; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__sitename a { font-size: 14px; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__counter { display: none; } /** * @subsection     Community header navigation styling * @element        .wds-community-header * @modifier       local-navigation * @type           descendant */ .skin-oasis:not(.editor) .wds-community-header .wds-community-header__local-navigation { flex-flow: column nowrap; margin-top: 0; padding: 0; position: sticky; top: 55px; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__local-navigation .wds-tabs { flex-flow: column; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__local-navigation .wds-tabs__tab, .skin-oasis:not(.editor) .wds-community-header .wds-community-header__local-navigation .wds-dropdown { width: 100%; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__local-navigation .wds-tabs__tab-label { font-size: 12px; justify-content: center; margin: 0 auto; white-space: normal; width: 100%; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__local-navigation .wds-dropdown__toggle-chevron { position: absolute; right: 8px; transform: rotate(270deg); } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__local-navigation .wds-dropdown:hover .wds-dropdown__toggle-chevron { transform: rotate(90deg); } /** * @subsection     Community header dropdown styling * @element        .wds-community-header .wds-dropdown * @type           descendant */ .skin-oasis:not(.editor) .wds-community-header .wds-dropdown::after, .skin-oasis:not(.editor) .wds-community-header .wds-dropdown::before { bottom: auto; top: 12px; transform: rotate(270deg); } .skin-oasis:not(.editor) .wds-community-header .wds-dropdown::after { left: calc(100% - 7px); } .skin-oasis:not(.editor) .wds-community-header .wds-dropdown::before { left: calc(100% - 8px); top: 11px; } .skin-oasis:not(.editor) .wds-community-header .wds-dropdown__content { top: 0; right: auto; left: 100%; } /** * @subsection     Community header tool styling * @element        .wds-community-header * @modifier       wiki-buttons * @type           descendant */ .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons { justify-content: stretch; margin: 1px; position: absolute; top: 0; width: 150px; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-button { border-radius: 0; border-top: none; flex: 1; padding: 9px 0; margin: 0 0 0 -1px; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-button:first-child { border-left: none; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-button svg { margin: 0; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-button span { display: none; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-dropdown { display: flex; flex: 1; position: static; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-dropdown::after, .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-dropdown::before { display: none; } .skin-oasis:not(.editor) .wds-community-header__wiki-buttons .wds-dropdown__content { border-radius: 0; left: calc(100% - 1px); padding: 0; top: -1px; width: calc(100vw - 150px); } .skin-oasis:not(.editor).ns--1 .wds-community-header__wiki-buttons .wds-dropdown__content, .skin-oasis:not(.editor).ns-3 .wds-community-header__wiki-buttons .wds-dropdown__content, .skin-oasis:not(.editor).ns-500:not(.MiniEditor) .wds-community-header__wiki-buttons .wds-dropdown__content, .skin-oasis:not(.editor).ns-1200 .wds-community-header__wiki-buttons .wds-dropdown__content, .skin-oasis:not(.editor).ns-1201 .wds-community-header__wiki-buttons .wds-dropdown__content, .skin-oasis:not(.editor).ns-2000 .wds-community-header__wiki-buttons .wds-dropdown__content { display: inline-block; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-list { display: flex; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-list > li { margin: 0; } .skin-oasis:not(.editor) .wds-community-header .wds-community-header__wiki-buttons .wds-list > li > a { font-size: 10px; font-weight: bold; line-height: 1em; padding: 13px 12px; text-transform: uppercase; } /** * @section        Page header contribution button styling * @element        .page-header * @modifier       contribution-buttons * @type           descendant */ .skin-oasis .WikiaPage .page-header { position: static; } .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-button-group { position: absolute; top: 0; left: -20px; right: -24px; } .skin-oasis.ooui-theme-fandom .WikiaPage .page-header .page-header__contribution-buttons .wds-button-group { left: 150px; right: 0; top: 55px; } .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-button { border-radius: 0; } .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-dropdown__content { padding: 0; position: static; display: flex; flex: 1; border-radius: 0; } .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-dropdown { display: flex; flex: 1; } .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-dropdown__toggle, .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-dropdown:before, .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-dropdown:after { display: none; } .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-list { display: flex; flex-flow: row nowrap; overflow: hidden; } .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-list > li { margin: 0; } .skin-oasis .WikiaPage .page-header .page-header__contribution-buttons .wds-list > li > a { padding: 11px 12px; font-size: 10px; text-transform: uppercase; font-weight: bold; } /** * @section        Content modifications * @element        .WikiaMainContent */ .skin-oasis .WikiaMainContent .featured-video__wrapper, .skin-oasis #mw-content-text .jwplayer-in-article-video { max-height: 396px; margin: 0 auto; max-width: 704px; } .skin-oasis .WikiaMainContent .CommunityPageMainContent .community-page-cards-module, .skin-oasis .WikiaMainContent .CommunityPageMainContent .community-page-todo-list-module { max-width: auto; } /** * @section        Global footer modifications * @element        .wds-global-footer */ .skin-oasis .wds-global-footer__main { flex-direction: row; margin: 0 auto; padding-bottom: 5px; zoom: 0.85; } .skin-oasis .wds-global-footer .wds-global-footer__header { height: 36px; display: flex; zoom: .85; padding: 40px 0; } .skin-oasis .wds-global-footer .wds-global-footer__header-logo { height: 36px; } .skin-oasis .wds-global-footer__fandom-sections, .skin-oasis .wds-global-footer__wikia-sections { align-content: flex-start; order: 4; width: 720px; margin: 0 auto; } .skin-oasis .wds-global-footer .wds-global-footer__bottom-bar { min-height: 3em; } .skin-oasis .wds-global-footer .wds-global-footer__bottom-bar-row { padding: 10px 0; } .skin-oasis:not(.editor):not(.ooui-theme-fandom) .wds-global-footer .wds-global-footer__bottom-bar { margin: 0 -25px; } @media only screen and (max-width: 1313px) { .skin-oasis .wds-global-footer .wds-global-footer__wikia-section { margin-right: 25px; flex: 1; width: 25%; }   .skin-oasis .wds-global-footer .wds-global-footer__wikia-section.wds-is-community-apps .wds-global-footer__links-list { flex-direction: column; }   .skin-oasis .wds-global-footer .wds-global-footer__wikia-section.wds-is-community-apps .wds-global-footer__links-list-item { margin: 0; }   .skin-oasis .wds-global-footer .wds-global-footer__wikia-section.wds-is-create-wiki, .skin-oasis .wds-global-footer .wds-global-footer__wikia-section.wds-is-advertise { display: none !important; }   .skin-oasis .wds-global-footer__wikia-sections .wds-global-footer__links-list-item { margin-bottom: 8px; } } /** **/