MediaWiki:Common.css

/***********************************************************************/ /******************************* Imports *******************************/ /***********************************************************************/ @import url("https://fonts.googleapis.com/css?family=Black+Ops+One|Exo+2:400,400i,700,700i|Fredoka+One|Kreon|Lobster+Two:400,700|PT+Serif+Caption|PT+Serif|Righteous|Teko"); @import url("/load.php?mode=articles&only=styles&articles=MediaWiki:MMW.css|MediaWiki:Staff.css|MediaWiki:Themes.css|u:dev:MediaWiki:AL.css|u:dev:MediaWiki:ContribsButtons.css|u:dev:InterlanguageFlags/code.css|u:dev:MediaWiki:PrettyUserTags.css|u:diepio:MediaWiki:Global.css"); /***********************************************************************/ /****************************** Doc & ToC ******************************/ /***********************************************************************/ /* DOCUMENTATION * @Author:        TheGoldenPatrik1 * @Contributors:  Ursuul, ThePokegeek5000 /* SECTION A - General * Subsection 1 - User Tags * Subsection 2 - Template Restyling * Subsection 3 - Rail Module Styling * Subsection 4 - Miscellaneous /* SECTION B - Specific * Subsection 1 - Rewards Page Tables * Subsection 2 - Tabber Styling for Detail Div * Subsection 3 - Main Page

/***********************************General*****************************/

/***********************************************************************/ /******************************** User Tags ****************************/ /***********************************************************************/

