Difference between revisions of "MediaWiki:Vector.css"

MuseWiki, wiki for the band Muse
Jump to navigation Jump to search
m (hm)
(Alright, let's do this step by step)
Line 3: Line 3:
html, body {
html, body {
font-size: 100%;
font-size: 100%;
}
body {
background: black url('http://www.musewiki.org/skins/common/images/resistancebg2.jpg') no-repeat fixed;
}
}


Line 12: Line 8:
/* Use bullet character, not image, for unordered lists */
/* Use bullet character, not image, for unordered lists */


#content ul li {
div#content ul li {
list-style: disc none;
list-style: disc none;
}
}
Line 18: Line 14:
/* But not for some ul */
/* But not for some ul */


#toc li {
table#toc ul li {
list-style-type: none;
list-style-type: none;
}
}


/* Side-bar */
/* Side-bar */
body {
background: black url('http://www.musewiki.org/skins/common/images/resistancebg2.jpg') no-repeat fixed;
}


#p-logo {
div#p-logo {
background: url('http://www.musewiki.org/skins/common/images/musewikiLogo.png') no-repeat center center;
background: url('http://www.musewiki.org/skins/common/images/musewikiLogo.png') no-repeat center center;
height: 40px;
height: 40px;
Line 34: Line 32:
}
}


#p-logo a {
div#p-logo a {
background: none !important;
background: none !important;
}
}
Line 42: Line 40:
}
}


#mw-panel li {
#mw-panel div.portal div.body ul li {
font-size: .8em;
font-size: .8em;
}
}


#mw-panel .body {
#mw-panel div.portal div.body {
background: none repeat scroll 0 0 #000;
background: none repeat scroll 0 0 #000;
margin: 0 0 0 1.25em;
margin: 0 0 0 1.25em;
Line 56: Line 54:
}
}


#mw-panel .body:hover {
#mw-panel div.portal div.body:hover {
opacity: 1;
opacity: 1;
}
}


#mw-panel h5 {
#mw-panel div.portal h5 {
font-size: 1em !important;
text-transform: uppercase;
font-size: 1em;
padding: 0 .25em .25em 1.25em !important;
padding: 0 .25em .25em 1.25em !important;
text-transform: uppercase;
}
}


#mw-panel a, #mw-panel h5 {
#mw-panel div.portal div.body ul li a, #mw-panel div.portal h5 {
color: #FFF !important;
color: #FFF !important;
}
}
Line 93: Line 91:


#right-navigation {
#right-navigation {
margin-top: 25px;
background: #FFF !important;
background: #FFF !important;
margin-top: 25px;
}
}


#p-namespaces a span {color: #FFF !important}
#p-namespaces a span {color: #FFF !important}


#p-personal a {color: #FFF}
#p-personal li a {color: #FFF}


.page-MuseWiki #firstHeading {display: none}
.page-MuseWiki #firstHeading {display: none}


/* Stop disc bullets from appearing on drop-downs */
/* Stop disc bullets from appearing on drop-downs */


.col li {
ul.col li {
list-style-type: none !important;
list-style-type: none !important;
}
}
Line 112: Line 109:
/* Links and make guillemet thingies look like links */
/* Links and make guillemet thingies look like links */


a, .col *.gu, #p-views span {
a, ul.col *.gu, div#p-views span {
color: #069;
color: #069;
}
}


a:visited, .col:hover *.gu {
a:visited, ul.col:hover *.gu {
color: #669;
color: #669;
}
}
Line 124: Line 121:
}
}


.col *.gu {
ul.col *.gu {
display: inline;
display: inline;
}
}
Line 144: Line 141:
}
}


table, body, #siteSub {
table, body, h3#siteSub {
color: #333;
color: #333;
}
}


table, td, .frontth, .diff, .diff div, .diff td, #preferences, #userloginForm form table, #mw_metadata td, .gallery, .gallery td {
table, td, .frontth, table.diff, table.diff div, table.diff td, div#preferences, div#userloginForm form table, table#mw_metadata td, table.gallery, table.gallery td {
background: transparent;
background: transparent;
}
}


