MediaWiki:Tweeki.css: Difference between revisions
From Now That's What I Call Music Wiki
(Created page with "→CSS placed here will affect users of the Tweeki skin: body { background: #333333 !important; margin: 0 !important; padding: 0 !important; } .col{ box-sizing: border-box; position: static; width: 100%; padding-right: 0px !important; padding-left: 0px !important; padding-top: 0px !important; max-width: 100%; } img { max-width: 100%; height: auto; } .footer-info { color:#ffffff; } .slider { background: url("https://nowmusicwiki.com/skins/Now...") |
No edit summary |
||
(50 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
/* CSS placed here will affect users of the Tweeki skin */ | /* CSS placed here will affect users of the Tweeki skin */ | ||
/* Body Styles */ | |||
body { | body { | ||
background: #333333 !important; | background: #333333 !important; | ||
margin: 0 !important; | margin: 0 !important; | ||
padding: 0 !important; | |||
} | } | ||
/* Column Styles */ | |||
.col{ | .col { | ||
box-sizing: border-box; | box-sizing: border-box; | ||
position: static; | position: static; | ||
width: 100%; | width: 100%; | ||
padding | padding: 0 !important; /* consolidated padding */ | ||
max-width: 100%; | max-width: 100%; | ||
} | } | ||
/* Image Styles */ | |||
img { | img { | ||
max-width: 100%; | |||
height: auto; | |||
} | |||
fho | |||
/* Footer Styles */ | |||
.footer-info { | |||
color: #ffffff; | |||
} | } | ||
.footer-places-privacy { | |||
display: none; | |||
} | |||
. | /* Navbar Styles */ | ||
/* Hide duplicate hamburger menu on mobile version */ | |||
.navbar-toggler-icon { | |||
display: none !important; | |||
} | } | ||
/* Slider Styles */ | |||
.slider { | .slider { | ||
background: url("https://nowmusicwiki.com/skins/NowMusicWiki-800-High.jpg") no-repeat; | |||
background-size: cover; | |||
background-attachment: fixed; | |||
background-position: 10% 0%; | |||
padding: 200px 20px; /* consolidated padding */ | |||
position: relative; | |||
@extend .overly; | |||
@include desktop { | |||
padding: 150px 0; | |||
} | |||
.block { | |||
color: #E3E3E4; | |||
text-align: center; | |||
h1 { | |||
font-weight: 100; | |||
font-size: 45px; | |||
line-height: 60px; | |||
letter-spacing: 10px; | |||
padding-bottom: 15px; | |||
text-transform: uppercase; | |||
@include desktop { | |||
font-size: 36px; | |||
line-height: 46px; | |||
} | |||
@include tablet { | |||
font-size: 32px; | |||
line-height: 42px; | |||
} | |||
} | |||
p { | |||
margin-bottom: 30px; | |||
color: #b9b9b9; | |||
font-size: 18px; | |||
line-height: 27px; | |||
font-weight: 300; | |||
@include desktop { | |||
font-size: 16px; | |||
} | |||
} | |||
} | |||
} | } | ||
/* | /* Link Styles */ | ||
/* Standard link colors */ | |||
a:link { color: #1a8bf3; } /* normal unvisited links */ | a:link { color: #1a8bf3; } /* normal unvisited links */ | ||
a | a:visited { color: #6bb1f2; } /* visited links */ | ||
a | a:active { color: #1a67f3; } /* active links */ | ||
a | a.new { color: #f31aa4; } /* new links */ | ||
a | a.extiw, a.external { color: #1a67f3; } /* interwiki & external links */ | ||
a | a.stub { color: #009da5; } /* hovered links */ | ||
a | |||
a:hover { color: #729c0c; } | |||
a:active { color: #00ff00; } | |||
a.new:visited { color: #f31aa4 !important; } | |||
a:hover | |||
a:active {color: #00ff00} | |||
a.new:visited { color: #f31aa4 ! | |||
/* Whitelink */ | /* Whitelink Styles */ | ||
span.whitelink a:link { color: #ffffff; } /* normal unvisited links */ | span.whitelink a:link { color: #ffffff; } /* normal unvisited links */ | ||
span.whitelink a:link:hover { color: #000000; } /* | span.whitelink a:link:hover { color: #000000; } /* hover effect */ | ||
span.whitelink a:visited { color: #ffffff; } /* visited links */ | span.whitelink a:visited { color: #ffffff; } /* visited links */ | ||
span.whitelink a:link:active | span.whitelink a:link:active, | ||
span.whitelink a:link.new | span.whitelink a:link.new, | ||
span.whitelink a:link.extiw | span.whitelink a:link.extiw, | ||
span.whitelink a:link.external | span.whitelink a:link.external, | ||
span.whitelink a:link.external.visited | span.whitelink a:link.external.visited, | ||
span.whitelink a:link.stub { color: #ffffff; } /* | span.whitelink a:link.stub { | ||
color: #ffffff; | |||
} /* active, new, interwiki, and external links */ | |||
.mw-body-content a.external {color: #ffc411 !important;} | /* MediaWiki Content Styles */ | ||
.mw-body-content a.external:visited {color: #ffc411 !important;} | .mw-body-content a.external { color: #ffc411 !important; } | ||
.mw-body-content a.external:hover {color: #ff7b11 | .mw-body-content a.external:visited { color: #ffc411 !important; } | ||
.mw-body-content {color: #dddddd;} | .mw-body-content a.external:hover { color: #ff7b11 !important; } | ||
.mw-body-content { color: #dddddd; } | |||
/* | /* Album Tracklist Styles */ | ||
.list-group-item.d-flex.justify-content-between.align-items-center{ | .list-group-item.d-flex.justify-content-between.align-items-center { | ||
box-sizing: border-box; | box-sizing: border-box; | ||
position: relative; | position: relative; | ||
display: flex; | display: flex; | ||
margin-bottom: 1px; | |||
padding | padding: 0.2rem 0.5rem 0.2rem 0; /* Adjusted for shorthand */ | ||
background-color: rgb(40, 40, 40); | background-color: rgb(40, 40, 40); | ||
border | border: 1px solid rgb(40, 40, 40); /* Unified border styling */ | ||
border-radius: inherit; | |||
border | |||
justify-content: space-between; | justify-content: space-between; | ||
align-items: center; | align-items: center; | ||
Line 143: | Line 137: | ||
} | } | ||
.list-group-item.d-flex.justify-content-between.align-items-center:hover{ | .list-group-item.d-flex.justify-content-between.align-items-center:hover { | ||
background-color: rgb(30, 30, 30) !important; | background-color: rgb(30, 30, 30) !important; | ||
} | |||
/* Content Styles */ | |||
#content { | |||
margin: 2px; | |||
padding: 2px; | |||
} | |||
#maincontentwrapper .col-md-10.offset-md-1 { | |||
margin-top: 0 !important; | |||
padding-top: 0 !important; | |||
} | |||
/* Table of Contents */ | |||
.tocnumber { display: none; } | |||
/* Form Styles */ | |||
.checkboxLabel, .radioButtonItem { | |||
width: 200px !important; | |||
display: block !important; | |||
float: left !important; | |||
} | |||
/* No Wrap Links */ | |||
.nowraplinks a, | |||
.nowraplinks .selflink { | |||
white-space: nowrap; | |||
} | |||
/* Responsive Column Layout */ | |||
@media only screen and (min-width: 850px) { | |||
ul.smw-format.ul-format.columnsul { column-count: 2; } | |||
ul.smw-format.ul-format.columnsmainserieslist { column-count: 8; } | |||
ul.smw-format.ul-format.columnsthreelist { column-count: 3; } | |||
ul.smw-format.ul-format.columnstwolist { column-count: 2; } | |||
ul.smw-format.ul-format.columnsfourlist { column-count: 4; } | |||
ul.smw-format.ul-format.columnsfivelist { column-count: 5; } | |||
ul.smw-format.ul-format.columnssixlist { column-count: 6; } | |||
} | |||
@media only screen and (max-width: 849px) { | |||
ul.smw-format.ul-format.columnsmainserieslist { column-count: 2; } | |||
} | |||
/* Table Row Styles */ | |||
.sortable .row-even { | |||
background-color: #343a40; | |||
color: #dddddd; | |||
border: none !important; /* consolidated border styling */ | |||
padding: 15px; | |||
} | |||
.sortable .row-odd { | |||
background-color: #373d43; | |||
color: #dddddd; | |||
border: none !important; /* consolidated border styling */ | |||
padding: 15px; | |||
} | |||
/* Song Link Styles */ | |||
.smwtable .song a { | |||
font-weight: bold; | |||
padding: 15px; | |||
border-width: 0px; | |||
} | |||
/* Header Sort Styles */ | |||
.sortable .headerSort { | |||
background-color: #2c3237 !important; | |||
color: #dddddd; | |||
border: none; /* consolidated border styling */ | |||
border-width: 0px; | |||
padding: 15px; | |||
} | |||
/* Wiki Table Styles */ | |||
.wikitable { | |||
border: none !important; | |||
border-width: 0px; | |||
} | |||
/* Table Data Styles */ | |||
#td { | |||
background-color: #343a40; | |||
color: #dddddd; | |||
border-top: none !important; | |||
border-width: 0px; | |||
padding: 15px; | |||
} | |||
/* Thumbnail Styles */ | |||
.thumbinner { | |||
background-color: rgba(201, 76, 76, 0.0) !important; | |||
border: none !important; | |||
border-width: 0px; | |||
} | |||
/* Additional Styles */ | |||
.magnify { display: none; } | |||
.ht-editsection { | |||
display: none; | |||
} | |||
.mw-editsection { | |||
display: none; | |||
} | |||
/* Remove image after external links */ | |||
.plainlinks a { | |||
display: none; | |||
} | |||
#content a.external[href ^="https://"], | |||
.link-https { | |||
display: none; | |||
} | |||
/* Remove Colour on dropdown menu */ | |||
.dropdown-menu.show { | |||
background-color: #000000 !important; | |||
} | |||
.dropdown-item { | |||
background-color: #000000 !important; | |||
} | |||
.dropdown-item:hover { | |||
color: #fae000 !important; | |||
} | |||
.yearbookmenu:hover{ | |||
color: #fae000 !important; | |||
background-color: #000000 !important; | |||
} | |||
/* css for dropdown submenu */ | |||
.dropdown-menu li { | |||
position: relative; | |||
} | |||
.dropdown-menu .dropdown-submenu { | |||
display: none; | |||
position: absolute; | |||
left: 100%; | |||
top: -7px; | |||
} | |||
.dropdown-menu .dropdown-submenu-left { | |||
right: 100%; | |||
left: auto; | |||
} | |||
.dropdown-menu > li:hover > .dropdown-submenu { | |||
display: block; | |||
} | |||
/* White Link on Slider Homepage */ | |||
.slider-link a { | |||
color:#ffffff !important; | |||
font-family:Roboto,-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif; | |||
} | } |
Latest revision as of 16:23, 16 November 2024
/* CSS placed here will affect users of the Tweeki skin */
/* Body Styles */
body {
background: #333333 !important;
margin: 0 !important;
padding: 0 !important;
}
/* Column Styles */
.col {
box-sizing: border-box;
position: static;
width: 100%;
padding: 0 !important; /* consolidated padding */
max-width: 100%;
}
/* Image Styles */
img {
max-width: 100%;
height: auto;
}
fho
/* Footer Styles */
.footer-info {
color: #ffffff;
}
.footer-places-privacy {
display: none;
}
/* Navbar Styles */
/* Hide duplicate hamburger menu on mobile version */
.navbar-toggler-icon {
display: none !important;
}
/* Slider Styles */
.slider {
background: url("https://nowmusicwiki.com/skins/NowMusicWiki-800-High.jpg") no-repeat;
background-size: cover;
background-attachment: fixed;
background-position: 10% 0%;
padding: 200px 20px; /* consolidated padding */
position: relative;
@extend .overly;
@include desktop {
padding: 150px 0;
}
.block {
color: #E3E3E4;
text-align: center;
h1 {
font-weight: 100;
font-size: 45px;
line-height: 60px;
letter-spacing: 10px;
padding-bottom: 15px;
text-transform: uppercase;
@include desktop {
font-size: 36px;
line-height: 46px;
}
@include tablet {
font-size: 32px;
line-height: 42px;
}
}
p {
margin-bottom: 30px;
color: #b9b9b9;
font-size: 18px;
line-height: 27px;
font-weight: 300;
@include desktop {
font-size: 16px;
}
}
}
}
/* Link Styles */
/* Standard link colors */
a:link { color: #1a8bf3; } /* normal unvisited links */
a:visited { color: #6bb1f2; } /* visited links */
a:active { color: #1a67f3; } /* active links */
a.new { color: #f31aa4; } /* new links */
a.extiw, a.external { color: #1a67f3; } /* interwiki & external links */
a.stub { color: #009da5; } /* hovered links */
a:hover { color: #729c0c; }
a:active { color: #00ff00; }
a.new:visited { color: #f31aa4 !important; }
/* Whitelink Styles */
span.whitelink a:link { color: #ffffff; } /* normal unvisited links */
span.whitelink a:link:hover { color: #000000; } /* hover effect */
span.whitelink a:visited { color: #ffffff; } /* visited links */
span.whitelink a:link:active,
span.whitelink a:link.new,
span.whitelink a:link.extiw,
span.whitelink a:link.external,
span.whitelink a:link.external.visited,
span.whitelink a:link.stub {
color: #ffffff;
} /* active, new, interwiki, and external links */
/* MediaWiki Content Styles */
.mw-body-content a.external { color: #ffc411 !important; }
.mw-body-content a.external:visited { color: #ffc411 !important; }
.mw-body-content a.external:hover { color: #ff7b11 !important; }
.mw-body-content { color: #dddddd; }
/* Album Tracklist Styles */
.list-group-item.d-flex.justify-content-between.align-items-center {
box-sizing: border-box;
position: relative;
display: flex;
margin-bottom: 1px;
padding: 0.2rem 0.5rem 0.2rem 0; /* Adjusted for shorthand */
background-color: rgb(40, 40, 40);
border: 1px solid rgb(40, 40, 40); /* Unified border styling */
border-radius: inherit;
justify-content: space-between;
align-items: center;
color: rgb(255, 255, 255);
}
.list-group-item.d-flex.justify-content-between.align-items-center:hover {
background-color: rgb(30, 30, 30) !important;
}
/* Content Styles */
#content {
margin: 2px;
padding: 2px;
}
#maincontentwrapper .col-md-10.offset-md-1 {
margin-top: 0 !important;
padding-top: 0 !important;
}
/* Table of Contents */
.tocnumber { display: none; }
/* Form Styles */
.checkboxLabel, .radioButtonItem {
width: 200px !important;
display: block !important;
float: left !important;
}
/* No Wrap Links */
.nowraplinks a,
.nowraplinks .selflink {
white-space: nowrap;
}
/* Responsive Column Layout */
@media only screen and (min-width: 850px) {
ul.smw-format.ul-format.columnsul { column-count: 2; }
ul.smw-format.ul-format.columnsmainserieslist { column-count: 8; }
ul.smw-format.ul-format.columnsthreelist { column-count: 3; }
ul.smw-format.ul-format.columnstwolist { column-count: 2; }
ul.smw-format.ul-format.columnsfourlist { column-count: 4; }
ul.smw-format.ul-format.columnsfivelist { column-count: 5; }
ul.smw-format.ul-format.columnssixlist { column-count: 6; }
}
@media only screen and (max-width: 849px) {
ul.smw-format.ul-format.columnsmainserieslist { column-count: 2; }
}
/* Table Row Styles */
.sortable .row-even {
background-color: #343a40;
color: #dddddd;
border: none !important; /* consolidated border styling */
padding: 15px;
}
.sortable .row-odd {
background-color: #373d43;
color: #dddddd;
border: none !important; /* consolidated border styling */
padding: 15px;
}
/* Song Link Styles */
.smwtable .song a {
font-weight: bold;
padding: 15px;
border-width: 0px;
}
/* Header Sort Styles */
.sortable .headerSort {
background-color: #2c3237 !important;
color: #dddddd;
border: none; /* consolidated border styling */
border-width: 0px;
padding: 15px;
}
/* Wiki Table Styles */
.wikitable {
border: none !important;
border-width: 0px;
}
/* Table Data Styles */
#td {
background-color: #343a40;
color: #dddddd;
border-top: none !important;
border-width: 0px;
padding: 15px;
}
/* Thumbnail Styles */
.thumbinner {
background-color: rgba(201, 76, 76, 0.0) !important;
border: none !important;
border-width: 0px;
}
/* Additional Styles */
.magnify { display: none; }
.ht-editsection {
display: none;
}
.mw-editsection {
display: none;
}
/* Remove image after external links */
.plainlinks a {
display: none;
}
#content a.external[href ^="https://"],
.link-https {
display: none;
}
/* Remove Colour on dropdown menu */
.dropdown-menu.show {
background-color: #000000 !important;
}
.dropdown-item {
background-color: #000000 !important;
}
.dropdown-item:hover {
color: #fae000 !important;
}
.yearbookmenu:hover{
color: #fae000 !important;
background-color: #000000 !important;
}
/* css for dropdown submenu */
.dropdown-menu li {
position: relative;
}
.dropdown-menu .dropdown-submenu {
display: none;
position: absolute;
left: 100%;
top: -7px;
}
.dropdown-menu .dropdown-submenu-left {
right: 100%;
left: auto;
}
.dropdown-menu > li:hover > .dropdown-submenu {
display: block;
}
/* White Link on Slider Homepage */
.slider-link a {
color:#ffffff !important;
font-family:Roboto,-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;
}