From 9d14033f6b6f5cc8951e0fd772b378ee10d73e98 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Tue, 31 Jul 2012 15:52:27 -0400 Subject: [PATCH] Added some styles for the top navigation and for the sidebar navigation --- lms/envs/common.py | 2 +- lms/static/sass/course/base/_base.scss | 8 +++++++ lms/static/sass/course/base/_extends.scss | 4 ++-- .../sass/course/courseware/_courseware.scss | 16 ------------- .../sass/course/courseware/_sidebar.scss | 24 +++++++++++-------- .../course/layout/_courseware_subnav.scss | 15 ++++++------ lms/templates/courseware.html | 1 - 7 files changed, 33 insertions(+), 37 deletions(-) diff --git a/lms/envs/common.py b/lms/envs/common.py index 95daa913e8..d89e6760a7 100644 --- a/lms/envs/common.py +++ b/lms/envs/common.py @@ -304,7 +304,7 @@ PIPELINE_CSS = { 'output_filename': 'css/lms-application.css', }, 'course': { - 'source_filenames': ['sass/course.scss', 'js/vendor/CodeMirror/codemirror.css', 'css/vendor/jquery.treeview.css', 'css/vendor/ui-lightness/jquery-ui-1.8.22.custom.css', 'css/vendor/jquery.qtip.min.css'], + 'source_filenames': ['js/vendor/CodeMirror/codemirror.css', 'css/vendor/jquery.treeview.css', 'css/vendor/ui-lightness/jquery-ui-1.8.22.custom.css', 'css/vendor/jquery.qtip.min.css', 'sass/course.scss'], 'output_filename': 'css/lms-course.css', }, 'ie-fixes': { diff --git a/lms/static/sass/course/base/_base.scss b/lms/static/sass/course/base/_base.scss index 02aba1866e..8849c78cfc 100644 --- a/lms/static/sass/course/base/_base.scss +++ b/lms/static/sass/course/base/_base.scss @@ -5,3 +5,11 @@ body { h1, h2, h3, h4, h5, h6 { font-family: $sans-serif; } + +table { + table-layout: fixed; +} + +.container { + padding: lh(2); +} diff --git a/lms/static/sass/course/base/_extends.scss b/lms/static/sass/course/base/_extends.scss index b71b8161f6..e1fc953126 100644 --- a/lms/static/sass/course/base/_extends.scss +++ b/lms/static/sass/course/base/_extends.scss @@ -84,7 +84,8 @@ h1.top-header { } .sidebar { - border-right: 1px solid #d3d3d3; + border-right: 1px solid #C8C8C8; + @include box-shadow(inset -1px 0 0 #e6e6e6); @include box-sizing(border-box); display: table-cell; font-family: $sans-serif; @@ -181,7 +182,6 @@ h1.top-header { .topbar { @extend .clearfix; - background: $cream; border-bottom: 1px solid darken($cream, 10%); border-top: 1px solid #fff; font-size: 12px; diff --git a/lms/static/sass/course/courseware/_courseware.scss b/lms/static/sass/course/courseware/_courseware.scss index 7fc3fb0fa1..77f53e0241 100644 --- a/lms/static/sass/course/courseware/_courseware.scss +++ b/lms/static/sass/course/courseware/_courseware.scss @@ -3,22 +3,6 @@ html { max-height: 100%; } -body.courseware { - height: 100%; - max-height: 100%; - - .container { - padding-bottom: 40px; - margin-top: 20px; - } - - footer { - &.fixed-bottom { - Position: static; - } - } -} - div.course-wrapper { @extend .table-wrapper; diff --git a/lms/static/sass/course/courseware/_sidebar.scss b/lms/static/sass/course/courseware/_sidebar.scss index fc0291f48a..860d588a84 100644 --- a/lms/static/sass/course/courseware/_sidebar.scss +++ b/lms/static/sass/course/courseware/_sidebar.scss @@ -13,44 +13,50 @@ section.course-index { div#accordion { h3 { - @include box-shadow(inset 0 1px 0 0 #eee); - border-top: 1px solid #d3d3d3; - overflow: hidden; + @include border-radius(0); + border-top: 1px solid #e3e3e3; margin: 0; + overflow: hidden; &:first-child { border: none; } &:hover { - @include background-image(linear-gradient(-90deg, rgb(245,245,245), rgb(225,225,225))); + background: #eee; } &.ui-accordion-header { color: #000; a { - font-size: $body-font-size; + @include border-radius(0); + @include box-shadow(none); color: lighten($text-color, 10%); + font-size: $body-font-size; } &.ui-state-active { - @include background-image(linear-gradient(-90deg, rgb(245,245,245), rgb(225,225,225))); @extend .active; - border-bottom: 1px solid #d3d3d3; + border-bottom: none; + + &:hover { + background: none; + } } } } ul.ui-accordion-content { @include border-radius(0); - @include box-shadow(inset -1px 0 0 #e6e6e6); + background: #FFF; border: none; font-size: 12px; margin: 0; padding: 1em 1.5em; li { + @include border-radius(0); margin-bottom: lh(.5); a { @@ -120,8 +126,6 @@ section.course-index { font-weight: bold; > a { - background: rgb(240,240,240); - @include background-image(linear-gradient(-90deg, rgb(245,245,245), rgb(230,230,230))); border-color: rgb(200,200,200); &:after { diff --git a/lms/static/sass/course/layout/_courseware_subnav.scss b/lms/static/sass/course/layout/_courseware_subnav.scss index 7d2433138e..21f6187a83 100644 --- a/lms/static/sass/course/layout/_courseware_subnav.scss +++ b/lms/static/sass/course/layout/_courseware_subnav.scss @@ -1,9 +1,8 @@ nav.course-material { - background: rgb(210,210,210); @include clearfix; @include box-sizing(border-box); - @include box-shadow(inset 0 1px 5px 0 rgba(0,0,0, 0.05)); - border-bottom: 1px solid rgb(190,190,190); + background: #f6f6f6; + border-bottom: 1px solid rgb(200,200,200); margin: 0px auto 0px; padding: 0px; width: 100%; @@ -24,12 +23,14 @@ nav.course-material { list-style: none; a { - color: $lighter-base-font-color; + color: darken($lighter-base-font-color, 20%); display: block; text-align: center; - padding: 5px 13px; + padding: 8px 13px 12px; + font-size: 14px; + font-weight: 400; text-decoration: none; - text-shadow: 0 1px rgba(255,255,255, 0.4); + text-shadow: 0 1px rgb(255,255,255); &:hover { color: $base-font-color; @@ -41,7 +42,7 @@ nav.course-material { border-bottom: 0px; @include border-top-radius(4px); @include box-shadow(0 2px 0 0 rgba(255,255,255, 1)); - color: $base-font-color; + color: $blue; } } } diff --git a/lms/templates/courseware.html b/lms/templates/courseware.html index 3d163c1f78..9c145ba8c0 100644 --- a/lms/templates/courseware.html +++ b/lms/templates/courseware.html @@ -35,7 +35,6 @@
-

Courseware Index

close