Common.css: Difference between revisions
From Cambridge Larp Society
Cryptophage (talk | contribs) Undo revision 494 by Cryptophage (talk) |
Cryptophage (talk | contribs) No edit summary |
||
Line 9: | Line 9: | ||
color: #FFFFFF; | color: #FFFFFF; | ||
} | } | ||
#navwrapper > .top-bar { | #navwrapper > .top-bar { | ||
margin: 0; | margin: 0; | ||
Line 16: | Line 16: | ||
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif; | font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif; | ||
} | } | ||
.top-bar-section > ul > .divider, | .top-bar-section > ul > .divider, | ||
.top-bar-section > ul > [role="separator"] { | .top-bar-section > ul > [role="separator"] { | ||
border-color: #333; | border-color: #333; | ||
} | } | ||
.top-bar-section ul li ul.dropdown li.hover > a { | .top-bar-section ul li ul.dropdown li.hover > a { | ||
box-shadow:0px 10px 6px -10px black inset,0px -10px 6px -10px black inset; | box-shadow:0px 10px 6px -10px black inset,0px -10px 6px -10px black inset; | ||
background:#111; | background:#111; | ||
} | } | ||
.top-bar-section > ul > li.hover > a{ | .top-bar-section > ul > li.hover > a{ | ||
box-shadow: 10px 0px 6px -10px black inset, -10px 0px 6px -10px black inset; | box-shadow: 10px 0px 6px -10px black inset, -10px 0px 6px -10px black inset; | ||
background:#222; | background:#222; | ||
} | } | ||
.top-bar-section ul li ul.dropdown li > a { | .top-bar-section ul li ul.dropdown li > a { | ||
background:#222; | background:#222; | ||
} | } | ||
.top-bar-section ul li ul.dropdown{ | .top-bar-section ul li ul.dropdown{ | ||
box-shadow:0px 0px 6px -2px black; | box-shadow:0px 0px 6px -2px black; | ||
Line 43: | Line 43: | ||
z-index: 1; | z-index: 1; | ||
} | } | ||
#top-bar-left a { | #top-bar-left a { | ||
font-size: 0.8125em; | font-size: 0.8125em; | ||
} | } | ||
#top-bar-right > li { | #top-bar-right > li { | ||
padding: 0; | padding: 0; | ||
} | } | ||
#top-bar-right button { | #top-bar-right button { | ||
display: none; | display: none; | ||
} | } | ||
#top-bar-right form{ | #top-bar-right form{ | ||
position: relative; | position: relative; | ||
margin: 8px 0; | margin: 8px 0; | ||
} | } | ||
#top-bar-right .small-12 { | #top-bar-right .small-12 { | ||
padding: 0; | padding: 0; | ||
} | } | ||
h1, h2, h3, h4, h5, h6 { | h1, h2, h3, h4, h5, h6 { | ||
color: #e65001; | color: #e65001; | ||
font-family: "Trebuchet MS", "Helvetica Neue", "Arial", Sans-Serif; | font-family: "Trebuchet MS", "Helvetica Neue", "Arial", Sans-Serif; | ||
} | } | ||
h1 { | h1 { | ||
font-size: 1.8em; | font-size: 1.8em; | ||
} | } | ||
h2.title{ | h2.title{ | ||
font-size: 2em; | font-size: 2em; | ||
} | } | ||
h2 > span { | h2 > span { | ||
display: inline; | display: inline; | ||
Line 85: | Line 85: | ||
font-size: 1.5em; | font-size: 1.5em; | ||
} | } | ||
h3 { | h3 { | ||
margin-top: 0.9em; | margin-top: 0.9em; | ||
} | } | ||
.ns-subject h3{ | .ns-subject h3{ | ||
font-size: 1.15em; | font-size: 1.15em; | ||
} | } | ||
h4 { | h4 { | ||
font-size: 1em; | font-size: 1em; | ||
} | } | ||
p { | p { | ||
margin-bottom: 0.6em; | margin-bottom: 0.6em; | ||
font-size: 1.04em; | font-size: 1.04em; | ||
} | } | ||
h1.title-name.title-name > a { | h1.title-name.title-name > a { | ||
display: inline-block; | display: inline-block; | ||
width: auto; | width: auto; | ||
} | } | ||
#footer-lastmod, #footer-viewcount, #tagline { | #footer-lastmod, #footer-viewcount, #tagline { | ||
display: none; | display: none; | ||
} | } | ||
#toc { | #toc { | ||
float:right; | float:right; | ||
Line 125: | Line 125: | ||
hyphens: auto; | hyphens: auto; | ||
} | } | ||
#toctitle > .toctoggle { | #toctitle > .toctoggle { | ||
display: none; | display: none; | ||
} | } | ||
#toctitle > h2 { | #toctitle > h2 { | ||
color: #555; | color: #555; | ||
Line 136: | Line 136: | ||
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif; | font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif; | ||
} | } | ||
#toc#toc ul { | #toc#toc ul { | ||
color: #aaa; | color: #aaa; | ||
margin: 0 0 0 1em; | margin: 0 0 0 1em; | ||
} | } | ||
#toc .tocnumber { | #toc .tocnumber { | ||
display: none; | display: none; | ||
} | } | ||
body { | body { | ||
background: radial-gradient(circle, #78a21b, #224c41) fixed; | background: radial-gradient(circle, #78a21b, #224c41) fixed; | ||
} | } | ||
#page-content { | #page-content { | ||
width: 800px; | width: 800px; | ||
Line 160: | Line 160: | ||
min-height: 100vh; | min-height: 100vh; | ||
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif; | font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif; | ||
} | } | ||
.row { | .row { | ||
max-width: 100%; | max-width: 100%; | ||
} | } | ||
@media only screen and (max-width:58.75em) { | @media only screen and (max-width:58.75em) { | ||
.top-bar-section ul li ul.dropdown li.hover > a, | .top-bar-section ul li ul.dropdown li.hover > a, | ||
Line 186: | Line 185: | ||
} | } | ||
} | } | ||
.f-dropdown::before, .f-dropdown::after { | .f-dropdown::before, .f-dropdown::after { | ||
display: none; | display: none; | ||
} | } | ||
#drop1 { | #drop1 { | ||
right: 15px !important; | right: 15px !important; | ||
left: unset !important; | left: unset !important; | ||
} | } |
Revision as of 18:10, 22 June 2016
/* Custom Foreground menubar colors */
.top-bar,
.top-bar .name h1 a,
.top-bar-section ul,
.top-bar-section ul li.active > a,
.top-bar-section li a:not(.button),
.top-bar-section .has-form {
background: #333;
color: #FFFFFF;
}
#navwrapper > .top-bar {
margin: 0;
box-shadow: 0px 0px 6px -2px black;
z-index: 1;
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif;
}
.top-bar-section > ul > .divider,
.top-bar-section > ul > [role="separator"] {
border-color: #333;
}
.top-bar-section ul li ul.dropdown li.hover > a {
box-shadow:0px 10px 6px -10px black inset,0px -10px 6px -10px black inset;
background:#111;
}
.top-bar-section > ul > li.hover > a{
box-shadow: 10px 0px 6px -10px black inset, -10px 0px 6px -10px black inset;
background:#222;
}
.top-bar-section ul li ul.dropdown li > a {
background:#222;
}
.top-bar-section ul li ul.dropdown{
box-shadow:0px 0px 6px -2px black;
z-index: -1;
}
.has-dropdown {
z-index: 1;
}
#top-bar-left a {
font-size: 0.8125em;
}
#top-bar-right > li {
padding: 0;
}
#top-bar-right button {
display: none;
}
#top-bar-right form{
position: relative;
margin: 8px 0;
}
#top-bar-right .small-12 {
padding: 0;
}
h1, h2, h3, h4, h5, h6 {
color: #e65001;
font-family: "Trebuchet MS", "Helvetica Neue", "Arial", Sans-Serif;
}
h1 {
font-size: 1.8em;
}
h2.title{
font-size: 2em;
}
h2 > span {
display: inline;
}
h2 {
margin-top: 0.9em;
font-size: 1.5em;
}
h3 {
margin-top: 0.9em;
}
.ns-subject h3{
font-size: 1.15em;
}
h4 {
font-size: 1em;
}
p {
margin-bottom: 0.6em;
font-size: 1.04em;
}
h1.title-name.title-name > a {
display: inline-block;
width: auto;
}
#footer-lastmod, #footer-viewcount, #tagline {
display: none;
}
#toc {
float:right;
font-size:0.8em;
padding: 0 8px 8px;
background: #f9f9f9;
border: thin solid #aaa;
margin: 0px 0px 8px 16px;
max-width: 30vw;
border-radius: 4px;
word-wrap: break-word;
hyphens: auto;
}
#toctitle > .toctoggle {
display: none;
}
#toctitle > h2 {
color: #555;
font-size: 1.1em;
text-transform: uppercase;
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif;
}
#toc#toc ul {
color: #aaa;
margin: 0 0 0 1em;
}
#toc .tocnumber {
display: none;
}
body {
background: radial-gradient(circle, #78a21b, #224c41) fixed;
}
#page-content {
width: 800px;
min-width: 70%;
max-width: 100%;
margin: -45px auto;
background: white;
box-shadow: 0px 0px 8px -2px black;
padding: 45px 25px 25px;
min-height: 100vh;
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif;
}
.row {
max-width: 100%;
}
@media only screen and (max-width:58.75em) {
.top-bar-section ul li ul.dropdown li.hover > a,
.top-bar-section > ul > li.hover > a,
.top-bar-section ul li ul.dropdown,
#navwrapper > .top-bar,
#page-content {
box-shadow: none;
font-size: 0.9em;
}
#page-content {
padding: 45px 6px 6px;
}
body {
background: white;
}
#top-bar-right .small-12 {
padding: 0 15px;
}
}
.f-dropdown::before, .f-dropdown::after {
display: none;
}
#drop1 {
right: 15px !important;
left: unset !important;
}