From df08e1715a0865cca8c5c783520502683b0f6124 Mon Sep 17 00:00:00 2001 From: Chris Rodriguez Date: Thu, 4 Feb 2016 15:32:17 -0500 Subject: [PATCH 1/3] AC-328 LMS updating heading styles --- lms/static/sass/course/courseware/_courseware.scss | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/lms/static/sass/course/courseware/_courseware.scss b/lms/static/sass/course/courseware/_courseware.scss index 220aa301fa45..03f9b54f8736 100644 --- a/lms/static/sass/course/courseware/_courseware.scss +++ b/lms/static/sass/course/courseware/_courseware.scss @@ -416,7 +416,7 @@ html.video-fullscreen { } div#seq_content { - h1 { + h3 { background: none; margin-bottom: lh(); padding-bottom: 0; @@ -445,12 +445,12 @@ html.video-fullscreen { margin-bottom: -16px; border-bottom: 0; - h1 { + h3 { margin: 0; font-size: 1em; } - h2 { + h4 { float: right; margin: 12px 0 0; text-align: right; @@ -661,5 +661,3 @@ section.self-assessment { font-weight: bold; } } - - From 376dc643522cbb4aea43941254a3ca40c25b8b0e Mon Sep 17 00:00:00 2001 From: Chris Rodriguez Date: Mon, 8 Feb 2016 11:08:27 -0500 Subject: [PATCH 2/3] Adding backwards compatibility --- lms/static/sass/course/courseware/_courseware.scss | 3 +++ 1 file changed, 3 insertions(+) diff --git a/lms/static/sass/course/courseware/_courseware.scss b/lms/static/sass/course/courseware/_courseware.scss index 03f9b54f8736..ffc8323a462d 100644 --- a/lms/static/sass/course/courseware/_courseware.scss +++ b/lms/static/sass/course/courseware/_courseware.scss @@ -416,6 +416,7 @@ html.video-fullscreen { } div#seq_content { + h1, h3 { background: none; margin-bottom: lh(); @@ -445,11 +446,13 @@ html.video-fullscreen { margin-bottom: -16px; border-bottom: 0; + h1, // for backwards-compatibility h3 { margin: 0; font-size: 1em; } + h2, // for backwards-compatibility h4 { float: right; margin: 12px 0 0; From 6fe051229f1b8f4cfcbaae3a57c9ba72da55a289 Mon Sep 17 00:00:00 2001 From: Chris Rodriguez Date: Mon, 8 Feb 2016 14:33:34 -0500 Subject: [PATCH 3/3] WIP cleaning up lms/cms/xblock headings --- cms/static/sass/elements/_xblocks.scss | 41 ++++++++++---- .../lib/xmodule/xmodule/css/html/display.scss | 53 ++++++++----------- lms/static/sass/course/base/_extends.scss | 2 +- .../sass/course/courseware/_courseware.scss | 11 ++-- 4 files changed, 59 insertions(+), 48 deletions(-) diff --git a/cms/static/sass/elements/_xblocks.scss b/cms/static/sass/elements/_xblocks.scss index bcea673d8a65..9da5199c651b 100644 --- a/cms/static/sass/elements/_xblocks.scss +++ b/cms/static/sass/elements/_xblocks.scss @@ -187,17 +187,38 @@ } } - //UI: default internal xblock content styles + // UI: default internal xblock content styles // ==================== - // TO-DO: clean-up / remove this reset - // internal headings for problems and video components - h2 { - @extend %t-title5; - margin: ($baseline*1.5) ($baseline*2) ($baseline*1.5) 0; - color: $gray; - letter-spacing: 1px; - text-transform: uppercase; - } + h1 { + // unused as of ac-313, ac-328 + } + + h2 { + // unused as of ac-313, ac-328 + } + + h3 { + // formerly h2 + @extend %t-title5; + @extend %t-regular; + margin: ($baseline*1.5) ($baseline*2) ($baseline*1.5) 0; + letter-spacing: 1px; + text-transform: uppercase; + } + + h4 { + // formerly h3 + @extend %t-title5; + } + + h5 { + // h4 and h5 + @extend %t-title5; + } + + h6 { + @extend %t-title6; + } // ==================== diff --git a/common/lib/xmodule/xmodule/css/html/display.scss b/common/lib/xmodule/xmodule/css/html/display.scss index 2d9ce69238e9..e706a31a657a 100644 --- a/common/lib/xmodule/xmodule/css/html/display.scss +++ b/common/lib/xmodule/xmodule/css/html/display.scss @@ -10,7 +10,8 @@ h1 { margin: 0 0 1.416em 0; } -h2 { +h2, // backwards-compatibility +h3 { color: #646464; font: normal 1.2em/1.2em $sans-serif; letter-spacing: 1px; @@ -24,14 +25,6 @@ h3, h4, h5, h6 { font-weight: 600; } -h3 { - font-size: 1.2em; -} - -h4 { - font-size: 1em; -} - h5 { font-size: .83em; } @@ -152,7 +145,7 @@ th { // modal - image zoom, fill window .wrapper-modal-image { - + .modal-ui-icon { @extend %ui-fake-link; position: absolute; @@ -163,32 +156,32 @@ th { background: $white; color: $black; border: 2px solid $black; - + .label { font-weight: bold; } - + i { font-style: normal; } } - + .image-link { @extend %ui-fake-link; position: relative; display: block; - + .action-fullscreen { display: none; top: 10px; left: 10px; } - + &:hover .action-fullscreen { display: block; } } - + .image-modal { @extend %ui-fake-link; @extend %ui-depth5; @@ -199,7 +192,7 @@ th { height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.7); - + .image-content { position: relative; top: 2.5%; @@ -208,10 +201,10 @@ th { width: 95%; margin: auto; overflow: hidden; - + .image-wrapper { position: relative; - + img { position: relative; display: block; @@ -221,12 +214,12 @@ th { cursor: default; } } - + .action-close { top: 10px; right: 10px; } - + .image-controls { position: absolute; right: 10px; @@ -234,16 +227,16 @@ th { margin: 0; padding: 0; list-style: none; - + .image-control { position: relative; display: inline-block; margin: 0; padding: 0; - + .modal-ui-icon { position: relative; - + &.action-zoom-in { margin-right: ($baseline/4); } @@ -258,17 +251,17 @@ th { } } } - + &.image-is-fit-to-screen { display: block; - + // !important used here to override jQuery. .image-content .image-wrapper { top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; - + img { top: 0 !important; left: 0 !important; @@ -277,9 +270,9 @@ th { } &.image-is-zoomed { display: block; - + .image-content .image-wrapper { - + img { max-width: none; max-height: none; @@ -289,4 +282,4 @@ th { } } } -} \ No newline at end of file +} diff --git a/lms/static/sass/course/base/_extends.scss b/lms/static/sass/course/base/_extends.scss index b309e677da49..a816124167f6 100644 --- a/lms/static/sass/course/base/_extends.scss +++ b/lms/static/sass/course/base/_extends.scss @@ -9,7 +9,7 @@ } // Older Course Extends - to review/remove with LMS cleanup -h1.top-header { +.top-header { border-bottom: 1px solid $border-color-2; @include text-align(left); font-size: em(24); diff --git a/lms/static/sass/course/courseware/_courseware.scss b/lms/static/sass/course/courseware/_courseware.scss index ffc8323a462d..dfc5542e79ea 100644 --- a/lms/static/sass/course/courseware/_courseware.scss +++ b/lms/static/sass/course/courseware/_courseware.scss @@ -416,8 +416,7 @@ html.video-fullscreen { } div#seq_content { - h1, - h3 { + h1 { background: none; margin-bottom: lh(); padding-bottom: 0; @@ -441,19 +440,17 @@ html.video-fullscreen { } header { - @extend h1.top-header; + @extend .top-header; border-radius: 0 4px 0 0; margin-bottom: -16px; border-bottom: 0; - h1, // for backwards-compatibility - h3 { + h1 { margin: 0; font-size: 1em; } - h2, // for backwards-compatibility - h4 { + h2 { float: right; margin: 12px 0 0; text-align: right;