Commit 0e5a53aa authored by Evonne Cheung's avatar Evonne Cheung Committed by Robert Lyon
Browse files

Primary school theme update 2



Change-Id: I6533200f169b681e2282c7430de5df3048e1f842
Signed-off-by: Robert Lyon's avatarRobert Lyon <robertl@catalyst.net.nz>
parent c21c60cd
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -299,3 +299,35 @@
}
}
}
// makes the edit page toolbar position more fitting for this theme
.toolbar-affix.affix {
top: 110px;
}
// makes certain buttons primary colour
.col-collapse-offset.col-with-collapse .btn {
color: #fff;
background-color: $brand-primary;
border-color: darken($btn-primary-bg, 5%);
.icon {
color: #fff;
}
&:focus,
&:hover {
background-color: lighten($brand-primary, 5%);
}
}
.submitcancel .btn {
color: #fff;
background-color: $brand-primary;
border-color: darken($btn-primary-bg, 5%);
.icon {
color: #fff;
}
&:focus,
&:hover {
background-color: lighten($brand-primary, 5%);
}
}
\ No newline at end of file
......@@ -164,7 +164,7 @@ td.btn-group {
// Edit page configure buttons
.panel-secondary .blockinstance-controls .btn-group-top {
position: absolute;
top: 11px;
top: 10px;
right: 10px;
.btn {
background: rgba(#ccc, 0.8);
......
.expand-indicator,
.move-indicator {
@extend .text-muted;
font-size: 9px;
vertical-align: middle;
margin-left: -7px;
opacity: 0.7;
a:hover &,
.panel-heading:hover & {
opacity: 1;
}
.panel-secondary & {
margin-top: -5px;
margin-left: -6px;
margin-right: -2px;
color: #FFF;
}
}
//dash
.collapse-indicator {
color: #aaa;
font-size: 13px;
display: block;
transition-duration: 0.3s;
&.pull-right {
margin: 2px 0 0;
}
&.text-small {
font-size: 11px;
}
.collapsed & {
color: #aaa;
}
a:hover &,
a:focus & {
color: #555;
}
.collapsed ~ & {
transform: rotate(180deg);
transition-duration: 0.3s;
margin-top: 5px;
}
}
//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($brand-primary, 10%);
}
.collapse-indicator {
transform: rotate(-180deg);
transition-duration: 0.3s;
color: $brand-primary;
margin-top: 5px;
line-height: 13px;
height: auto;
}
&.collapsed .collapse-indicator {
transform: rotate(0deg);
transition-duration: 0.3s;
margin-top: 2px;
}
}
.expand-indicator {
font-size: 12px;
padding-right: 5px;
+ .icon {
color: $text-color;
&:hover, &:focus {
color: lighten($text-color, 10%);
}
}
}
// syntax change if link is an outer-link
[data-toggle="collapse"].outer-link {
&.collapsed {
~ .collapse-indicator {
color: #aaa;
}
}
&:hover,
&:focus {
~ .collapse-indicator {
color: #555;
}
}
}
$width: 60%;
$width-sm: 90%;
//tinymce modal
.blockinstance-as-modal {
background: #fff;
padding: 20px;
border: 1px solid $modal-header-border-color;
}
.modal-loading {
margin-top: 100px;
text-align: center;
width: 100%;
@extend .icon;
@extend .icon-spinner;
@extend .icon-pulse;
@extend .icon-3x;
@extend .text-watermark;
}
.modal-tinymce,
.modal-docked {
background: rgba(0,0,0,0.09);
display: block;
.modal-content {
height: 90%;
}
}
.modal-docked,
.page-modal {
.modal-content {
max-height: 100%;
}
.modal-body {
@include border-bottom-radius(3px);
max-height: 90%;
overflow: auto;
&.flush {
padding: 0;
}
.list-group.flush {
margin: -15px;
}
}
.modal-dialog {
height: 100%;
}
}
.page-modal {
.modal-content {
overflow: hidden;
max-height: 90%;
}
}
.modal-content {
border-radius: 0;
}
.modal-header,
.mce-panel .mce-window-head {
background: $panel-default-heading-bg;
padding: 10px 15px;
h4, .mce-title {
font-family: $font-family-base;
font-weight: 300;
font-size: 16px;
}
.close,
.mce-close {
opacity: 1;
background-color: $brand-primary !important;
border-color: $brand-primary !important;
left: -29px !important;
&:hover,
&:focus {
background-color: lighten($brand-primary, 5%) !important;
border-color: lighten($brand-primary, 5%) !important;
.times {
opacity: 1;
}
}
.times {
opacity: 0.8;
font-size: 25px;
color: #FFFFFF !important;
}
}
}
.modal-docked {
@include transition(visibility 0s 0.3s);
visibility: hidden;
position: fixed;
top: 0px;
right: 0px;
bottom: 0px;
.mce-tinymce {
display:none;
}
&.active,
&.in {
@include transition(visibility 0s 0.2s);
visibility: visible;
transition: visibility 0s 0.2s;
.modal-dialog {
@include transition(right 0.3s ease-in-out);
right: 0;
}
.mce-tinymce {
display: block;
}
}
&.closed {
.modal-dialog {
@include transition(right 0.5s ease-in-out);
right: -($width + 5);
@media (max-width: $screen-sm-min) {
right: -($width-sm + 5);
}
}
}
.modal-dialog {
width: $width;
margin: 0;
position: fixed;
top: 0px;
bottom: 0px;
@media (max-width: $screen-sm-min) {
width: ($width-sm + 5);
}
}
.modal-header {
background: $brand-primary;
padding: 10px 15px;
color: #fff;
h4, a {
color: #fff;
}
.close {
@include box-shadow(-2px 0px 2px rgba(0,0,0,0.3));
border-radius:3px 0 0 3px;
opacity: 1;
position: absolute;
top: 1px;
left: -30px;
padding: 10px 7px 9px;
background: #fff;
border: 1px solid $modal-header-border-color;
border-right:0;
@media (max-width: $screen-sm-min) {
left:-22px;
padding: 10px 4px 9px 3px;
}
.times {
color: #555;
opacity:0.4;
}
&:hover,
&:focus,
&:active {
outline: none;
.times {
opacity:0.8;
}
}
}
}
.modal-content {
border-radius: 0;
border-top: 0;
border-bottom: 0;
height: 100% !important; //js bug gives a height (@todo track down)
}
}
.modal .tags {
input {
max-width:250px;
}
}
......@@ -27,7 +27,7 @@ $logged-in-height-phone: 130px;
width: 10 / 3.7 * 10%;
}
@media (max-width: $screen-xs-min ) {
@media (max-width: $screen-sm-min ) {
width: 10 / 3 * 10%;
}
......@@ -41,7 +41,7 @@ $logged-in-height-phone: 130px;
}
@media (max-width: $screen-sm-min ) {
height: $logged-in-height-phone;
height: auto;
}
.puzzle {
......@@ -67,14 +67,6 @@ $logged-in-height-phone: 130px;
}
@media (max-width: $screen-sm-min ) {
width: 30px;
height: 50px;
-moz-border-radius: 10px 80px 80px 10px;
-webkit-border-radius: 10px 80px 80px 10px;
border-radius: 10px 80px 80px 10px;
}
@media (max-width: $screen-xs-min) {
display: none;
}
}
......@@ -122,14 +114,6 @@ $logged-in-height-phone: 130px;
}
@media (max-width: $screen-sm-min ) {
height: $logged-in-height-phone;
width: 70px;
border-top: 60px solid transparent;
border-left: 70px solid #fcdcb9;
border-bottom: 60px solid transparent;
}
@media (max-width: $screen-xs-min) {
display: none;
}
......@@ -144,13 +128,6 @@ $logged-in-height-phone: 130px;
@media (min-width: $screen-sm-min ) and (max-width: $screen-lg-min ) {
height: $logged-in-height-tablet;
}
@media (max-width: $screen-sm-min ) {
height: $logged-in-height-phone;
width: 70px;
left: -70px;
top: -60px;
}
}
.puzzle {
......@@ -175,14 +152,6 @@ $logged-in-height-phone: 130px;
border-radius: 20px 100px 100px 20px;
}
@media (max-width: $screen-sm-min ) {
width: 30px;
height: 50px;
-moz-border-radius: 10px 80px 80px 10px;
-webkit-border-radius: 10px 80px 80px 10px;
border-radius: 10px 80px 80px 10px;
}
.pencillead {
background-color: #333333;
width: 25px;
......@@ -201,13 +170,6 @@ $logged-in-height-phone: 130px;
width: 20px;
height: 35px;
}
@media (max-width: $screen-sm-min ) {
left: 55px;
top: 1px;
width: 15px;
height: 25px;
}
}
}
}
......@@ -226,35 +188,24 @@ $logged-in-height-phone: 130px;
}
@media (max-width: $screen-sm-min ) {
height: $logged-in-height-phone;
top: -50px;
padding: 10px 7px;
}
@media (max-width: $screen-xs-min) {
height: 110px;
height: auto;
top: 0;
padding: 10px 7px;
}
h2 {
font-family: 'Dekko', 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
margin: 10px 0 13px 0;
font-family: 'GoodDog', 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
margin: 0 0 13px 0;
font-weight: normal;
font-size: 36px;
font-size: 42px;
color: #FFFFFF;
@media (min-width: $screen-sm-min ) and (max-width: $screen-lg-min ) {
font-size: 30px;
margin: 0 0 8px 0;
}
@media (max-width: $screen-sm-min ) {
font-size: 24px;
font-size: 32px;
margin: 0;
}
@media (max-width: $screen-xs-min) {
font-size: 18px;
font-size: 26px;
}
}
......@@ -301,15 +252,13 @@ $logged-in-height-phone: 130px;
@media (max-width: $screen-sm-min ) {
top: 0;
padding-top: 0;
}
p {
margin-bottom: 0;
color: $text-color;
@media (max-width: $screen-xs-min ) {
color: #FFFFFF;
@media (max-width: $screen-sm-min ) {
font-size: $font-size-small;
}
}
......@@ -326,13 +275,9 @@ $logged-in-height-phone: 130px;
}
@media (max-width: $screen-sm-min ) {
height: $logged-in-height-phone;
}
@media (max-width: $screen-xs-min) {
height: auto;
}
.widget-detail {
@include transition(0.03s);
opacity:0;
......@@ -355,10 +300,8 @@ $logged-in-height-phone: 130px;
margin-top: 0;
font-weight: normal;
opacity: 1;
}
@media (max-width: $screen-xs-min) {
display: none;
height: auto;
background-color: #FFFFFF;
}
p {
......@@ -372,11 +315,6 @@ $logged-in-height-phone: 130px;
}
.logged-in:hover {
.widget-heading {
@media (max-width: $screen-sm-min) {
background-color: #0162a7;
}
}
.widget-detail {
@include transition(0.3s);
opacity: 1;
......
......@@ -25,7 +25,7 @@
top: 0;
clear: none;
margin-left: 13px;
padding: 16px 15px 5px 0;
padding: 13px 15px 5px 0;
@media (min-width: 768px) {
display: inline-block;
......@@ -33,8 +33,8 @@
a {
color: #9ad2ef;
font-family: 'Dekko', 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 22px;
font-family: 'GoodDog', 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 24px;
&:focus,
&:hover {
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment