MediaWiki:Foreground.css
From Mahara Wiki
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* CSS placed here will be applied to the Foreground skin */
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i&display=swap&subset=latin-ext');
html,
body,
.mw-body,
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6,
.mw-body a,
.mw-body p {
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
a,
a:visited,
li a,
li a:visited,
.mw-body a.text,
.mw-body a.text:visited,
.mw-body a.external,
.mw-body a.external:visited,
div.vectorMenu li a,
div.vectorMenu li a:visited,
div.vectorTabs li a,
div.vectorTabs li a:visited,
div.vectorTabs li.new a,
div.vectorTabs li.new a:visited,
a.new,
a.new:visited,
#p-personal a.new:visited,
div#mw-panel div.portal div.body ul li a,
div#mw-panel div.portal div.body ul li a:visited {
color: #566d31;
}
a:hover {
color: #566d31;
text-decoration: underline;
}
div#mw-panel div.portal div.body ul li {
font-size: 0.8em;
}
body,
#mw-page-base {
background: #FFF;
}
ul {
list-style-image: none;
}
nav.top-bar,
nav.top-bar-section {
background: #f5f7f1;
color: #000000;
}
.mw-search-result-data {
color: #636363;
font-size: 90%;
}
.mw-body {
border-color: #919191;
border-top: 0;
margin-top: 12px;
padding-top: 0;
}
div.vectorMenu {
background: #fff;
}
div.vectorTabs {
background-image: none;
border-left: 0;
}
div.vectorTabs ul {
background-image: none;
}
div.vectorTabs ul li {
background-image: none;
background-color: transparent;
background: #fff;
}
div.vectorTabs span,
div#mw-head div.vectorMenu h3 {
background-image: none;
border-right: 0;
}
div.vectorTabs li.selected span {
border-bottom: 2px solid #566d31;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
background-color: #566d31;
border-color: #566d31;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
background-color: #2e391c;
border-color: #2e391c;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active {
background-color: #2e391c;
border-color: #2e391c;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus,
.oo-ui-textInputWidget.oo-ui-widget-enabled input:focus, .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus {
border-color: #2e391c;
box-shadow: inset 0 0 0 1px #566d31,inset 0 0 0 2px #fff;
}
.fa {
color: #2e391c;
}
.btn {
border-color: grey;
}
div.title-name div.title-name {
display: none !important;
}
.top-bar-section ul li {
background: transparent;
}
.top-bar-section ul li > a,
.top-bar-section li.active:not(.has-form) a:not(.button) {
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #566d31;
background: transparent;
font-weight: 700;
}
.top-bar-section ul li > a:hover,
.top-bar-section ul li > a:active,
.top-bar-section ul li > a:visited,
.top-bar-section ul li > a:focused,
.top-bar-section li.active:not(.has-form) a:hover:not(.button),
.top-bar-section li.active:not(.has-form) a:not(.button):hover {
color: #566d31;
background: #FFFFFF;
}
.top-bar-section ul li > a > .fa {
color: #566d31;
}
@media only screen and (min-width: 40.0625em) {
.top-bar-section .has-form {
background: transparent;
}
.top-bar-section .has-dropdown > a {
padding: 0 0.9375rem !important;
}
.top-bar-section li.active:not(.has-form) a:not(.button):hover {
color: #566d31;
background: #FFFFFF;
}
.top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button) {
color: #FFFFFF !important;
background: #566d31;
font-weight: 400;
}
.top-bar-section .dropdown li:not(.has-form):not(.active):hover > a:not(.button),
.top-bar-section .dropdown li:not(.has-form):not(.active):hover > a:not(.button):hover,
.top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button):hover {
color: #FFFFFF !important;
background: #2e3a1c;
font-weight: 400;
}
.top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button) .fa {
color: #FFFFFF;
}
.top-bar-section .dropdown li.active:not(.has-form) a:not(.button) {
color: #566d31;
background: #FFFFFF;
}
}
.top-bar .toggle-topbar a,
.top-bar .toggle-topbar.menu-icon a {
color: #566d31;
}
.top-bar .toggle-topbar.menu-icon a span::after {
box-shadow: 0 0 0 1px #566d31, 0 7px 0 1px #566d31, 0 14px 0 1px #566d31;
}
.top-bar.expanded .title-area {
background: #f5f7f1;
}
@media only screen and (max-width: 640px) {
.top-bar-section .divider, .top-bar-section [role="separator"] {
border-color: #d1d1d1;
}
.top-bar-section ul,
#personal-tools-dropdown {
border-top: 1px solid #d1d1d1;
}
.top-bar-section ul {
border-bottom: 1px solid #d1d1d1;
}
.top-bar-section ul:first-child {
border-top: 0;
}
}
button, .button, a.button {
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
background-color: #566d31;
border-color: #566d31;
color: #FFFFFF !important;
}
button:hover, button:focus, .button:hover, .button:focus, a.button:hover, a.button:focus {
background-color: #566d31;
border-color: #566d31;
color: #FFFFFF !important;
}
button.radius, .button.radius, a.button {
border-radius: 30px;
}
.fa .show-for-medium-up {
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
footer.row {
background-color: #556d32;
padding-top: 20px;
padding-bottom: 20px;
color: #9db577;
max-width: 100%;
}
footer.row a {
color: #9db577;
}
.top-bar .button.search {
border-radius: 0 20px 20px 0;
font-size: 12px;
margin-left: -4px;
}
.top-bar input[type="search"] {
border-radius: 20px 0 0 20px;
border: 1px solid #566d31;
box-shadow: none;
font-size: 12px;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
h1#firstHeading {
font-weight: 300;
}
input[type="submit"] {
background: #566d31;
border: 0;
border-radius: 20px;
box-shadow: none;
}
.top-bar {
padding: 5px 0;
}
.label {
background-color: #e7e7e7;
color: #000000;
}
.toctogglelabel {
color: #566d31;
}
.text-center #footer-left {
float: left;
}