MediaWiki:Tweeki.css
From Now That's What I Call Music Wiki
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 affect users of the Tweeki skin */
/* Mailchimp Form */
#mc_embed_signup {
clear: left;
}
.mailchimpform {
background: rgba(0, 0, 0, 0.3) !important;
padding: 5px !important;
}
/* Hide Number in Table of Contents */
.tocnumber {
display: none;
}
/* Buttons in Forms Layout */
label.checkboxLabel {
width: 200px;
display: block;
float: left;
}
label.radioButtonItem {
width: 200px;
display: block;
float: left;
}
/* Heading Styles */
h1 {
font-family: Trebuchet MS;
color: #dddddd;
}
#mw-headline {
font-family: Trebuchet MS;
font-size: 20px;
color: #dddddd;
}
.mw-headline {
font-family: Trebuchet MS;
font-size: 20px;
color: #dddddd;
}
#firstHeading {
font: bold 30px Trebuchet MS;
color: #dddddd;
border-bottom: 0px !important;
}
.mw-body-content h2 {
font: italic 20px Trebuchet MS;
color: #dddddd;
}
/* Footer and Edit Elements */
#footer-places {
display: none;
}
#edittab, .mw-editsection {
display: none;
}
/* Body Background */
body {
background: #333333 !important;
}
#mw-content-container {
background-color: #333333;
border-bottom: solid 4px #ffc411;
}
#mw-content, .templateForm {
background-color: rgba(201, 76, 76, 0.0);
border-style: none !important;
}
/* Sidebar and Navigation */
#site-tools, #site-navigation, #page-tools, #catlinks-sidebar, .select2-match-entire, .select2-selection__choice {
background-color: #555555 !important;
color: #dddddd;
}
/* Link Colors */
a:link {
color: #1a8bf3;
}
a:visited {
color: #6bb1f2;
}
a:hover {
color: #729c0c;
}
a:active {
color: #00ff00;
}
a.new:visited {
color: #f31aa4 !important;
}
/* Whitelink */
span.whitelink a:link, span.whitelink a:visited, span.whitelink a:active, span.whitelink a.new, span.whitelink a.extiw, span.whitelink a.external, span.whitelink a.stub {
color: #ffffff;
}
/* External Link Colors */
.mw-body-content a.external {
color: #ffc411 !important;
}
.mw-body-content a.external:hover {
color: #ff7b11 !important;
}
.mw-body-content {
color: #dddddd;
}
/* Page Header and Subheader */
#mw-header-container {
background-color: #111111;
font-family: Trebuchet MS;
color: #eeeeee !important;
}
.mw-page-header-links {
color: #eeeeee !important;
}
#personal .dropdown {
background: #222 !important;
border: solid #000;
}
/* Responsive Thumb Styles */
@media screen and (max-width: 850px) {
.thumbcaption {
width: 120px !important;
}
}
#content a.external {
background: none !important;
padding: 0 !important;
}
.instanceMain, .multipleTemplateInstance {
padding: 0px !important;
}
@media only screen and (min-width: 850px) {
ul.smw-format.ul-format.columnsul {
column-count: 2;
}
}
/* Even and Odd Table Rows */
.sortable .row-even {
background-color: #343a40;
color: #dddddd;
padding: 15px;
}
.sortable .row-odd {
background-color: #373d43;
color: #dddddd;
padding: 15px;
}
/* Sortable Header */
.sortable .headerSort {
background-color: #2c3237 !important;
color: #dddddd;
padding: 15px;
}
/* Home Page Tables */
.mw-parser-output .mp-box {
padding: 0 0.5em 0.5em;
margin-top: 4px;
}
.mw-parser-output .mp-h2, body.skin-timeless .mw-parser-output .mp-h2 {
margin: 0.5em 0;
padding: 0.2em 0.4em;
font-size: 120%;
font-weight: bold;
font-family: inherit;
}
/* Welcome Box */
.mw-parser-output #mp-welcome {
font-size: 162%;
padding: 0.1em;
}
/* Media Queries for Layout Adjustments */
@media(max-width:875px) {
.mw-parser-output #mp-tfp table,
.mw-parser-output #mp-tfp tr,
.mw-parser-output #mp-tfp td,
.mw-parser-output #mp-tfp tbody {
display: block !important;
width: 100% !important;
}
}
@media(min-width:875px) {
.mw-parser-output #mp-upper {
display: flex;
}
}
/* Tab Styles */
.nav-tabs .nav-link {
color: #ffffff;
border: 0;
border-bottom: 1px solid grey;
}
.nav-tabs .nav-link.active {
color: #000000;
border-bottom: 2px solid blue;
}
/* Responsive Image */
img {
max-width: 100%;
height: auto;
}
.list-group-item.d-flex.justify-content-between.align-items-center {
background-color: rgb(40, 40, 40);
color: rgb(255, 255, 255);
}
.list-group-item.d-flex.justify-content-between.align-items-center:hover {
background-color: rgb(30, 30, 30) !important;
}