#userlogin table, .captcha {
div#userlogin table, div#userlogin div.captcha {
background: transparent !important;
background: transparent !important;
}
}


.gallery td {
table.gallery td {
border: transparent;
border: transparent;
}
}
Line 221: Line 218:
}
}


#frontpage-indexbox-footer {
table#frontpage-indexbox-footer {
color: #CCC;
color: #CCC;
font-size: .95em;
font-size: .95em;
Line 228: Line 225:
}
}


#frontpage-indexbox-footer td {
table#frontpage-indexbox-footer td {
padding: 0;
padding: 0;
}
}


#frontpage-bodytable {
table#frontpage-bodytable {
border-spacing: .5em;
border-spacing: .5em;
margin: 0 -.5em;
margin: 0 -.5em;
Line 247: Line 244:


#museNew {
#museNew {
padding: 0 .781em;
padding: 0 0.781em;
vertical align: top;
vertical align: top;
}
}
Line 272: Line 269:
}
}


#frontpage-gigs {
#museGigs div#frontpage-gigs {
background: #FFD;
background: #FFD;
margin-bottom: .781em;
margin-bottom: .781em;
}
}


#musetwitter {
#museGigs div#musetwitter {
background: #E2ECF2;
background: #E2ECF2;
margin-bottom: .781em;
margin-bottom: .781em;
}
}


#wikitwitter {
#museGigs div#wikitwitter {
background: #ECF2E2;
background: #ECF2E2;
}
}


#frontpage-infofooter {
div#frontpage-infofooter {
font-size: .95em;
font-size: .95em;
margin-bottom: .5em;
margin-bottom: .5em;
Line 303: Line 300:
}
}


#museNew ul {
#museNew .simplepie ul {
margin: 0;
margin: 0;
}
}


#museNew li {
#museNew .simplepie ul li {
list-style-type: none;
list-style-type: none;
}
}
Line 323: Line 320:
/* Curves are the new pr0n - sidebar */
/* Curves are the new pr0n - sidebar */


.portlet > h5 {
div.portlet > h5 {
border: none !important;
border-top-right-radius: 1em;
border-top-right-radius: 1em;
-khtml-border-top-right-radius: 1em;
-khtml-border-top-right-radius: 1em;
Line 331: Line 327:
}
}


.pBody {
div.portlet > div.pBody {
border-bottom-right-radius: .5em;
border-bottom-right-radius: .5em;
-khtml-border-bottom-right-radius: .5em;
-khtml-border-bottom-right-radius: .5em;
Line 340: Line 336:
/* ...and for the main box */
/* ...and for the main box */


#content {
div#column-content > div#content {
border-radius: .5em 0 0 .5em;
border-radius: .5em 0 0 .5em;
width: -moz-calc(100% - 10em);
width: -moz-calc(100% - 10em);
Line 348: Line 344:
}
}


.gigindex {
table.gigindex {
border-radius: .5em;
border: 1px #CCC solid;
border: 1px #CCC solid;
border-radius: .5em;
font-size: .95em;
font-size: .95em;
margin: 1em 1em 1em 0;
margin: 1em 1em 1em 0;
Line 406: Line 402:
/* Infoboxes, gigtable (for .8em tables) */
/* Infoboxes, gigtable (for .8em tables) */


.infbox, .gigtable, #pricetable, .thumbinner {
table.infbox, table.gigtable, table#pricetable, div.thumbinner {
box-shadow: .45em .33em .2em 0 #666;
box-shadow: .45em .33em .2em 0 #666;
}
}
Line 415: Line 411:
*/
*/


.disco-list {
table.disco-list {
box-shadow: .3789em .2779em .1684em 0 #666;
box-shadow: .3789em .2779em .1684em 0 #666;
}
}
Line 426: Line 422:
/* Colours */
/* Colours */


.infbox th, .gigtable th {
table.infbox th, table.gigtable th {
color: #FFF;
color: #FFF;
}
}


.discobox th {
table.discobox th {
background: #4D1F68;
background: #4D1F68;
}
}


