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) // change the colour of the sideblock file quota progress bar
.blocktype-radio { .progress-bar {
display: none; background-color: #84a421;
} }
.login {
.form-group.button, // blog post headings
.form-group.submit { .myblogs {
padding-top: 10px; 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 { // makes the edit page toolbar position more fitting for this theme, plus responsive position
margin-left: 0; // 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 @@ ...@@ -18,7 +18,6 @@
&.nav > li { &.nav > li {
> a, button { > a, button {
color: $arrow-link-color; color: $arrow-link-color;
font-size: $font-size-small;
@media (max-width: $screen-sm-min) { @media (max-width: $screen-sm-min) {
margin-top: 2px; margin-top: 2px;
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
} }
// Lime buttons // Grey buttons
.btn, .btn,
.btn-default { .btn-default {
@include gradient-vertical($start-color: #FFFFFF, $end-color: #ececec, $start-percent: 10%, $end-percent: 100%); @include gradient-vertical($start-color: #FFFFFF, $end-color: #ececec, $start-percent: 10%, $end-percent: 100%);
...@@ -27,7 +27,8 @@ ...@@ -27,7 +27,8 @@
// Green buttons // Green buttons
.btn-success, .btn-success,
.btn-primary { .btn-primary,
.btn-with-heading {
@include gradient-vertical($start-color: #99b92d, $end-color: #66860f, $start-percent: 0%, $end-percent: 100%); @include gradient-vertical($start-color: #99b92d, $end-color: #66860f, $start-percent: 0%, $end-percent: 100%);
border-color: #66860f; border-color: #66860f;
color: #FFFFFF; color: #FFFFFF;
...@@ -39,4 +40,19 @@ ...@@ -39,4 +40,19 @@
border-color: #202c01; border-color: #202c01;
color: #FFFFFF; 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 { .header {
.navbar-toggle { .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-nav {
.navbar-toggle { .navbar-toggle {
......
.site-messages { .site-messages {
~ .header { ~ .header {
top: 33px; //for one message top: 33px; //for one message
...@@ -27,13 +24,13 @@ ...@@ -27,13 +24,13 @@
} }
} }
~ .container { ~ .middle-container-wrap .container {
.toolbar-affix.affix { .toolbar-affix.affix {
margin-top: $i * 33px; margin-top: $i * 33px;
} }
} }
+ .container { + .middle-container-wrap .container {
// if container is directly after header, then it will need a margin // if container is directly after header, then it will need a margin
margin-top: ($i * 33px); margin-top: ($i * 33px);
} }
...@@ -42,12 +39,12 @@ ...@@ -42,12 +39,12 @@
// when there is a static second level nav // when there is a static second level nav
.static-nav { .static-nav {
padding-top: 140px; padding-top: 138px;
@media (max-width: $screen-sm-min) { @media (max-width: $screen-sm-min) {
padding-top: 0; padding-top: 0;
} }
.header { .header {
height: 140px; height: 138px;
@media (max-width: $screen-sm-min) { @media (max-width: $screen-sm-min) {
height: 65px; height: 65px;
} }
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
background-image: url(../images/header-bkgd.png); background-image: url(../images/header-bkgd.png);
background-repeat: repeat-x; background-repeat: repeat-x;
background-position: left top; background-position: left top;
background-color: #FFFFFF;
top: 0; top: 0;
.logo-area { .logo-area {
......
.profile-block.panel-heading { .sidebar {
min-height: 80px; .profile-block.panel-heading {
min-height: 80px;
.username {
&:hover { .username {
text-decoration: underline; &:hover {
text-decoration: underline;
}
} }
} a {
a { color: #FFFFFF;
color: #FFFFFF;
&:after {
&:after { border-radius: 30px;
border-radius: 30px; bottom: 0px;
bottom: 0px; }
} }
} }
} }
......
...@@ -33,13 +33,19 @@ ...@@ -33,13 +33,19 @@
// Only shown on mobile, or when dropdowns are turned on // Only shown on mobile, or when dropdowns are turned on
.child-nav { .child-nav {
padding: 0; padding: 0;
@media (max-width: $screen-sm-min) {
background-color: #ececec;
}
li { li {
a { a {
padding: 10px 20px; padding: 10px 20px;
font-weight: 300;
color: $theme-primary-color;
&:hover, &:focus { &:hover, &:focus {
background-color: #FFFFFF; background-color: #eff6eb;
font-weight: 300;
} }
} }
} }
...@@ -48,10 +54,12 @@ ...@@ -48,10 +54,12 @@
.active > a { .active > a {
background-color: $theme-primary-color; background-color: $theme-primary-color;
color: #FFFFFF; color: #FFFFFF;
font-weight: 700;
&:hover, &:focus { &:hover, &:focus {
color: #FFFFFF; color: #FFFFFF;
background-color: darken($theme-primary-color, 5%); background-color: darken($theme-primary-color, 5%);
font-weight: 700;
} }
} }
} }
......
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
@media (min-width: $screen-xs-min) and (max-width: $screen-md-min) { @media (min-width: $screen-xs-min) and (max-width: $screen-md-min) {
clear: none; clear: none;
margin-top: 8px; margin-top: 12px;
} }
@media (max-width: $screen-sm-min - 1) { @media (max-width: $screen-sm-min - 1) {
...@@ -48,16 +48,21 @@ ...@@ -48,16 +48,21 @@
} }
>.active { >.active {
> a, > a {
font-weight: 300;
background-color: #FFFFFF;
color: $navbar-default-link-active-color;
}
> a:hover, > a:hover,
> a:focus { > a:focus {
background-color: $navbar-default-link-active-bg; background-color: #FFFFFF;
color: $navbar-default-link-active-color; color: $navbar-default-link-color;
font-weight: 300;
@media (max-width: $screen-sm-min - 1) { @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; color: $navbar-inverse-link-hover-color;
background-color: $navbar-inverse-link-hover-bg; background-color: #FFFFFF;
} }
} }
} }
...@@ -92,12 +97,22 @@ ...@@ -92,12 +97,22 @@
margin-top: 6px; margin-top: 6px;
} }
} }
.container {
@media (max-width: $screen-sm-min) {
background-color: #f5f6f6;
}
}
} }
.main-nav { .main-nav {
.mainnav-search { .mainnav-search {
margin-top: 2px; margin-top: 2px;
margin-bottom: 0; margin-bottom: 0;
} }
.navbar-form {
@media (max-width: $screen-sm-min) {
display: none;
}
}
.header-search-form { .header-search-form {
display: inline-block; display: inline-block;
@media (max-width: $screen-md-min) { @media (max-width: $screen-md-min) {
......
.top-nav.navbar-nav { .top-nav.navbar-nav {
margin: 10px 0 0 0; margin: 15px 0 0 0;
padding: 0;
font-size: 13px; font-size: 13px;
text-align: right;
@media (max-width: $screen-md-min) { @media (max-width: $screen-md-min) {
position: inherit; position: inherit;
right: auto; right: auto;
background-color: transparent; background-color: transparent;
border-radius: 0; border-radius: 0;
margin: 15px 10px;
font-size: 14px;
} }
> li { > li {
> a { > a {
&:focus,
&:hover { &:hover {
color: lighten($theme-primary-color, 8%); color: lighten($theme-primary-color, 8%);
background-color: transparent;
} }
} }
&:last-child { &:last-child {
...@@ -28,5 +34,10 @@ ...@@ -28,5 +34,10 @@
margin-left: 5px; margin-left: 5px;
} }
} }
.div {
@media (max-width: $screen-md-min) {
display: inline-block;
}
}
} }
} }
\ No newline at end of file
...@@ -13,18 +13,9 @@ ...@@ -13,18 +13,9 @@
} }
.panel-heading { // sidebar panel headings
.sidebar .panel-default > .panel-heading {
@include border-top-radius(0); @include border-top-radius(0);
.metadata {
color: #eef3e9;
font-size: 11px;
margin-top: 5px;
}
}
.panel-default > .panel-heading {
border-bottom: 0; border-bottom: 0;
background-color: $theme-primary-color; background-color: $theme-primary-color;
color: #FFFFFF; color: #FFFFFF;
...@@ -36,4 +27,20 @@ ...@@ -36,4 +27,20 @@
a { a {
color: #FFFFFF; color: #FFFFFF;
} }
.metadata {
color: #eef3e9;
font-size: 11px;
margin-top: 5px;
}
}
.panel.collapsible {
.panel-heading-nested,
.panel-heading {
> a.outer-link {
border-color: #ddd;
}
}