Common.css: Difference between revisions
From Cambridge Larp Society
Cryptophage (talk | contribs) No edit summary |
Cryptophage (talk | contribs) m (fixing a thing) |
||
(47 intermediate revisions by the same user not shown) | |||
Line 9: | Line 9: | ||
color: #FFFFFF; |
color: #FFFFFF; |
||
} |
} |
||
+ | |||
− | |||
#navwrapper > .top-bar { |
#navwrapper > .top-bar { |
||
margin: 0; |
margin: 0; |
||
− | box-shadow: 0px 0px 6px -2px black; |
||
z-index: 1; |
z-index: 1; |
||
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; |
||
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; |
||
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{ |
||
+ | z-index: -1 !important; |
||
− | box-shadow:0px 0px 6px -2px black; |
||
− | z-index: -1; |
||
} |
} |
||
+ | |||
− | .has-dropdown { |
||
− | 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 8px 8px 0; |
} |
} |
||
+ | |||
− | |||
− | #top-bar-right .small-12 { |
||
− | 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 74: | ||
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, #footer .poweredby { |
display: none; |
display: none; |
||
} |
} |
||
+ | |||
− | |||
#toc { |
#toc { |
||
float:right; |
float:right; |
||
Line 125: | Line 114: | ||
hyphens: auto; |
hyphens: auto; |
||
} |
} |
||
+ | |||
− | |||
#toctitle > .toctoggle { |
#toctitle > .toctoggle { |
||
display: none; |
display: none; |
||
} |
} |
||
+ | |||
− | |||
#toctitle > h2 { |
#toctitle > h2 { |
||
color: #555; |
color: #555; |
||
Line 136: | Line 125: | ||
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 { |
||
− | background: radial-gradient(circle, #78a21b, #224c41) fixed; |
||
− | } |
||
− | |||
#page-content { |
#page-content { |
||
width: 800px; |
width: 800px; |
||
min-width: 70%; |
min-width: 70%; |
||
max-width: 100%; |
max-width: 100%; |
||
− | margin: -45px auto; |
||
background: white; |
background: white; |
||
− | + | margin: -45px auto; |
|
− | padding: 45px |
+ | padding: 45px 6px 6px; |
− | min-height: 100vh; |
||
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif; |
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif; |
||
+ | min-height: 100vh; |
||
} |
} |
||
+ | |||
− | |||
.row { |
.row { |
||
max-width: 100%; |
max-width: 100%; |
||
} |
} |
||
+ | |||
− | |||
+ | body { |
||
− | @media only screen and (max-width:58.75em) { |
||
+ | font-size: 0.9em; |
||
− | .top-bar-section ul li ul.dropdown li.hover > a, |
||
+ | } |
||
− | .top-bar-section > ul > li.hover > a, |
||
+ | |||
− | .top-bar-section ul li ul.dropdown, |
||
+ | #mw-content-text > .mw-parser-output > .floatleft img, #mw-content-text > .mw-parser-output > .floatright img { |
||
− | #navwrapper > .top-bar, |
||
− | + | border-radius: 4px; |
|
+ | } |
||
− | box-shadow: none; |
||
+ | |||
− | font-size: 0.9em; |
||
+ | #mw-content-text > .mw-parser-output> .floatleft, #mw-content-text > .mw-parser-output > .floatright { |
||
+ | padding: 0.5em; |
||
+ | } |
||
+ | |||
+ | @media only screen and (min-width:58.75em) { |
||
+ | body { |
||
+ | background: radial-gradient(circle, #78a21b, #224c41) fixed; |
||
+ | font-size: 1em; |
||
} |
} |
||
− | # |
+ | #navwrapper > .top-bar { |
− | + | box-shadow: 0px 0px 8px -2px black; |
|
} |
} |
||
− | + | .title-area { |
|
− | + | z-index: 1; |
|
+ | } |
||
+ | .top-bar-section { |
||
+ | height: 100%; |
||
+ | background: #333; |
||
+ | } |
||
+ | .top-bar-section ul li ul.dropdown li.hover > a { |
||
+ | box-shadow:0px 10px 8px -10px black inset,0px -10px 8px -10px black inset; |
||
+ | } |
||
+ | .top-bar-section > ul > li.hover > a { |
||
+ | box-shadow: 10px 0px 8px -10px black inset, -10px 0px 8px -10px black inset; |
||
+ | } |
||
+ | .top-bar-section ul li ul.dropdown { |
||
+ | box-shadow:0px 0px 8px -2px black; |
||
+ | } |
||
+ | #page-content { |
||
+ | box-shadow: 0px 0px 10px -2px black; |
||
+ | padding: 45px 25px 25px; |
||
} |
} |
||
#top-bar-right .small-12 { |
#top-bar-right .small-12 { |
||
− | padding: 0 |
+ | padding: 0; |
+ | } |
||
+ | #top-bar-right .has-dropdown > a { |
||
+ | padding-left: 10px; |
||
+ | } |
||
+ | #personal-tools-dropdown { |
||
+ | z-index: auto; |
||
+ | } |
||
+ | #mw-content-text > .floatleft { |
||
+ | padding-right: 1.5em; |
||
+ | padding-left: 0; |
||
+ | } |
||
+ | |||
+ | #mw-content-text > .floatright { |
||
+ | padding-left: 1.5em; |
||
+ | padding-right: 0; |
||
} |
} |
||
} |
} |
||
+ | |||
− | |||
.f-dropdown::before, .f-dropdown::after { |
.f-dropdown::before, .f-dropdown::after { |
||
display: none; |
display: none; |
||
} |
} |
||
+ | |||
− | |||
#drop1 { |
#drop1 { |
||
right: 15px !important; |
right: 15px !important; |
Latest revision as of 01:03, 15 December 2020
/* 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;
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 {
background:#111;
}
.top-bar-section > ul > li.hover > a{
background:#222;
}
.top-bar-section ul li ul.dropdown li > a {
background:#222;
}
.top-bar-section ul li ul.dropdown{
z-index: -1 !important;
}
#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 8px 8px 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, #footer .poweredby {
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;
}
#page-content {
width: 800px;
min-width: 70%;
max-width: 100%;
background: white;
margin: -45px auto;
padding: 45px 6px 6px;
font-family: "Calibri", "Helvetica Neue", "Arial", Sans-Serif;
min-height: 100vh;
}
.row {
max-width: 100%;
}
body {
font-size: 0.9em;
}
#mw-content-text > .mw-parser-output > .floatleft img, #mw-content-text > .mw-parser-output > .floatright img {
border-radius: 4px;
}
#mw-content-text > .mw-parser-output> .floatleft, #mw-content-text > .mw-parser-output > .floatright {
padding: 0.5em;
}
@media only screen and (min-width:58.75em) {
body {
background: radial-gradient(circle, #78a21b, #224c41) fixed;
font-size: 1em;
}
#navwrapper > .top-bar {
box-shadow: 0px 0px 8px -2px black;
}
.title-area {
z-index: 1;
}
.top-bar-section {
height: 100%;
background: #333;
}
.top-bar-section ul li ul.dropdown li.hover > a {
box-shadow:0px 10px 8px -10px black inset,0px -10px 8px -10px black inset;
}
.top-bar-section > ul > li.hover > a {
box-shadow: 10px 0px 8px -10px black inset, -10px 0px 8px -10px black inset;
}
.top-bar-section ul li ul.dropdown {
box-shadow:0px 0px 8px -2px black;
}
#page-content {
box-shadow: 0px 0px 10px -2px black;
padding: 45px 25px 25px;
}
#top-bar-right .small-12 {
padding: 0;
}
#top-bar-right .has-dropdown > a {
padding-left: 10px;
}
#personal-tools-dropdown {
z-index: auto;
}
#mw-content-text > .floatleft {
padding-right: 1.5em;
padding-left: 0;
}
#mw-content-text > .floatright {
padding-left: 1.5em;
padding-right: 0;
}
}
.f-dropdown::before, .f-dropdown::after {
display: none;
}
#drop1 {
right: 15px !important;
left: unset !important;
}