.discobox tr:nth-child(2n+1) {
table.discobox tr:nth-child(2n+1) {
background: #DAD0DF;
background: #DAD0DF;
}
}


#gearbox th {
table#gearbox th {
background: #656565;
background: #656565;
}
}


#gigbox th, .gigtable th {
table#gigbox th, table.gigtable th {
background: #82A63A;
background: #82A63A;
}
}


#gigbox tr:nth-child(2n+1), .gigtable tr:nth-child(2n+1) {
table#gigbox tr:nth-child(2n+1), table.gigtable tr:nth-child(2n+1) {
background: #E0E6D3;
background: #E0E6D3;
}
}


#memberbox th {
table#memberbox th {
background: #AF2022;
background: #AF2022;
}
}


#memberbox tr:nth-child(2n+1) {
table#memberbox tr:nth-child(2n+1) {
background: #DEDEDE;
background: #DEDEDE;
}
}


#songbox th {
table#songbox th {
background: #0378AE;
background: #0378AE;
}
}


#songbox tr:nth-child(2n+1) {
table#songbox tr:nth-child(2n+1) {
background: #C9DAE1;
background: #C9DAE1;
}
}


#vidbox th {
table#vidbox th {
background: #E3AF1E;
background: #E3AF1E;
}
}
Line 474: Line 470:
/* Info box borders */
/* Info box borders */


.gigtable, .gigtable th, .gigtable td, .infbox, .infbox th, .infbox td {
table.gigtable, table.gigtable th, table.gigtable td, table.infbox, table.infbox th, table.infbox td {
border-collapse: collapse;
border-collapse: collapse;
border-color: transparent;
border-color: transparent;
Line 483: Line 479:
/* Info box left column */
/* Info box left column */


.infbox td:first-child {
table.infbox td:first-child {
font-weight: bold;
font-weight: bold;
}
}
Line 490: Line 486:




/* Navs */
/* GigNav */


#nav {
table#nav {
border: 1px #AAA solid;
border: 1px #aaa solid;
border-collapse: collapse;
border-collapse: collapse;
border-radius: .5em;
border-radius: .5em;
Line 505: Line 501:
}
}


#nav th {
table#nav th {
background: #000;
background: #000;
border: .1em solid transparent;
border: .1em solid transparent;
Line 516: Line 512:
}
}


.nav-gig th {
table#nav.nav-gig th {
background: #82A63A;
background: #82A63A;
}
}


.nav-song th {
table#nav.nav-song th {
background: #0378AE;
background: #0378AE;
}
}


/* Appears to fix buggy border */
/* Appears to fix buggy border */
#nav > tr:last-child {
table#nav tr:last-child {
border: .1em solid transparent;
border: .1em solid transparent;
}
}


#nav td {
table#nav td {
padding: inherit;
padding: inherit;
}
}
Line 536: Line 532:
border-bottom: .1em solid;
border-bottom: .1em solid;


#nav td:first-child {
table#nav td:first-child {
border-left: .1em solid
border-left: .1em solid
}
}


#nav td:last-child {
table#nav td:last-child {
border-right: .1em solid
border-right: .1em solid
}
}
*/
*/


#nav td:nth-child(2n), #nav td:nth-child(3) {
table#nav td:nth-child(2n), table#nav td:nth-child(3) {
font-weight: bold;
font-weight: bold;
}
}


#nav td:nth-child(2n+1) {
table#nav td:nth-child(2n+1) {
transition: background-color 1s;
transition: background-color 1s;
width: 17em;
width: 17em;
Line 556: Line 552:
}
}


.nav-gig td:nth-child(2n+1):hover {
table#nav td:nth-child(2n+1):hover {
background-color: #E0E6D3;
background-color: #E0E6D3;
}
}


.nav-song td:nth-child(2n+1):hover {
table#nav.nav-song td:nth-child(2n+1):hover {
background-color: #C9DAE1;
background-color: #C9DAE1;
}
}


/* End Navs */
/* End Gignav */




Line 583: Line 579:
}
}


#setlist #intro {
#setlist li#intro {
list-style-type: none;
list-style-type: none;
}
}

Revision as of 03:49, 24 August 2011

