MediaWiki

Common.css: Difference between revisions

From Cambridge Larp Society

No edit summary
(Tidied correctly)
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{
box-shadow:0px 0px 6px -2px black;
 
 
z-index: -1;
 
z-index: -1;
 
}
 
}
Line 43: Line 39:
 
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 {
 
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 77:
 
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 117:
 
hyphens: auto;
 
hyphens: auto;
 
}
 
}
  +
 
 
#toctitle > .toctoggle {
 
#toctitle > .toctoggle {
 
display: none;
 
display: none;
 
}
 
}
  +
 
 
#toctitle > h2 {
 
#toctitle > h2 {
 
color: #555;
 
color: #555;
Line 136: Line 128:
 
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;
box-shadow: 0px 0px 8px -2px black;
+
margin: -45px auto;
padding: 45px 25px 25px;
+
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,
 
  +
@media only screen and (min-width:58.75em) {
#navwrapper > .top-bar,
 
#page-content {
+
body {
  +
background: radial-gradient(circle, #78a21b, #224c41) fixed;
box-shadow: none;
 
font-size: 0.9em;
+
font-size: 1em;
 
}
 
}
#page-content {
+
#navwrapper > .top-bar {
padding: 45px 6px 6px;
+
box-shadow: 0px 0px 6px -2px black;
 
}
 
}
  +
.top-bar-section ul li ul.dropdown li.hover > a {
body {
 
  +
box-shadow:0px 10px 6px -10px black inset,0px -10px 6px -10px black inset;
background: white;
 
  +
}
  +
.top-bar-section > ul > li.hover > a {
  +
box-shadow: 10px 0px 6px -10px black inset, -10px 0px 6px -10px black inset;
  +
}
  +
.top-bar-section ul li ul.dropdown {
  +
box-shadow:0px 0px 6px -2px black;
  +
}
  +
#page-content {
  +
box-shadow: 0px 0px 8px -2px black;
  +
padding: 45px 25px 25px;
 
}
 
}
 
#top-bar-right .small-12 {
 
#top-bar-right .small-12 {
padding: 0 15px;
+
padding: 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;

Revision as of 17:12, 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;
   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;
}
.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;
}

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;
}

#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;
}

@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 6px -2px black;
   }
   .top-bar-section ul li ul.dropdown li.hover > a {
      box-shadow:0px 10px 6px -10px black inset,0px -10px 6px -10px black inset;
   }
   .top-bar-section > ul > li.hover > a {
      box-shadow: 10px 0px 6px -10px black inset, -10px 0px 6px -10px black inset;
   }
   .top-bar-section ul li ul.dropdown {
      box-shadow:0px 0px 6px -2px black;
   }
   #page-content {
      box-shadow: 0px 0px 8px -2px black;
      padding: 45px 25px 25px;
   }
   #top-bar-right .small-12 {
      padding: 0;
   }
}

.f-dropdown::before, .f-dropdown::after {
    display: none;
}

#drop1 {
   right: 15px !important;
   left: unset !important;
}