MediaWiki:Common.css
Jump to navigation
Jump to search
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */
/* This governs the sections on the Community portal */
.cpbox {
display: flex;
flex-direction: row-reverse;
flex-wrap: wrap;
}
.cpbox #admins {
box-sizing: border-box;
width: calc(33% - 10px);
margin: 5px;
flex-grow: 1;
min-width: 300px;
}
.cpbox #help {
box-sizing: border-box;
width: calc(67% - 10px);
margin: 5px;
flex-grow: 1;
}
/* Template documentation styles */
/* If modifying these styles, be sure to update the mobile skin! */
.doc {
margin: 0em auto 1em;
background-color: rgba(0, 0, 0, 0.1);
border: 2px solid #BDCAC3;
border-radius: 1em;
padding: 1em;
}
.doc-header {
padding-bottom: 3px;
border-bottom: 1px solid #BDCAC3;
margin-bottom: 1ex;
}
.doc-footer {
margin: 0;
background-color: rgba(0, 0, 0, 0.1);
border: 2px solid #BDCAC3;
border-radius: 1em;
padding: 1em;
}
/*********************
/* Front page styles *
/*********************/
.lidheader {
background: transparent url(https://static.wikia.nocookie.net/letitdie_gamepedia/images/a/a6/Header.png/revision/latest) repeat-x;
}
/******************
/* General styles *
/******************/
.contentbox {
border: 1px solid #aaaaaa;
background: #eeeeee;
color: #333333;
margin: 0 0 10px 0;
padding: 3px 6px;
overflow: auto;
}
span.bullet {
background: transparent no-repeat center 60%;
width: 9px;
font-size: 11px;
vertical-align: baseline;
}
.dablink {
padding: 2px 36px 10px 36px;
font-style: italic;
}
span.ghost {
color: #777777; /* For any text that appear fainter for some reason */
}
.columns {
padding: 0;
margin: 10px 0 0 0;
overflow: hidden;
}
.columns .leftcol {
float: left;
width: 50%;
margin: 0;
padding: 0;
}
.columns .centercol {
float: left;
margin: 0;
padding: 0;
}
.columns .rightcol {
float: right;
width: 50%;
margin: 0;
padding: 0;
}
/********************
* Main Page Layout *
********************/
/* Classes permitting setting of alignment on desktop only or differently on desktop and mobile */
/* (See .mobileleft, .mobilecenter, .mobileright in MediaWiki:Mobile.css for the mobile equivalents */
.desktopleft {
text-align: left;
}
.desktopcenter {
text-align: center;
}
.desktopright {
text-align: right;
}
/* Front page structure */
.fpbox {
margin:.5em;
}
.fpbox .heading {
font-weight:bold;
font-size:125%;
padding:.25em .5em
}
.fpbox .body {
padding:.5em;
}
.multi-column {
display:flex;
flex-flow:row wrap;
}
.multi-column .column {
margin:5px;
flex:1;
}
.fpbox#gameplay {grid-area:a;}
.fpbox#about {grid-area:b;}
.fpbox#twitter {grid-area:c;}
.fpbox#videos {grid-area:d;}
.fpbox#roadmap {grid-area:e;}
.fpbox#currentEvents {grid-area:f;}
.fpbox#daily {grid-area:g;}
.fpbox#tdmSeason {grid-area:h;}
.fpbox#hernia {grid-area:i;}
.fpbox#chargers {grid-area:j;}
.fpbox#seasonQuests {grid-area:k;}
.fpbox#weeklyQuests {grid-area:l;}
.fpbox#discord {grid-area:m;}
.fp-container {
display:grid;
grid-template-areas: "a" "c" "b" "d" "e" "f" "g" "h" "i" "j" "k" "l" "m";
grid-template-columns: 100%;
}
@media screen and (min-width:990px) {
.fp-container {
grid-template-areas: "a a a a" "b b c c" "d d e e" "f f g g " "h h i i" "j j k k" "l l l l" "m m m m";
grid-template-columns: 25%;
}
}
@media screen and (min-width:1350px) {
.fp-container {
grid-template-areas: "a a a a a c" "b b b b b c" "d d d e e e" "f f g g g g" "h h i i j j" "k k l l m m";
grid-template-columns: calc(100% / 6);
}
#daily .body {
display:flex;
justify-content:space-evenly;
}
}
.fpbox .rotating-content {
max-width: 100%;
white-space: normal !important;
display:inline-table;
vertical-align:top;
}
.fpbox img,
table.rotating-content img {
max-width:100%;
height:auto;
}
/* Auto-resize front page video to fit smaller columns */
.fpbox .embedvideowrap {
width: 100%!important;
max-width: 480px;
margin: 0 auto;
}
.fpbox .embedvideowrap iframe {
width: 100%!important;
}
.material-link {
display: inline-block;
}
.material-link:not(:last-child)::after {
content: ",";
}