/* CSS placed here will affect users of the Vector skin */

html, body {
font-size: 100%;
}


/* Use bullet character, not image, for unordered lists */

div#content ul li {
list-style: disc none;
}

/* But not for some ul */

table#toc ul li {
list-style-type: none;
}

/* Side-bar */
body {
background: black url('http://www.musewiki.org/skins/common/images/resistancebg2.jpg') no-repeat fixed;
}

div#p-logo {
background: url('http://www.musewiki.org/skins/common/images/musewikiLogo.png') no-repeat center center;
height: 40px;
margin-bottom: 1em;
position: relative;
top: 0;
z-index: -1;
}

div#p-logo a {
background: none !important;
}

#mw-panel {
top: 0;
}

#mw-panel div.portal div.body ul li {
font-size: .8em;
}

#mw-panel div.portal div.body {
background: none repeat scroll 0 0 #000;
margin: 0 0 0 1.25em;
opacity: .7;
padding: .625em 0 .3125em .625em;
transition: opacity 1s;
-moz-transition: opacity 1s;
-webkit-transition: opacity 1s;
}

#mw-panel div.portal div.body:hover {
opacity: 1;
}

#mw-panel div.portal h5 {
text-transform: uppercase;
font-size: 1em;
padding: 0 .25em .25em 1.25em !important;
}

#mw-panel div.portal div.body ul li a, #mw-panel div.portal h5 {
color: #FFF !important;
}

#mw-page-base {
margin-left: 10em
}

/* Top nav */
#mw-page-base {
background: none !important;
height: 65px !important;
}

#left-navigation {
top: 40px !important
}

#left-navigation *{
background: none !important
}

#left-navigation div.vectorTabs a span {
padding-top: .25em !important;
}

#right-navigation {
margin-top: 25px;
background: #FFF !important;
}

#p-namespaces a span {color: #FFF !important}

#p-personal li a {color: #FFF}

.page-MuseWiki #firstHeading {display: none}

/* Stop disc bullets from appearing on drop-downs */

ul.col li {
list-style-type: none !important;
}

/* Links and make guillemet thingies look like links */

a, ul.col *.gu, div#p-views span {
color: #069;
}

a:visited, ul.col:hover *.gu {
color: #669;
}

a.external {
color: #069 !important;
}

ul.col *.gu {
display: inline;
}


/* 2px / 16px / 1.6em */
h1 {
border-bottom: .078125em dotted #DDD;
}

h1, h2, h3, h4, h5 {
color: #333;
}

pre {
background-color: #EEE;
border-color: #AAA;
color: #333;
}

table, body, h3#siteSub {
color: #333;
}

table, td, .frontth, table.diff, table.diff div, table.diff td, div#preferences, div#userloginForm form table, table#mw_metadata td, table.gallery, table.gallery td {
background: transparent;
}

div#userlogin table, div#userlogin div.captcha {
background: transparent !important;
}

table.gallery td {
border: transparent;
}

th {
background: #FFF;
color: #333;
text-transform: uppercase;
}

.portlet h5 {
font-size: 1.3em;
}

.portlet ul {
font-size: .97em;
}

#contentSub {
margin: 0;
}

/* Home page index box */
#frontpage-indexbox {
border: .0781em solid #CCC;
border-radius: 1em;
margin-top: .7em;
width: 100%;
-khtml-border-radius: 1em;
-moz-border-radius: 1em;
-webkit-border-radius: 1em;
}

/* fuck yeah, gradients */
#frontpage-indexbox:first-of-type {
background: #C9DAE1;
box-shadow: 0 .078125em .390625em #0378AE, 0 .78125em 1.5625em #FFF inset;
transition: background-color 3s;
-moz-box-shadow: 0 .078125em .390625em #0378AE, 0 .78125em 1.5625em #FFF inset;
-moz-transition: background-color 3s;
-webkit-box-shadow: 0 .078125em .390625em #0378AE, 0 .78125em 1.5625em #FFF inset;
-webkit-transition: background-color 3s;
}

#frontpage-indexbox:hover:first-of-type {
background: #FFF;
}

