Commit 1b91c170 authored by Evonne Cheung's avatar Evonne Cheung Committed by Robert Lyon
Browse files

Updating the default and primary school themes



Change-Id: Iafc11e7488d4aa3a4c99d44d7bcadee8f262de04
Signed-off-by: Robert Lyon's avatarRobert Lyon <robertl@catalyst.net.nz>
parent 5ad8187c
// Generic custom css (anything longer than a screen view should have its own component file)
.blocktype-radio {
display: none;
// change the colour of the sideblock file quota progress bar
.progress-bar {
background-color: #84a421;
}
.login {
.form-group.button,
.form-group.submit {
padding-top: 10px;
// blog post headings
.myblogs {
h1 {
border-bottom: 0;
padding-bottom: 0;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-family: $font-family-sans-serif;
color: #333333;
font-weight: 700;
}
.list-group-item-heading {
font-family: $font-family-serif;
color: #474220;
font-weight: 300;
}
.postdescription {
border-top: 1px dotted #d1d1d1;
}
}
.form-group .errmsg {
margin-left: 0;
// makes the edit page toolbar position more fitting for this theme, plus responsive position
// when there is a static second level nav
.static-nav {
.toolbar-affix.affix {
top: 160px;
@media (max-width: $screen-sm-min) {
top: 0;
}
}
}
// when there is a dropdown second level nav
.dropdown-nav {
.toolbar-affix.affix {
top: 130px;
@media (max-width: $screen-sm-min) {
top: 0;
}
}
}
.progress-bar {
background-color: #84a421;
// viewfooter
.viewfooter {
padding: 15px !important;
background-color: #f7f7f7;
border-radius: 10px;
margin-top: 20px;
h3:first-child {
margin-top: 0;
}
h4:first-child {
margin-top: 0;
}
.pieform {
.files {
.btn {
margin-left: 0; // fixes the attach file btn alignment
}
}
}
}
// Groups join group button out of alignment, this needs porting back to raw
.join-group {
.form-group {
border-bottom: 0;
padding: 0;
}
}
// Groups accept/decline to join group buttons out of alignment, this needs porting back to raw
.group-request {
.form-group {
border-bottom: 0;
padding: 0;
.button {
display: inline-block;
}
}
}
\ No newline at end of file
......@@ -18,7 +18,6 @@
&.nav > li {
> a, button {
color: $arrow-link-color;
font-size: $font-size-small;
@media (max-width: $screen-sm-min) {
margin-top: 2px;
......
......@@ -11,7 +11,7 @@
}
// Lime buttons
// Grey buttons
.btn,
.btn-default {
@include gradient-vertical($start-color: #FFFFFF, $end-color: #ececec, $start-percent: 10%, $end-percent: 100%);
......@@ -27,7 +27,8 @@
// Green buttons
.btn-success,
.btn-primary {
.btn-primary,
.btn-with-heading {
@include gradient-vertical($start-color: #99b92d, $end-color: #66860f, $start-percent: 0%, $end-percent: 100%);
border-color: #66860f;
color: #FFFFFF;
......@@ -39,4 +40,19 @@
border-color: #202c01;
color: #FFFFFF;
}
}
// cleans up some btns that went bung after the styles above
.form-group.submitcancel .cancel {
background: none;
}
// forum buttons
.forum-post-btns {
border-top: 1px dotted #ececec;
padding: 10px;
a {
color: $theme-primary-color;
}
}
\ No newline at end of file
//dash
.collapse-indicator {
color: $theme-primary-color;
.collapsed & {
color: $theme-primary-color;
}
a:hover &,
a:focus & {
color: lighten($theme-primary-color, 10%);
}
}
//dash inner
//messages: inbox, sent
//admin: site options
//journals
.inboxblock .link-block,
.form-notificationlist h4 a,
.pieform-fieldset.collapsible h4 a,
.myblogs h5 a {
&:hover .collapse-indicator,
&:focus .collapse-indicator{
color: lighten($theme-primary-color, 10%);
}
.collapse-indicator {
color: $theme-primary-color;
}
}
.expand-indicator {
+ .icon {
color: $theme-primary-color;
&:hover, &:focus {
color: lighten($theme-primary-color, 10%);
}
}
}
// syntax change if link is an outer-link
[data-toggle="collapse"].outer-link {
&.collapsed {
~ .collapse-indicator {
color: $theme-primary-color;
}
}
&:hover,
&:focus {
~ .collapse-indicator {
color: lighten($theme-primary-color, 5%);
}
}
}
.list-group-item-link {
a {
color: $theme-primary-color;
&:hover {
color: lighten($theme-primary-color, 5%);
background-color: rgba(250, 255, 234, 0.3);
}
}
}
.outer-link {
&:focus,
&:hover {
background-color: rgba(250, 255, 234, 0.2);
}
}
\ No newline at end of file
.header {
.navbar-toggle {
margin-top: 14px;
margin-top: 18px;
@include gradient-vertical($start-color: #FFFFFF, $end-color: #ececec, $start-percent: 10%, $end-percent: 100%);
border-color: #dddddd;
color: #676767;
&:focus,
&:hover {
color: #333333;
}
}
.navbar-nav {
.navbar-toggle {
......
.site-messages {
~ .header {
top: 33px; //for one message
......@@ -27,13 +24,13 @@
}
}
~ .container {
~ .middle-container-wrap .container {
.toolbar-affix.affix {
margin-top: $i * 33px;
}
}
+ .container {
+ .middle-container-wrap .container {
// if container is directly after header, then it will need a margin
margin-top: ($i * 33px);
}
......@@ -42,12 +39,12 @@
// when there is a static second level nav
.static-nav {
padding-top: 140px;
padding-top: 138px;
@media (max-width: $screen-sm-min) {
padding-top: 0;
}
.header {
height: 140px;
height: 138px;
@media (max-width: $screen-sm-min) {
height: 65px;
}
......
......@@ -2,6 +2,7 @@
background-image: url(../images/header-bkgd.png);
background-repeat: repeat-x;
background-position: left top;
background-color: #FFFFFF;
top: 0;
.logo-area {
......
.profile-block.panel-heading {
min-height: 80px;
.username {
&:hover {
text-decoration: underline;
.sidebar {
.profile-block.panel-heading {
min-height: 80px;
.username {
&:hover {
text-decoration: underline;
}
}
}
a {
color: #FFFFFF;
&:after {
border-radius: 30px;
bottom: 0px;
a {
color: #FFFFFF;
&:after {
border-radius: 30px;
bottom: 0px;
}
}
}
}
......
......@@ -33,13 +33,19 @@
// Only shown on mobile, or when dropdowns are turned on
.child-nav {
padding: 0;
@media (max-width: $screen-sm-min) {
background-color: #ececec;
}
li {
a {
padding: 10px 20px;
font-weight: 300;
color: $theme-primary-color;
&:hover, &:focus {
background-color: #FFFFFF;
background-color: #eff6eb;
font-weight: 300;
}
}
}
......@@ -48,10 +54,12 @@
.active > a {
background-color: $theme-primary-color;
color: #FFFFFF;
font-weight: 700;
&:hover, &:focus {
color: #FFFFFF;
background-color: darken($theme-primary-color, 5%);
font-weight: 700;
}
}
}
......
......@@ -14,7 +14,7 @@
@media (min-width: $screen-xs-min) and (max-width: $screen-md-min) {
clear: none;
margin-top: 8px;
margin-top: 12px;
}
@media (max-width: $screen-sm-min - 1) {
......@@ -48,16 +48,21 @@
}
>.active {
> a,
> a {
font-weight: 300;
background-color: #FFFFFF;
color: $navbar-default-link-active-color;
}
> a:hover,
> a:focus {
background-color: $navbar-default-link-active-bg;
color: $navbar-default-link-active-color;
background-color: #FFFFFF;
color: $navbar-default-link-color;
font-weight: 300;
@media (max-width: $screen-sm-min - 1) {
border-top-color: rgba(darken($navbar-inverse-bg, 7%), 0.5);
border-top-color: 0;
color: $navbar-inverse-link-hover-color;
background-color: $navbar-inverse-link-hover-bg;
background-color: #FFFFFF;
}
}
}
......@@ -92,12 +97,22 @@
margin-top: 6px;
}
}
.container {
@media (max-width: $screen-sm-min) {
background-color: #f5f6f6;
}
}
}
.main-nav {
.mainnav-search {
margin-top: 2px;
margin-bottom: 0;
}
.navbar-form {
@media (max-width: $screen-sm-min) {
display: none;
}
}
.header-search-form {
display: inline-block;
@media (max-width: $screen-md-min) {
......
.top-nav.navbar-nav {
margin: 10px 0 0 0;
margin: 15px 0 0 0;
padding: 0;
font-size: 13px;
text-align: right;
@media (max-width: $screen-md-min) {
position: inherit;
right: auto;
background-color: transparent;
border-radius: 0;
margin: 15px 10px;
font-size: 14px;
}
> li {
> a {
&:focus,
&:hover {
color: lighten($theme-primary-color, 8%);
background-color: transparent;
}
}
&:last-child {
......@@ -28,5 +34,10 @@
margin-left: 5px;
}
}
.div {
@media (max-width: $screen-md-min) {
display: inline-block;
}
}
}
}
\ No newline at end of file
......@@ -13,18 +13,9 @@
}
.panel-heading {
// sidebar panel headings
.sidebar .panel-default > .panel-heading {
@include border-top-radius(0);
.metadata {
color: #eef3e9;
font-size: 11px;
margin-top: 5px;
}
}
.panel-default > .panel-heading {
border-bottom: 0;
background-color: $theme-primary-color;
color: #FFFFFF;
......@@ -36,4 +27,20 @@
a {
color: #FFFFFF;
}
.metadata {
color: #eef3e9;
font-size: 11px;
margin-top: 5px;
}
}
.panel.collapsible {
.panel-heading-nested,
.panel-heading {
> a.outer-link {
border-color: #ddd;
}
}
}
......@@ -9,4 +9,32 @@
border-left: 0;
}
}
.blockinstance-controls .btn-group-top {
@media (max-width: $screen-md-min) {
margin: 0;
}
.btn {
@include gradient-vertical($start-color: #FFFFFF, $end-color: #ececec, $start-percent: 10%, $end-percent: 100%);
border-top: 1px solid #dddddd;
}
}
// removing left/right padding in panel headings
.panel-heading-nested,
> .panel-heading {
padding-left: 0;
padding-right: 0;
}
// removing left/right padding in panel body
> .panel-body {
padding: 15px 0;
}
.block {
> .panel-body {
padding: 15px 0;
}
}
}
// tinymce heading font
.mce-content-body {
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-family: $font-family-sans-serif !important;
color: #474220;
font-weight: 300;
}
h1 {
border-bottom: 0;
padding-bottom: 0;
}
}
\ No newline at end of file
// File imported by tiny mce
@import "../../raw/sass/utilities/theme-variables";
@import "../../raw/sass/utilities/bootstrap-variables";
@import "../../raw/sass/utilities/custom-variables";
// Import our theme based variables (colors, fonts, padding, etc)
@import "utilities/theme-variables"; // Import our theme variables
@import "utilities/bootstrap-variables"; // ...and our custom bootstrap variables file
@import "utilities/custom-variables"; // ...and our custom variables file
@import "../../../lib/bootstrap/assets/stylesheets/bootstrap/mixins";
@import "../../raw/sass/utilities/mixins";
@import "../../../lib/bootstrap/assets/stylesheets/bootstrap/scaffolding";
@import "../../../lib/bootstrap/assets/stylesheets/bootstrap/type";
@import "../../../lib/bootstrap/assets/stylesheets/bootstrap/code";
@import "../../../lib/bootstrap/assets/stylesheets/bootstrap/grid";
@import "../../../lib/bootstrap/assets/stylesheets/bootstrap/tables";
@import "../../../lib/bootstrap/assets/stylesheets/bootstrap/forms";
@import "../../../lib/bootstrap/assets/stylesheets/bootstrap/buttons";
@import "typography/fonts";
@import "../../raw/sass/typography/typography";
@import "../../raw/sass/typography/tables";
@import "../../raw/sass/typography/text";
@import "typography/typography";
\ No newline at end of file
......@@ -40,5 +40,4 @@ $opensans: (
url('#{$font-path}/breeserif/breeserif.svg#breeserif') format('svg');
font-weight: normal;
font-style: normal;
}
}
\ No newline at end of file
// tinymce heading font
.mce-content-body {
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
color: #000000;
font-family: $font-family-sans-serif;
color: #333333;
font-weight: 700;
}
h1 {
border-bottom: 0;
padding-bottom: 0;
font-size: 28px;
}
}
}
\ No newline at end of file
......@@ -417,8 +417,8 @@ $navbar-inverse-bg: #F1F1F1;
$navbar-inverse-border: darken($navbar-inverse-bg, 5%);
// Inverted navbar links
$navbar-inverse-link-color: $text-color;
$navbar-inverse-link-hover-color: $link-hover-color;
$navbar-inverse-link-color: $theme-primary-color;
$navbar-inverse-link-hover-color: lighten($theme-primary-color, 5%);
$navbar-inverse-link-hover-bg: rgba(darken($navbar-inverse-bg, 7%), 0.5);