/* Staff */ .UserProfileMasthead .masthead-info .tag-container .tag.usergroup-sysop { background: #0099FF; color: #000000; border-color: #0099FF; }/**/

/* Non-Staff */ .UserProfileMasthead .masthead-info .tag-container .tag.usergroup-fs { background: #C0C0C0; color: #000000; border-color: #C0C0C0; }

.UserProfileMasthead .masthead-info .tag-container .tag.usergroup-ef { background: #000000; color: #FFFFFF; border-color: #000000; }

.UserProfileMasthead .masthead-info .tag-container .tag.usergroup-hi, .UserProfileMasthead .masthead-info .tag-container .tag.usergroup-alt, .tag.usergroup-hi, .tag.usergroup-alt { background: #FFFFFF; border-color: #FFFFFF; }

.UserProfileMasthead .masthead-info .tag-container .tag.usergroup-vip { background: #2B662B; color: #FFFFFF; border-color: #26996E; }/**/

/***********************************************************************/ /************************** Template Restyling *************************/ /***********************************************************************/

/* Tables */ .article-table { border-radius: 1.1em; } .article-table th:first-child { border-radius: 1em 0 0 0; } .article-table th:last-child { border-radius: 0 1em 0 0; } .article-table tbody:last-child tr:last-child td, .article-table thead:last-child tr:last-child th { border-bottom: 0; }/**/

/* WDS */ .custom-wds-wrapper a { text-decoration: none; }

.custom-wds.wds-is-secondary.wds-button { color: #006400; border-color: #006400; } .custom-wds.wds-is-secondary.wds-button:hover { color: #32CD32; border-color: #32CD32; }/**/

/* ContribsButtons */ body.mw-special-Contributions #VSTFReportButtons .VSTFReportButton, body.mw-special-Contributions #contentSub:not(.contentSub) a, body.mw-special-Contributions #contentSub #contentSubSub a { background: #006400; } body.mw-special-Contributions #VSTFReportButtons .VSTFReportButton:active, body.mw-special-Contributions #VSTFReportButtons .VSTFReportButton:focus, body.mw-special-Contributions #VSTFReportButtons .VSTFReportButton:hover, body.mw-special-Contributions #contentSub:not(.contentSub) a:active, body.mw-special-Contributions #contentSub:not(.contentSub) a:focus, body.mw-special-Contributions #contentSub:not(.contentSub) a:hover, body.mw-special-Contributions #contentSub #contentSubSub a:active, body.mw-special-Contributions #contentSub #contentSubSub a:focus, body.mw-special-Contributions #contentSub #contentSubSub a:hover { background: #32CD32; }/**/

/***********************************************************************/ /************************* Rail Module Styling *************************/ /***********************************************************************/

/* Wiki Updates Module */ .WikiaRail #custom-rail-bloglist .WikiaBlogListingBox { background: transparent !important; border: none; margin-top: -2px; overflow: hidden; } .WikiaRail #custom-rail-header { margin-bottom: 2px; } .WikiaRail #custom-rail-bloglist .more, .WikiaRail #custom-rail-bloglist .WikiaBlogListingBox h2 { display: none; } .WikiaRail #custom-rail-bloglist .author-details h2 { display: initial; border-bottom: none; } .WikiaRail #custom-rail-bloglist .WikiaBlogListingBox ul .WikiaBlogListingPost:first-child { margin-top: -20px; } .WikiaRail #custom-rail-bloglist .WikiaBlogListingBox ul .WikiaBlogListingPost { height: 60px; } .WikiaRail #custom-rail-bloglist .WikiaBlogListingBox ul { margin-top: 0; margin-bottom: 0; margin-left: -14px; } body.page-Special_WikiActivity.WikiaBlogListingBox ul .WikiaBlogListingPost:first-child { margin-top: -30px; } .WikiaBlogListingBox .wikia-button { display: none; } .WikiaRail #custom-rail-bloglist { padding-bottom: 12px; } .WikiaRail #custom-rail-bloglist .WikiaBlogListingBox.module { padding-bottom: 0; margin-bottom: 0; }/**/ /* Rail Restyling */ .WikiaRail .rail-module, .WikiaRail #cql-module, .WikiaRail .custom-cql#mwModule, margin: 0 10px 30px; border: 5px solid #525252; border-radius: 15px; background: transparent; } .WikiaRail .rail-module h2, .WikiaRail #cql-module > h2, .WikiaRail .custom-cql#mwModule > h2, .WikiaRail #myhome-community-corner-content h2 { padding-top: 5px; text-align: center; border-bottom: none; } .WikiaRail #custom-rail-discord { text-align: center; font-size: 110%; padding-bottom: 10px; }
 * 1) WikiaRail > .module {
 * 1) WikiaRail > .module > h2,

.WikiaRail .rail-module.chat-module { padding: 10px; } .WikiaRail a #custom-wds-rail { padding-left: 5px; padding-right: 5px; } .WikiaRail .rail-module.activity-module { padding: 7px; }

.WikiaRail .rail-module, .WikiaRail .module { box-sizing: border-box; zoom: initial; }/**/

/* WDS */ .WikiaRail .wds-button.wds-is-secondary.wds-button, .WikiaRail .wds-button.wds-is-text.wds-button { border-color: #006400; color: #006400; } .WikiaRail .rail-module .wds-button.wds-is-secondary.wds-button:hover, .WikiaRail .rail-module .wds-button.wds-is-text.wds-button:hover { color: #32CD32; border-color: #32CD32; }/**/ /* Medals */ .rail-module.RewardModule > .RewardContainer { padding: 0 0 30px 0 !important; }/**/

/***********************************************************************/ /****************************** Miscellaneous **************************/ /***********************************************************************/

/* Code Restyling */ code { background-color: #F2F2F2; border: 1px solid #CCC; padding: 1px 4px; }/**/

/* AlternatingLists */
 * root {

--al-ol2-type: lower-alpha; }/**/

/******************************* Specific ******************************/

/***********************************************************************/ /************************* Rewards Page Tables *************************/ /***********************************************************************/

.re-tab .re-lab-name { width: 19%; }

.re-tab .re-lab-desc { width: 20%; }

.re-tab .re-lab-imag { width: 17%; }

.re-tab .re-lab-reci { width: 44%; }

.re-tab .re-val-name { font-weight: bold; font-size: larger; }

.re-tab .re-val-imag img { width: 110px; height: 110px; border-radius: .4em; }

.re-tab .re-val-name, .re-tab .re-val-imag, .re-tab .re-val-reci { text-align: center; }/**/

/***********************************************************************/ /******************** Tabber Styling for Detail Div ********************/ /***********************************************************************/

.detail ul.tabbernav { border-bottom: 0 solid #525252 !important; font-family: "Helvetica", sans-serif !important; font-weight: bold !important; padding-top: 5px !important; padding-bottom: 2px !important; margin-bottom: 0 !important; margin-left: 0 !important; } .detail .tabbernav { display: flex; line-height: 18px !important; } .detail ul.tabbernav li.tabberactive a { background: linear-gradient(180deg, #6C8255 0%, #6C8255 50%, #768F5A 51%, #768F5A 100%) !important; font-weight: bold; border-bottom: 0 !important; border-top: 2px solid #525252 !important; border-right: 2px solid #525252 !important; border-left: 2px solid #525252 !important; font-family: "Ubuntu"; text-shadow: none !important; } .detail ul.tabbernav li a { white-space: nowrap; background: linear-gradient(180deg, #768F5A 0%, #768F5A 50%, #6C8255 51%, #6C8255 100%) !important; border-radius: 5px 5px 0 0; margin-left: 5px; padding: 5px; border-top: 2px solid #525252 !important; border-right: 2px solid #525252 !important; border-left: 2px solid #525252 !important; color: #EFEFEF !important; font-family: "Ubuntu"; font-weight: bold; } .detail .tabberlive .tabbertab { border-radius: 5px 5px 5px 5px; border-top: 0; border: 2px solid #525252; } .detail h3 { margin-left: -5px; margin-right: -5px; padding-left: 10px; font-style: italic; font-weight: 500; } .detail .editsection, .detail .toc-link { display: none; } .OPS { margin-left: -5px; margin-right: -5px; padding-left: 10px; font-style: italic; }/**/

/***********************************************************************/ /****************************** Main Page ******************************/ /***********************************************************************/

/* NavButton */ .navButton { position: relative; overflow: hidden; text-align: center; border: 2px solid #5E5E5E; border-radius: 10px; margin: 10px; } .navButton.inner:active { background: transparent !important;/* necessary */ opacity: 0.5; } .navButton.inner { width: 100%; height: 100%; margin-top: -5px; margin-left: -5px; } .navButton.outer { width: 120px; height: 120px; } .navButton.clickable-div a { position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; } .navButton.clickable-div a > img { width: 100%; height: 100%; } .navButton.clickable-div a > img:hover { background: rgba(255, 255, 255, 0.15); } .navButton.clickable-div a > img:active { background: none; }/**/

/* Disabling unnecessary Fandom CSS & Tags for a consistent layout */ .mp-d p:first-child { display: initial; } @media only screen and (max-width: 1023px) { .main-page-tag-rcs .module { box-sizing: initial; display: inline-block; margin: 0; vertical-align: initial; width: 90%; }   .main-page-tag-rcs { padding: 5px 0 0 0; width: 100%; }   .mp-d p:last-child { display: initial }   .mp-module-padding.mp-module-month { padding: 10px 16.3px 2px; } }/**/ /* Default Modules */ .mp-module { overflow: hidden; } .mp-module-width { width: 95%; } .mp-module-background { background: #393939; background: rgba(255, 255, 255, 0.03); } .mp-module-border { border: 1px solid #767676; } .mp-module-float { float: left; } .mp-module-padding { padding: 20px 15px 15px; } .mp-module-margin:not(.mp-blog2):not(.mp-module-month) { margin-bottom: 6px; } .mp-module-icons { display: flex; flex-wrap: wrap; justify-content: center; }/**/ /* The D */ .mp-d .embeddable-discussions-module .embeddable-discussions-threads { display: flex; flex-direction: column; } .mp-d .embeddable-discussions-module .embeddable-discussions-threads > *:only-child { align-self: center; font-family: "Ubuntu"; } .mp-d .embeddable-discussions-module { background: transparent !important; padding: 15px 14px 5px 15px; margin: 0; } .mp-d .embeddable-discussions-show-all { display: none; } .mp-d .embeddable-discussions-heading-container { justify-content: center; border-bottom: 2px solid #000000; } .mp-d .embeddable-discussions-heading p:first-child { font-family: "Ubuntu"; font-size: 25px; font-weight: bold; color: #000000; text-shadow: none; } .mp-d .embeddable-discussions-module .embeddable-discussions-heading { padding-bottom: 10px; } .mp-d .embeddable-discussions-module .embeddable-discussions-post-detail { background: transparent !important; color: #000000; padding-top: 10px; border-color: #767676; margin-bottom: 5px; } .mp-d .embeddable-discussions-module .embeddable-discussions-threads { padding-top: 0; } .mp-d .embeddable-discussions-upvote-area:hover path, .mp-d .embeddable-discussions-post-counter:first-child path, .mp-d .embeddable-discussions-post-counter:first-child, .mp-d .embeddable-discussions-upvote-area:hover a[href*="/votes/"] { fill: #E3BD00; color: #E3BD00; text-decoration: none; } .mp-d .embeddable-discussions-replies-area:hover path, .mp-d .embeddable-discussions-post-counter:nth-child(2) path, .mp-d .embeddable-discussions-post-counter:nth-child(2), .mp-d .embeddable-discussions-replies-area:hover a[href*="/d/p/"] { fill: #44C4FF; color: #44C4FF; text-decoration: none; } .mp-d .embeddable-discussions-module .avatar-details { display: flex; } .mp-d .embeddable-discussions-module .embeddable-discussions-timestamp { font-size: 8px; }/**/

/* MP Blog */ .mp-blog .WikiaBlogListingBox ul { border: 0; } .mp-blog .WikiaBlogListingBox ul .WikiaBlogListingPost { padding: 0 0 10px; border: 0; margin: 0; } .mp-blog .WikiaBlogListingBox ul .WikiaBlogListingPost:last-child { padding: 0; } .mp-blog .WikiaBlogListingBox .WikiaBlogListingPost .author-details { margin: 0; } .mp-blog .author-details h2 a { font-size: medium; } .mp-blog .author-details span > a, .mp-blog .author-details span { font-size: 12px; } .mp-blog .WikiaBlogListingBox .post-summary { visibility: hidden; padding: 0; } .mp-blog .WikiaBlogListingPost > .avatar, .mp-blog .WikiaBlogListingBox > h2, .mp-blog .WikiaBlogListingBox > a { display: none; }/**/

/***********************************************************************/ /****************************** Keyframes ******************************/ /***********************************************************************/

/* Loader Border */ @keyframes loader-border { 0% {       transform: rotate(0deg); }   25% {        transform: rotate(180deg); }   50% {        transform: rotate(180deg); }   75% {        transform: rotate(360deg); }   100% {        transform: rotate(360deg); } } @-o-keyframes loader-border { 0% {       transform: rotate(0deg); }   25% {        transform: rotate(180deg); }   50% {        transform: rotate(180deg); }   75% {        transform: rotate(360deg); }   100% {        transform: rotate(360deg); } } @-webkit-keyframes loader-border { 0% {       transform: rotate(0deg); }   25% {        transform: rotate(180deg); }   50% {        transform: rotate(180deg); }   75% {        transform: rotate(360deg); }   100% {        transform: rotate(360deg); } } @-moz-keyframes loader-border { 0% {       transform: rotate(0deg); }   25% {        transform: rotate(180deg); }   50% {        transform: rotate(180deg); }   75% {        transform: rotate(360deg); }   100% {        transform: rotate(360deg); } }/**/