#frontpage-indexbox table {
text-align: center;
}

#frontpage-indexbox div:first-child {
font-size: 1.62em;
padding: .1em;
}

#frontpage-subtitle {
font-size: .95em;
}

#frontpage-stats {
font-size: .85em;
}

table#frontpage-indexbox-footer {
color: #CCC;
font-size: .95em;
margin: -.175em 0 .075em;
width: 100%
}

table#frontpage-indexbox-footer td {
padding: 0;
}

table#frontpage-bodytable {
border-spacing: .5em;
margin: 0 -.5em;
}

#museAre {
vertical-align: top;
width: 170px;
}

#museAre p span {
font-size: x-small;
}

#museNew {
padding: 0 0.781em;
vertical align: top;
}

#museGigs {
vertical-align: top;
}

#museGigs div {
border-radius: 1em;
padding: .781em;
-khtml-border-radius: 1em;
-moz-border-radius: 1em;
-webkit-border-radius: 1em;
}

#museGigs div:first-child {
background: #E4B5CC;
margin-bottom: .781em;
}

#museGigs div div {
padding: 0;
}

#museGigs div#frontpage-gigs {
background: #FFD;
margin-bottom: .781em;
}

#museGigs div#musetwitter {
background: #E2ECF2;
margin-bottom: .781em;
}

#museGigs div#wikitwitter {
background: #ECF2E2;
}

div#frontpage-infofooter {
font-size: .95em;
margin-bottom: .5em;
text-align: center;
}

/* Home page Feed images */
.MainPageBG li img {
float: right;
margin: 0 0 .781em .781em;
}

/* NB: What's this needed for? */
.MainPageBG .simplepie li {
clear: both;
}

#museNew .simplepie ul {
margin: 0;
}

#museNew .simplepie ul li {
list-style-type: none;
}

/* Right side bar */
#musetwitter h2{
background: url('https://a2.twimg.com/profile_images/1285340280/muse1_mini.jpg') no-repeat right 5px;
}

#wikitwitter h2{
background: url('http://a0.twimg.com/profile_images/359401915/theresistance_mini.jpg') no-repeat right 5px;
}


/* Curves are the new pr0n - sidebar */

div.portlet > h5 {
border-top-right-radius: 1em;
-khtml-border-top-right-radius: 1em;
-moz-border-radius-topright: 1em;
-webkit-border-top-right-radius: 1em;
}

div.portlet > div.pBody {
border-bottom-right-radius: .5em;
-khtml-border-bottom-right-radius: .5em;
-moz-border-radius-bottomright: .5em;
-webkit-border-bottom-right-radius: .5em;
}

/* ...and for the main box */

div#column-content > div#content {
border-radius: .5em 0 0 .5em;
width: -moz-calc(100% - 10em);
-khtml-border-top-left-radius: .5em;
-moz-border-radius: .5em 0 0 .5em;
-webkit-border-top-left-radius: .5em;
}

table.gigindex {
border-radius: .5em;
border: 1px #CCC solid;
font-size: .95em;
margin: 1em 1em 1em 0;
-khtml-border-radius: .5em;
-moz-border-radius: .5em;
-webkit-border-radius: .5em;
}

/* End curves */


/* Notice box styling */

.colourbox {
border-radius: .5em;
color: #000;
display: block;
font-weight: bold;
margin: 0 10% .5em 10%;
padding: .5em;
text-align: center;
width: 80%;
-khtml-border-radius: .5em;
-moz-border-radius: .5em;
-webkit-border-radius: .5em;
}

.colourbox a {
color: #000;
}

