Skip to content

E
edx-platform
Commit 27fce3e4 by Giulio Gratta Committed by Nate Hardison
Options

SASS diff from stanford themed branch for master

parent 4ea6692e
Showing with 79 additions and 51 deletions
lms/static/sass/base/_variables.scss
......@@ -63,10 +63,10 @@ $text-color: $dark-gray;
$body-bg: rgb(250,250,250);
$header-image: linear-gradient(-90deg, rgba(255,255,255, 1), rgba(230,230,230, 0.9));
$header-bg: transparent;
$header-bg: $white;
$courseware-header-image: linear-gradient(top, #fff, #eee);
$courseware-header-bg: transparent;
$footer-bg: transparent;
$footer-bg: $white;
$courseware-footer-border: none;
$courseware-footer-shadow: none;
$courseware-footer-margin: 0px;
......@@ -118,9 +118,30 @@ $sidebar-active-image: linear-gradient(top, #e6e6e6, #d6d6d6);
$form-bg-color: #fff;
$modal-bg-color: rgb(245,245,245);
//TOP HEADER IMAGE MARGIN
$header_image_margin: -69px;
//FOOTER MARGIN
$footer_margin: ($baseline/4) 0 ($baseline*1.5) 0;
//-----------------
// CSS BG Images
//-----------------
$homepage-bg-image: '../images/homepage-bg.jpg';
$login-banner-image: 'transparent url("../images/bg-banner-login.png") 0 0 no-repeat';
$register-banner-image: 'transparent url("../images/bg-banner-register.png") 0 0 no-repeat';
$video-thumb-url: '../images/courses/video-thumb.jpg';
//-----------------
// Mixin Styles
//
// THIS MIGHT BE A GOOD WAY TO DEAL WITH LARGE CHUNKS OF SASS THAT WE WANT TO ALLOW THEMING ON...
// WE MAY WANT TO SEPERATE THEM OUT INTO ITS OWN "MIXINS" SCSS FILE
//-----------------
@mixin login_register_h1_style {}
@mixin footer_references_style {
margin: -10px 0 0 0;
}
lms/static/sass/course/layout/_courseware_header.scss
......@@ -65,7 +65,7 @@ header.global.slim {
height: auto;
padding: 5px 0 10px 0;
border-bottom: 1px solid $outer-border-color;
background: $white;
background: $header-bg;
.guest .secondary {
margin-right: 0;
......
lms/static/sass/course/layout/_footer.scss
footer {
border: $courseware-footer-border;
box-shadow: $courseware-footer-shadow;
margin-top: $courseware-footer-margin;
}
\ No newline at end of file
lms/static/sass/multicourse/_account.scss
......@@ -6,7 +6,7 @@
// page-level
.view-register, .view-login, .view-passwordreset {
background: $white;
background: $body-bg;
......@@ -20,16 +20,16 @@
.heading-2 {
font-size: 25px;
margin: 0 0 $baseline 0;
font-weight: 300;
font-weight: bold;
text-transform: uppercase;
color: $m-blue;
color: $link-color;
}
.heading-3 {
font-size: 21px;
margin: 0 0 $baseline 0;
font-weight: 300;
color: $m-gray-d2;
color: $base-font-color;
}
.heading-4 {
......@@ -37,7 +37,7 @@
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0 !important;
color: $m-blue-s1;
color: saturate($link-color,15%);
}
.heading-5 {
......@@ -48,7 +48,7 @@
font-size: 18px;
margin: 0 0 $baseline 0;
font-weight: 300;
color: $m-gray-a1;
color: $base-font-color;
font-family: 'Open Sans', sans-serif;
line-height: lh(1.1);
}
......@@ -56,18 +56,18 @@
.body-text {
font-size: 15px;
margin: 0 0 $baseline 0;
color: $m-gray-a1;
color: $base-font-color;
line-height: lh(1);
}
// specific examples - buttons
.button-primary {
@include border-radius(0);
@include linear-gradient($m-blue-s1 5%, $m-blue-d1 95%);
@include linear-gradient(saturate($link-color,15%) 5%, shade($link-color,15%) 95%);
display: inline-block;
padding: $baseline/2 $baseline*2.5;
text-transform: lowercase;
color: $white;
color: $very-light-text;
letter-spacing: 0.1rem;
font-weight: 500;
cursor: pointer;
......@@ -80,11 +80,11 @@
}
.button-secondary {
@include linear-gradient($m-gray 5%, $m-gray-d1 95%);
@include linear-gradient($outer-border-color 5%, $lighter-base-font-color 95%);
display: inline-block;
padding: $baseline/2 $baseline*2.5;
text-transform: lowercase;
color: $white;
color: $very-light-text;
letter-spacing: 0.1rem;
font-weight: 600;
cursor: pointer;
......@@ -98,7 +98,7 @@
// layout
.content-wrapper {
background: $m-gray-l2;
background: $content-wrapper-bg;
padding-bottom: 0;
}
......@@ -107,7 +107,7 @@
@include clearfix;
margin: 0 auto;
width: 960px;
background: $white;
background: $body-bg;
}
.container {
......@@ -139,17 +139,18 @@
}
a {
@include transition(color 0.15s ease-in-out, border 0.15s ease-in-out);
@include transition($link-color 0.15s ease-in-out, border 0.15s ease-in-out);
&:link, &:visited, &:hover, &:active {
color: $m-blue;
color: $link-color;
font-weight: bold;
text-decoration: none !important;
font-family: $sans-serif;
}
&:hover, &:active {
border-bottom: 1px dotted $m-blue-l1;
color: $m-blue-l1;
border-bottom: 1px solid saturate($link-color,15%);
color: saturate($link-color,15%);
}
}
......@@ -254,20 +255,20 @@
font-family: $sans-serif;
font-style: normal;
font-weight: 500;
color: $m-gray-d2;
color: $base-font-color;
}
label {
@include transition(color 0.15s ease-in-out);
@include transition($link-color 0.15s ease-in-out);
margin: 0 0 ($baseline/4) 0;
color: tint($black, 20%);
}
.tip {
@include transition(color 0.15s ease-in-out);
@include transition($link-color 0.15s ease-in-out);
display: block;
margin-top: ($baseline/4);
color: tint($m-gray, 50%);
color: tint($outer-border-color, 50%);
font-size: em(13);
}
......@@ -330,7 +331,7 @@
}
textarea, input {
background: $white;
background: $body-bg;
color: rgba(0,0,0,.25);
}
}
......@@ -339,11 +340,11 @@
&.is-focused {
label {
color: $m-blue-l1;
color: saturate($link-color,15%);
}
.tip {
color: $m-blue-l1;
color: saturate($link-color,15%);
}
}
......@@ -461,7 +462,7 @@
// misc
.orn-plus {
color: $white;
color: $very-light-text;
padding: 0 $baseline/4;
}
......@@ -492,7 +493,11 @@
header {
height: 120px;
border-bottom: 1px solid $m-gray;
background: transparent url("../images/bg-banner-login.png") 0 0 no-repeat;
background: $login-banner-image;
h1 {
@include login_register_h1_style;
}
}
}
}
......@@ -507,13 +512,17 @@
height: 120px;
border-bottom: 1px solid $m-gray;
background: transparent url("../images/bg-banner-register.png") 0 0 no-repeat;
h1 {
@include login_register_h1_style;
}
}
}
}
// password reset
.view-passwordreset {
background: $m-gray-l2;
background: $sidebar-color;
header.global {
......@@ -543,7 +552,7 @@
.inner-wrapper {
@include border-radius(2px);
background: $white;
background: $body-bg;
padding-bottom: 0 !important;
}
......
lms/static/sass/multicourse/_course_about.scss
......@@ -11,7 +11,7 @@
border-bottom: 1px solid $border-color-3;
@include box-shadow(inset 0 1px 5px 0 rgba(0,0,0, 0.1));
height: 280px;
margin-top: -69px;
margin-top: $header_image_margin;
padding-top: 150px;
overflow: hidden;
position: relative;
......
lms/static/sass/multicourse/_courses.scss
......@@ -10,7 +10,7 @@
border-bottom: 1px solid $border-color-3;
@include box-shadow(inset 0 -1px 8px 0 rgba(0,0,0, 0.2), inset 0 1px 12px 0 rgba(0,0,0, 0.3));
height: 430px;
margin-top: -69px;
margin-top: $header_image_margin;
width: 100%;
.inner-wrapper {
......
lms/static/sass/multicourse/_home.scss
......@@ -15,7 +15,7 @@
@include clearfix;
height: 460px;
overflow: hidden;
margin-top: -69px;
margin-top: $header_image_margin;
padding: 0px;
width: flex-grid(12);
......
lms/static/sass/shared/_footer.scss
......@@ -2,7 +2,7 @@
@include box-shadow(0 -1px 5px 0 rgba(0,0,0, 0.1));
border-top: 1px solid tint($m-gray,50%);
padding: 25px ($baseline/2) ($baseline*1.5) ($baseline/2);
background: $white;
background: $footer-bg;
footer {
@include clearfix();
......@@ -16,18 +16,18 @@
}
a {
@include transition(color 0.15s ease-in-out, border 0.15s ease-in-out);
@include transition(link-color 0.15s ease-in-out, border 0.15s ease-in-out);
&:link, &:visited, &:hover, &:active {
border-bottom: none;
color: $m-blue;
color: $link-color;
text-decoration: none !important;
font-family: $sans-serif;
}
&:hover, &:active {
border-bottom: 1px dotted $m-blue-s1;
color: $m-blue-s1;
border-bottom: 1px dotted $link-color;
color: $link-color;
}
}
......@@ -39,7 +39,7 @@
.nav-colophon {
@include clearfix();
margin: ($baseline/4) 0 ($baseline*1.5) 0;
margin: $footer_margin;
li {
float: left;
......@@ -49,7 +49,7 @@
color: tint($black, 20%);
&:hover, &:active {
color: $m-blue-s1;
color: $link-color;
}
}
......@@ -82,7 +82,7 @@
// references
.references {
margin: -10px 0 0 0;
@include footer_references_style;
width: flex-grid(4,12);
float: right;
......
lms/static/sass/shared/_header.scss
header.global {
border-bottom: 1px solid $m-gray;
@include box-shadow(0 1px 5px 0 rgba(0,0,0, 0.1));
background: $white;
background: $header-bg;
height: 76px;
position: relative;
width: 100%;
......@@ -246,12 +246,12 @@ header.global {
a {
display:block;
padding: ($baseline/4);
color: $m-gray-d1;
color: $lighter-base-font-color;
font-weight: 600;
&:hover, &:active {
text-decoration: none;
color: $m-blue-s1;
color: $link-color;
}
}
......@@ -259,7 +259,7 @@ header.global {
a {
text-decoration: none;
color: $m-blue-s1;
color: $link-color;
}
}
}
......@@ -280,11 +280,11 @@ header.global {
a {
@include border-radius(0);
@include linear-gradient($m-blue-s1 5%, $m-blue-d1 95%);
@include linear-gradient(shade($link-color,15%) 5%, saturate($link-color,15%) 95%);
display: inline-block;
padding: $baseline/2 $baseline*2.5;
text-transform: lowercase;
color: $white;
color: $very-light-text;
letter-spacing: 0.1rem;
font-weight: 300;
cursor: pointer;
......@@ -324,6 +324,6 @@ header.global {
a {
text-decoration: none;
color: $m-blue-s1 !important;
color: $link-color !important;
}
}
Markdown is supported
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