MediaWiki:Tweeki.css

From Now That's What I Call Music Wiki
Revision as of 19:43, 5 November 2024 by Admin (talk | contribs)

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;
}