.bluebackbox { 
background: #AAF;
border: .5em #AAF solid;
background: -webkit-gradient(linear, left bottom, right top, from(#AAF), to(#AAF), color-stop(.7, #7474AF), color-stop(.7, #7474AF));
}

.greenbackbox {
background: #AFA;
border: .5em #AFA solid;
background: -webkit-gradient(linear, left bottom, right top, from(#AFA), to(#AFA), color-stop(.7, #74AF74), color-stop(.7, #74AF74));
}

.redbackbox {
background: #FAA;
border: .5em #FAA solid;
background: -webkit-gradient(linear, left bottom, right top, from(#FAA), to(#FAA), color-stop(.7, #AF7474), color-stop(.7, #AF7474));
}

/* End notice boxes */


/* Box shadows */

/* Infoboxes, gigtable (for .8em tables) */

table.infbox, table.gigtable, table#pricetable, div.thumbinner {
box-shadow: .45em .33em .2em 0 #666;
}

/* Discography tables (for .95em tables)

 $val / .95em * .8em
*/

table.disco-list {
box-shadow: .3789em .2779em .1684em 0 #666;
}

/* End box shadows */


/* Info boxes (+gig tables) */

/* Colours */

table.infbox th, table.gigtable th {
color: #FFF;
}

table.discobox th {
background: #4D1F68;
}

table.discobox tr:nth-child(2n+1) {
background: #DAD0DF;
}

table#gearbox th {
background: #656565;
}

table#gigbox th, table.gigtable th {
background: #82A63A;
}

table#gigbox tr:nth-child(2n+1), table.gigtable tr:nth-child(2n+1) {
background: #E0E6D3;
}

table#memberbox th {
background: #AF2022;
}

table#memberbox tr:nth-child(2n+1) {
background: #DEDEDE;
}

table#songbox th {
background: #0378AE;
}

table#songbox tr:nth-child(2n+1) {
background: #C9DAE1;
}

table#vidbox th {
background: #E3AF1E;
}

/* End colours */

/* Info box borders */

table.gigtable, table.gigtable th, table.gigtable td, table.infbox, table.infbox th, table.infbox td {
border-collapse: collapse;
border-color: transparent;
padding-left: .5em;
padding-right: .5em;
}

/* Info box left column */

table.infbox td:first-child {
font-weight: bold;
}

/* End info boxes */


/* GigNav */

table#nav {
border: 1px #aaa solid;
border-collapse: collapse;
border-radius: .5em;
box-shadow: .58em .42em .25em 0 #666;
font-size: x-small;
padding: 0;
text-align: center;
-khtml-border-radius: .5em;
-moz-border-radius: .5em;
-webkit-border-radius: .5em;
}

table#nav th {
background: #000;
border: .1em solid transparent;
border-radius: .5em .5em 0 0;
color: #FFF;
padding: inherit;
-khtml-border-radius: .5em;
-moz-border-radius: .5em .5em 0 0;
-webkit-border-radius: .5em;
}

table#nav.nav-gig th {
background: #82A63A;
}

table#nav.nav-song th {
background: #0378AE;
}

/* Appears to fix buggy border */
table#nav tr:last-child {
border: .1em solid transparent;
}

table#nav td {
padding: inherit;
}

/* Borders mess up -- buggy rendering?
border-bottom: .1em solid;

table#nav td:first-child {
border-left: .1em solid
}

table#nav td:last-child {
border-right: .1em solid
}
*/

table#nav td:nth-child(2n), table#nav td:nth-child(3) {
font-weight: bold;
}

table#nav td:nth-child(2n+1) {
transition: background-color 1s;
width: 17em;
-moz-transition: background-color 1s;
-webkit-transition: background-color 1s;
}

table#nav td:nth-child(2n+1):hover {
background-color: #E0E6D3;
}

table#nav.nav-song td:nth-child(2n+1):hover {
background-color: #C9DAE1;
}

/* End Gignav */


/* Set lists */

/* hide YouTube link images within set-lists */

.ytube a {
background: none !important;
padding: 0 !important;
}

/* align intro with songs in set-lists
 * remove bullet therefrom             */

#setlist ul {
margin-left: 3.2em;
}

#setlist li#intro {
list-style-type: none;
}

/* End set lists */


/* Footer */

#footer-icons {display: none}
#footer ul li {color: #CCC}


/* Footnote list
ol.references li[id|="cite_note"] {
 font-size: xx-small;
} */


/* plain styling */

.bold {
font-weight: bold;
}

.normal {
font-weight: normal;
}

.small {
font-size: x-small;
}

.unknown {
font-style: italic;
}

/* End plain styling */