Foreground.css: Difference between revisions
Citadel LRP
Style page titles |
No edit summary |
||
(46 intermediate revisions by the same user not shown) | |||
Line 5: | Line 5: | ||
background-position: 0% 30%; | background-position: 0% 30%; | ||
background-size:180vw; | background-size:180vw; | ||
background-image: url( | background-image: url(http://citadel.camlarp.co.uk/w/images/5/59/38338630751_7851c952eb_o_smaller.jpg); | ||
background-color: #69674f; | background-color: #69674f; | ||
} | } | ||
Line 15: | Line 15: | ||
background: white; | background: white; | ||
margin: -45px auto; | margin: -45px auto; | ||
padding: | padding: 105px 6px 6px; | ||
min-height: 100vh; | min-height: 100vh; | ||
box-shadow: 0px 0px 10px 0px; | box-shadow: 0px 0px 10px 0px; | ||
} | |||
.postedit-container { | |||
margin-top: 45px; | |||
} | } | ||
Line 24: | Line 28: | ||
} | } | ||
h1,h2,h3,h4 { | h1,h2,h3,h4,h5,h6 { | ||
font-family: Abel; | font-family: Abel, sans-serif; | ||
margin-top: 0.5em; | margin-top: 0.5em; | ||
margin-bottom: 0.2em; | margin-bottom: 0.2em; | ||
} | } | ||
h1 span, h2 span, h3 span, h4 span { | h1 span, h2 span, h3 span, h4 span, h5 span, h6 span { | ||
display: inline | display: inline | ||
} | |||
#mw-content-text h3:first-of-type { | |||
margin-top: 0; | |||
} | } | ||
Line 39: | Line 47: | ||
a { | a { | ||
color: # | color: #008970; | ||
} | |||
table { | |||
width: auto; | |||
} | |||
/* Top bar */ | |||
.top-bar { | |||
position: fixed; | |||
width: 100%; | |||
top: 0; | |||
width: 100%; | |||
z-index: 10000; | |||
} | |||
.top-bar .name h1 { | |||
font-size: 1.7em | |||
} | |||
.top-bar .name h1 a:hover { | |||
text-shadow: 0px 0px 10px white; | |||
} | |||
.top-bar li.hover>a { | |||
text-shadow: 0px 0px 10px #f7ffff; | |||
} | } | ||
Line 47: | Line 81: | ||
font-size: 3em; | font-size: 3em; | ||
border-bottom: 1px black solid; | border-bottom: 1px black solid; | ||
text-shadow: 3px 0px 0px white, -3px 0px 0px white,5px 0px 0px white, -5px 0px 0px white; | |||
padding-right: 2em; | |||
} | |||
h3#tagline { | |||
text-align: right; | |||
margin-top: -1.7em; | |||
font-style: normal; | |||
font-family: Play; | |||
padding-bottom: 0.8em; | |||
} | } | ||
Line 54: | Line 98: | ||
padding: 15px; | padding: 15px; | ||
margin: auto; | margin: auto; | ||
display: table; | |||
} | } | ||
Line 63: | Line 108: | ||
div.ic { | div.ic { | ||
text-align: justify; | text-align: justify; | ||
background-color: #2ba6cb0f; | |||
background-color: # | |||
padding: .3em 1em; | padding: .3em 1em; | ||
color: # | color: #333; | ||
font-family: | font-family: Play, sans-serif; | ||
font-weight: 700; | font-weight: 700; | ||
line-height: 20px; | line-height: 20px; | ||
Line 77: | Line 120: | ||
div.thumb { | div.thumb { | ||
background: # | background: #2ba6cb0f; | ||
padding: 0.5em; | padding: 0.5em; | ||
font-size: 0.85em; | font-size: 0.85em; | ||
Line 96: | Line 139: | ||
} | } | ||
.mw-content-ltr .thumbcaption { | |||
line-height: 1.4em; | |||
} | |||
.toc { | /* Table of contents and Series boxes */ | ||
.toctoggle { | |||
display: none; | |||
} | |||
.toc,.categorybox { | |||
display: table; | display: table; | ||
font- | font-size: 0.85em; | ||
border: 1px #ccc solid; | border: 1px #ccc solid; | ||
background: # | background: #2ba6cb0f; | ||
padding: 0. | padding: 0.3em 0.3em 0 0.3em; | ||
float: right; | |||
margin: 0 0 1em 1em; | |||
width: 200px; | |||
max-width: 18em; | |||
} | } | ||
Line 113: | Line 168: | ||
} | } | ||
#mw-content-text .toc ul | .categorybox p { | ||
line-height: 1.2em; | |||
padding: 0 0.2em; | |||
margin: 0; | |||
font-family: Abel, sans-serif; | |||
text-align: center; | |||
} | |||
#mw-content-text .toc ul, #mw-content-text .categorybox ul { | |||
list-style-image: none; | list-style-image: none; | ||
padding-left: 0; | padding-left: 0; | ||
line-height: 1.4em; | line-height: 1.4em; | ||
} | } | ||
.toc ul ul { | #mw-content-text .toc ul ul, #mw-content-text .categorybox ul ul { | ||
margin: 0 0 0 1em; | margin: 0 0 0 1em; | ||
font-size: 90% | |||
} | |||
.tocnumber { | |||
display: none; | |||
} | } | ||
/* Category Container */ | |||
#categories_container { | |||
width: 200px; | |||
max-width: 30vw; | |||
float: right; | |||
margin-left: 16px; | |||
} | } | ||
. | @media only screen and (max-width:600px) { | ||
#categories_container, .toc,.categorybox { | |||
width: 10em; | |||
font-size: 0.9em; | |||
} | |||
} | } |
Latest revision as of 12:26, 20 September 2018
/* Overall site look */
body {
background-attachment: fixed;
background-position: 0% 30%;
background-size:180vw;
background-image: url(http://citadel.camlarp.co.uk/w/images/5/59/38338630751_7851c952eb_o_smaller.jpg);
background-color: #69674f;
}
#page-content {
width: 800px;
min-width: 70%;
max-width: 100%;
background: white;
margin: -45px auto;
padding: 105px 6px 6px;
min-height: 100vh;
box-shadow: 0px 0px 10px 0px;
}
.postedit-container {
margin-top: 45px;
}
footer {
display: none;
}
h1,h2,h3,h4,h5,h6 {
font-family: Abel, sans-serif;
margin-top: 0.5em;
margin-bottom: 0.2em;
}
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span {
display: inline
}
#mw-content-text h3:first-of-type {
margin-top: 0;
}
p {
padding: 0.5em;
}
a {
color: #008970;
}
table {
width: auto;
}
/* Top bar */
.top-bar {
position: fixed;
width: 100%;
top: 0;
width: 100%;
z-index: 10000;
}
.top-bar .name h1 {
font-size: 1.7em
}
.top-bar .name h1 a:hover {
text-shadow: 0px 0px 10px white;
}
.top-bar li.hover>a {
text-shadow: 0px 0px 10px #f7ffff;
}
/* Page titles */
h2.title {
font-size: 3em;
border-bottom: 1px black solid;
text-shadow: 3px 0px 0px white, -3px 0px 0px white,5px 0px 0px white, -5px 0px 0px white;
padding-right: 2em;
}
h3#tagline {
text-align: right;
margin-top: -1.7em;
font-style: normal;
font-family: Play;
padding-bottom: 0.8em;
}
/* IC content boxes */
div.wrap {
padding: 15px;
margin: auto;
display: table;
}
div.small {
max-width: 500px;
margin: auto;
}
div.ic {
text-align: justify;
background-color: #2ba6cb0f;
padding: .3em 1em;
color: #333;
font-family: Play, sans-serif;
font-weight: 700;
line-height: 20px;
margin: 1em 0;
}
/* Image thumbnails */
div.thumb {
background: #2ba6cb0f;
padding: 0.5em;
font-size: 0.85em;
border: 1px #ccc solid;
color: #333;
}
div.tright {
margin-left: 1em;
}
div.tleft {
margin-right: 1em;
}
div.thumb div.thumbinner img {
border: 1px #ccc solid;
}
.mw-content-ltr .thumbcaption {
line-height: 1.4em;
}
/* Table of contents and Series boxes */
.toctoggle {
display: none;
}
.toc,.categorybox {
display: table;
font-size: 0.85em;
border: 1px #ccc solid;
background: #2ba6cb0f;
padding: 0.3em 0.3em 0 0.3em;
float: right;
margin: 0 0 1em 1em;
width: 200px;
max-width: 18em;
}
.toc #toctitle h2 {
font-size: 1.2em;
padding-top: 0;
margin-top: 0;
text-align: center;
}
.categorybox p {
line-height: 1.2em;
padding: 0 0.2em;
margin: 0;
font-family: Abel, sans-serif;
text-align: center;
}
#mw-content-text .toc ul, #mw-content-text .categorybox ul {
list-style-image: none;
padding-left: 0;
line-height: 1.4em;
}
#mw-content-text .toc ul ul, #mw-content-text .categorybox ul ul {
margin: 0 0 0 1em;
font-size: 90%
}
.tocnumber {
display: none;
}
/* Category Container */
#categories_container {
width: 200px;
max-width: 30vw;
float: right;
margin-left: 16px;
}
@media only screen and (max-width:600px) {
#categories_container, .toc,.categorybox {
width: 10em;
font-size: 0.9em;
}
}