Difference between revisions of "User:CommodusIV/anisa.css"
From TWC Wiki
Jump to navigationJump to search| (25 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
| − | + | /* Background components */ | |
| − | background-color: # | + | /* Wrapper line extends page size to allow it to stretch more generously and reduce the space wasted. */ |
| + | body { | ||
| + | background-color: #9D7342; | ||
| + | background-image: url("https://www.twcenter.net/forums/images/y2skin/Background2.png"); | ||
} | } | ||
| + | #content { background-color: #EADCC1; } | ||
| + | #mw-wrapper { max-width: 150em; } | ||
| + | /* We don't need a repeat of TWC's name when we've got a logo, ei? */ | ||
| + | #p-banner { display: none; } | ||
| − | #column-navigation li a span { | + | /* Navigation components */ |
| − | + | /* We first color pieces of the nav sidebar. First affects all links, second affects headers. */ | |
| − | } | + | #column-navigation li a span { color: #EADCC1; } |
| − | + | #site-navigation h3 { color: #FFFFFF; } | |
| − | # | ||
| − | |||
| − | } | ||
| + | /*Changing up the page top through a few hacky methods. Removed a few unnecessary bits, moved search, colored links.*/ | ||
#p-search { | #p-search { | ||
position: static; | position: static; | ||
| Line 16: | Line 21: | ||
color: #FFFFFF; | color: #FFFFFF; | ||
} | } | ||
| − | + | #header h3, #searchInput { color: #FFFFFF; } | |
| − | # | ||
| − | |||
| − | |||
| − | |||
| − | # | ||
| − | |||
| − | } | ||
| − | |||
#header { | #header { | ||
display:block; | display:block; | ||
height: 0px; | height: 0px; | ||
| + | padding-bottom: 40px; | ||
} | } | ||
| − | |||
#header a { | #header a { | ||
display: none; | display: none; | ||
padding-bottom: 8px; | padding-bottom: 8px; | ||
| + | } | ||
| + | /* Anisa performs custom voodoo to make the logo display. It is time to trash some of this voodoo that is set by default so it behaves better. */ | ||
| + | #p-logo { | ||
| + | width: 100%; | ||
| + | text-align: left; | ||
| + | padding: 0; | ||
| + | padding: 3em 2.5em 1.5em 2em; | ||
| + | background-size: auto; | ||
| + | } | ||
| + | #mw-wiki-logo { | ||
| + | width: 100%; | ||
| + | height: 100%; | ||
| + | background-position: 100%; | ||
} | } | ||
| − | + | .mw-headline { | |
| − | padding- | + | text-align: center; |
| + | } | ||
| + | h1, h2, h3, h4 { | ||
| + | color: 000000; | ||
| + | } | ||
| + | |||
| + | /* SECTIONS */ | ||
| + | .section { | ||
| + | clear: both; | ||
| + | padding: 0px; | ||
| + | margin: 0px; | ||
| + | } | ||
| + | |||
| + | /* COLUMN SETUP */ | ||
| + | .col { | ||
| + | display: block; | ||
| + | float: left; | ||
| + | margin: 1% 0 1% 1.6%; | ||
| + | } | ||
| + | .col:first-child { margin-left: 0; } | ||
| + | |||
| + | |||
| + | /* GROUPING */ | ||
| + | .group:before, | ||
| + | .group:after { | ||
| + | content: ""; | ||
| + | display: table; | ||
| + | } | ||
| + | .group:after { | ||
| + | clear:both; | ||
| + | } | ||
| + | .group { | ||
| + | zoom:1; /* For IE 6/7 */ | ||
} | } | ||
| − | . | + | /* GRID OF THREE */ |
| − | + | .span_3_of_3 { | |
| + | width: 80%; | ||
| + | outline: 2px solid black; | ||
| + | } | ||
| + | .span_2_of_3 { | ||
| + | width: 66.1%; | ||
| + | outline: 2px solid black; | ||
| + | } | ||
| + | .span_1_of_3 { | ||
| + | width: 32.2%; | ||
| + | outline: 2px solid black; | ||
} | } | ||
| − | + | /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ | |
| − | + | @media only screen and (max-width: 480px) { | |
| − | + | .col { margin: 1% 0 1% 0%;} | |
| + | .span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; } | ||
} | } | ||
Latest revision as of 10:11, 3 March 2020
/* Background components */
/* Wrapper line extends page size to allow it to stretch more generously and reduce the space wasted. */
body {
background-color: #9D7342;
background-image: url("https://www.twcenter.net/forums/images/y2skin/Background2.png");
}
#content { background-color: #EADCC1; }
#mw-wrapper { max-width: 150em; }
/* We don't need a repeat of TWC's name when we've got a logo, ei? */
#p-banner { display: none; }
/* Navigation components */
/* We first color pieces of the nav sidebar. First affects all links, second affects headers. */
#column-navigation li a span { color: #EADCC1; }
#site-navigation h3 { color: #FFFFFF; }
/*Changing up the page top through a few hacky methods. Removed a few unnecessary bits, moved search, colored links.*/
#p-search {
position: static;
margin: 0px -105px 0;
color: #FFFFFF;
}
#header h3, #searchInput { color: #FFFFFF; }
#header {
display:block;
height: 0px;
padding-bottom: 40px;
}
#header a {
display: none;
padding-bottom: 8px;
}
/* Anisa performs custom voodoo to make the logo display. It is time to trash some of this voodoo that is set by default so it behaves better. */
#p-logo {
width: 100%;
text-align: left;
padding: 0;
padding: 3em 2.5em 1.5em 2em;
background-size: auto;
}
#mw-wiki-logo {
width: 100%;
height: 100%;
background-position: 100%;
}
.mw-headline {
text-align: center;
}
h1, h2, h3, h4 {
color: 000000;
}
/* SECTIONS */
.section {
clear: both;
padding: 0px;
margin: 0px;
}
/* COLUMN SETUP */
.col {
display: block;
float: left;
margin: 1% 0 1% 1.6%;
}
.col:first-child { margin-left: 0; }
/* GROUPING */
.group:before,
.group:after {
content: "";
display: table;
}
.group:after {
clear:both;
}
.group {
zoom:1; /* For IE 6/7 */
}
/* GRID OF THREE */
.span_3_of_3 {
width: 80%;
outline: 2px solid black;
}
.span_2_of_3 {
width: 66.1%;
outline: 2px solid black;
}
.span_1_of_3 {
width: 32.2%;
outline: 2px solid black;
}
/* GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
.col { margin: 1% 0 1% 0%;}
.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
}
