MediaWiki:Mainpage.css

/* =================================  October 2018 mainpage design in    collaboration with Nickelodeon. Please see Thread:183692 for discussion with community.

Elements affecting just the mainpage ================================= */

/* Font theory

Rubik for most things ITC Stenberg for headers

/* PLEASE DO NOT REMOVE THE FOLLOWING STATEMENT:

This CSS resource incorporates links to font software which is the valuable copyrighted property of Monotype and/or its suppliers. You may not attempt to copy, install, redistribute, convert, modify or reverse engineer this font software. Please contact Monotype with any questions regarding Web Fonts: https://www.linotype.com

@font-face { font-family:"ITC Stenberg"; src:url("https://images.wikia.nocookie.net/czech-prey-out/images/4/4a/7e413ee3-ffa0-41da-88fd-7eb4508b4f77.woff") format("woff"); }

/* Color theory

#78C156 - Local navigation header/buttons/toolbar. Pale green. #FDAD34 - Section headers, background skin. Yellow-orange. #FFFFFF - Page backgrounds #1f5d04 - Links. AAA contrast ratio of ~8.

/* ==========================  General mainpage qualities ========================== */ .mainpage h1.page-header__title { display:none } .mainpage-wrap { /* placeholder */ } .mainpage-wrap a, .mainpage-wrap a.visited, .mainpage-wrap a.link { /* placeholder */ } .mainpage-wrap .wikia-gallery-caption-below .lightbox-caption a:visited, .mainpage-wrap .wikia-gallery-caption-below .lightbox-caption a:link, .mainpage-wrap .wikia-gallery-caption-below .lightbox-caption { font-family:"Rubik"; font-size:14px; font-weight:bold; text-decoration:none; line-height:150%; } .mainpage ficaption p.title, .mainpage .article-thumb figcaption { /* placeholder */ } .mainpage .article-thumb { margin-top:0px; } .mainpage .wikia-gallery-item .title { /* placeholder */ } .mainpage .wikia-gallery-item .lightbox-caption { line-height:150%; font-size:14px; text-align:left; background:transparent; } .mainpage-box-characters .wikia-gallery-item .lightbox-caption { text-align:center; } /* Tabber, in general */ .mainpage ul.tabbernav { font:inherit; text-transform:uppercase; padding:0; } .mainpage ul.tabbbenav li { text-transform:uppercase; background-color:#ececec; color:#000; border-color:#FDAD34; } .mainpage ul.tabbernav li a { background-color:#ececec; color:#000!important; } .mainpage ul.tabbernav li a:hover { border-color:#FDAD34; background-color:#FDAD34; } .mainpage ul.tabbernav li.tabberactive a:hover, .mainpage ul.tabbernav li.tabberactive a { background-color:#FDAD34; color:#000; border-color:#FDAD34; } /* Buttons, in general */ .mainpage .button { -moz-border-radius:0; -webkit-border-radius:0; border-radius:0; border:none; font-family:Rubik; font-weight:bold; letter-spacing:1px; text-transform:uppercase; background-image:none; background-color:#FDAD34; padding:5px; } .mainpage .button a { color:#000; text-decoration:none; } .mainpage .button:hover { background-color:#000; color:#FDAD34; } .mainpage .button a:hover { color:#FDAD34; text-decoration:none; } /*====================  MODULES =====================*/

/* Left rail */ .mainpage-box-welcome, .mainpage-box-characters, .mainpage-box-episodes, .mainpage-box-about-wiki, .mainpage-box-browse, .mainpage-box-DYK, .mainpage-box-news, .mainpage-box-about-tmnt { width:670px; margin:70px auto; } /* News */ .mainpage-box-news li a, .mainpage-box-news li a:visited { /* Placeholder */ } /* Rise */ .mainpage-box-episodes .logo { margin:40px 0; } .episode-grid { margin:0 auto; } .episode-grid img.lzyTrns { border:5px solid #FDAD34; } /* Browse */ .mainpage-portal { padding:10px; } .portal-grid { margin-bottom:20px; text-align:center; }

/* Left rail exceptions */ .mainpage-box-welcome { text-align:center; margin-top:0; margin-bottom:20px; } .mainpage-box-characters { text-align:center; } /* Right rail */ .mainpage-box-twitter, .mainpage-box-featured-article, .mainpage-box-poll, .mainpage-box-quiz, .mainpage-box-quote, .mainpage-box-other-wikis { margin:20px auto; } .mainpage-box-twitter .tabber .tabbertab { border:5px solid #FDAD34; }

/* External template wrangling Because the Action-Adventure Games template resides on Community Central and not this wiki, a whole lot of   !importanting is required. */

.mainpage-box-other-wikis { margin:20px auto; } .mainpage-box-other-wikis > div { border-radius:0!important; border:0!important; width:inherit!important; box-shadow:none!important; background-color:transparent!important; margin:0!important; padding:0!important; } .mainpage-box-other-wikis > div a, .mainpage-box-other-wikis > div a:visited { /* placeholder */ } .mainpage-box-other-wikis div { width:290px!important; /* needed to control the image from afar */ text-align:left!important; } .mainpage-box-other-wikis > img { display:block!important; padding:20px; } .mainpage-box-other-wikis p + div, .mainpage-box-other-wikis p > div, .mainpage-box-other-wikis .image .image-thumbnail .link-external { display:none; } .mainpage-box-other-wikis p + p { font-size:13px!important; line-height:160%!important; } .mainpage-box-other-wikis i, .mainpage-box-other-wikis em, .mainpage-box-other-wikis strong, .mainpage-box-other-wikis b { /* getting rid of internal title */ display:none; } /* Polls */ .mainpage .ajax-poll { background:#ececec; border:none; } .mainpage input[type="submit"]:not(.wds-button) { -webkit-border-radius:0; border-radius:0; font-family:Rubik; font-weight:bold; letter-spacing:1px; text-transform:uppercase; background-image:none; padding:5px; height:auto; } .mainpage input[type="submit"]:not(.wds-button):hover { color:#78C156; background-color:black; } .mainpage .ajax-poll div:last-child { display:none; } /* Right rail exceptions */

/*====================  HEADERS =====================*/

/* Left rail */ .mainpage-box-welcome .header, .mainpage-box-characters .header, .mainpage-box-episodes .header, .mainpage-box-about-wiki .header, .mainpage-box-browse .header, .mainpage-box-DYK .header, .mainpage-box-news .header, .mainpage-box-about-tmnt .header { text-align:center; font-size:26px; text-transform:uppercase; font-family: "ITC Stenberg"; letter-spacing:3px; margin:20px auto; color: #FDAD34; background-color:#000; padding:10px; width:90%; } /* Left rail subheaders */ /* Welcome */ .mainpage-box-welcome .subheader { text-transform:uppercase; font-size: 24px; } .mainpage-box-welcome .admin { font-size:14px; margin-top:30px; } /* Episode grid */

.mainpage-box-browse .subheader, .episode-grid .subheader { font-family:"ITC Stenberg"; font-size:18px; text-align:left; text-transform:uppercase; margin-top:5px; margin-bottom:10px; } /* Exceptions for the left rail */ .mainpage-box-welcome .header { font-size:42px; margin-top:0; } .mainpage-box-about-tmnt .header { width:25%; } .mainpage-box-news .header { width:46%; } .mainpage-box-DYK .header { width:31%; } .mainpage-box-browse .header { width:35%; } .mainpage-box-episodes .header { width:34%; }

/* Right rail */ .mainpage-box-twitter .header, .mainpage-box-featured-article .header, .mainpage-box-poll .poll-header, /* The header for the module */ .mainpage-box-quiz .header, .mainpage-box-quote .header, .mainpage-box-other-wikis .header { font-size:26px; text-align:center; text-transform:uppercase; letter-spacing:3px; font-family: "ITC Stenberg"; line-height:130%; color:#FDAD34; background-color:#000; margin:20px 0; width:100%; }

.mainpage-box-poll .header { /* The poll question itself */ font-size:22px; font-family:Rubik; line-height:150%; text-transform:none; font-weight:normal!important; /* !important necessary */ }

/* Exceptions for the right rail */

.mainpage-box-other-wikis .header { /* This class needs !important */ background-color:#000!important; text-align:center!important; width:100%!important; }

/* Portability */ @media (max-width: 1023px) { .mainpage-box-twitter, .mainpage-box-featured-article, .mainpage-box-poll, .mainpage-box-quiz, .mainpage-box-quote, .mainpage-box-other-wikis { display:inline-block; margin:0 auto 20px auto; border:none; width:300px; }    .mainpage-box-other-wikis { width:100%!important; /* !important necessary */ }    .main-page-tag-rcs .module { width:285px; } }