From 6c3ec99f9e325fcdfd5b71769f0b69e1058a1dd4 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Wed, 1 Aug 2012 16:55:30 -0400 Subject: [PATCH] Start to change to ems and remove all of cream --- cms/static/sass/_base.scss | 2 ++ lms/static/sass/application.scss | 2 +- lms/static/sass/base/_mixins.scss | 4 ++++ lms/static/sass/base/_variables.scss | 10 ++++----- lms/static/sass/course.scss | 2 +- lms/static/sass/course/_info.scss | 22 +++++++++++-------- lms/static/sass/course/_textbook.scss | 1 - .../sass/course/discussion/_profile.scss | 1 - .../course/discussion/_question-view.scss | 4 +--- lms/static/sass/course/old/.gitignore | 1 - lms/static/sass/course/wiki/_wiki.scss | 3 --- 11 files changed, 26 insertions(+), 26 deletions(-) delete mode 100644 lms/static/sass/course/old/.gitignore diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss index cad315f6e4..2ea98473d1 100644 --- a/cms/static/sass/_base.scss +++ b/cms/static/sass/_base.scss @@ -2,6 +2,7 @@ $fg-column: 70px; $fg-gutter: 26px; $fg-max-columns: 12; $body-font-family: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; +$sans-serif: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; $body-font-size: 14px; $body-line-height: 20px; @@ -12,6 +13,7 @@ $orange: #f96e5b; $yellow: #fff8af; $cream: #F6EFD4; $mit-red: #933; +$border-color: #ddd; @mixin hide-text { background-color: transparent; diff --git a/lms/static/sass/application.scss b/lms/static/sass/application.scss index c16d72e367..240d68c5b3 100644 --- a/lms/static/sass/application.scss +++ b/lms/static/sass/application.scss @@ -2,9 +2,9 @@ @import 'base/reset'; @import 'base/font_face'; +@import 'base/mixins'; @import 'base/variables'; @import 'base/base'; -@import 'base/mixins'; @import 'base/extends'; @import 'base/animations'; diff --git a/lms/static/sass/base/_mixins.scss b/lms/static/sass/base/_mixins.scss index 7c53b6e14f..58a92d1ee6 100644 --- a/lms/static/sass/base/_mixins.scss +++ b/lms/static/sass/base/_mixins.scss @@ -1,3 +1,7 @@ +@function em($pxval, $base: 16) { + @return #{$pxval / $base}em; +} + // Line-height @function lh($amount: 1) { @return $body-line-height * $amount; diff --git a/lms/static/sass/base/_variables.scss b/lms/static/sass/base/_variables.scss index 4a8993b200..2da5855f0a 100644 --- a/lms/static/sass/base/_variables.scss +++ b/lms/static/sass/base/_variables.scss @@ -4,6 +4,8 @@ $gw-gutter: 20px; $fg-column: $gw-column; $fg-gutter: $gw-gutter; $fg-max-columns: 12; +$fg-max-width: 1400px; +$fg-min-width: 810px; $sans-serif: 'Open Sans', $verdana; $serif: $georgia; @@ -19,14 +21,10 @@ $border-color: #C8C8C8; // old variables $body-font-family: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; -$body-font-size: 14px; -$body-line-height: golden-ratio($body-font-size, 1); - -$fg-max-width: 1400px; -$fg-min-width: 810px; +$body-font-size: em(14); +$body-line-height: golden-ratio(.875em, 1); $light-gray: #ddd; $dark-gray: #333; $mit-red: #993333; -$cream: #F6EFD4; $text-color: $dark-gray; diff --git a/lms/static/sass/course.scss b/lms/static/sass/course.scss index 8fafbb8479..cc1b49a0a2 100644 --- a/lms/static/sass/course.scss +++ b/lms/static/sass/course.scss @@ -2,9 +2,9 @@ @import 'base/reset'; @import 'base/font_face'; +@import 'base/mixins'; @import 'base/variables'; @import 'base/base'; -@import 'base/mixins'; @import 'base/extends'; @import 'base/animations'; diff --git a/lms/static/sass/course/_info.scss b/lms/static/sass/course/_info.scss index 45dd2d57b3..5ba50dd8f5 100644 --- a/lms/static/sass/course/_info.scss +++ b/lms/static/sass/course/_info.scss @@ -3,6 +3,7 @@ div.info-wrapper { section.updates { @extend .content; + line-height: lh(); > h1 { @extend .top-header; @@ -19,26 +20,29 @@ div.info-wrapper { > li { @extend .clearfix; border-bottom: 1px solid #e3e3e3; - margin-bottom: lh(.5); padding-bottom: lh(.5); list-style-type: disk; &:first-child { - background: $cream; - border-bottom: 1px solid darken($cream, 10%); margin: 0 (-(lh(.5))) lh(); padding: lh(.5); } ol, ul { - margin: lh() 0 0 lh(); - list-style-type: circle; + margin: 0; + list-style-type: disk; + + ol,ul { + list-style-type: circle; + } } h2 { float: left; margin: 0 flex-gutter() 0 0; width: flex-grid(2, 9); + font-size: body-font-size; + font-weight: bold; } section.update-description { @@ -94,7 +98,7 @@ div.info-wrapper { border-bottom: 1px solid #d3d3d3; @include box-shadow(0 1px 0 #eee); @include box-sizing(border-box); - padding: 7px lh(.75); + padding: em(7) lh(.75); position: relative; &.expandable, @@ -108,13 +112,13 @@ div.info-wrapper { ul { background: none; - margin: 7px (-(lh(.75))) 0; + margin: em(7) (-(lh(.75))) 0; li { border-bottom: 0; border-top: 1px solid #d3d3d3; @include box-shadow(inset 0 1px 0 #eee); - padding-left: 18px + lh(.75); + padding-left: lh(1.5); } } @@ -150,7 +154,7 @@ div.info-wrapper { border-bottom: 0; @include box-shadow(none); color: #999; - font-size: 12px; + font-size: $body-font-size; font-weight: bold; text-transform: uppercase; } diff --git a/lms/static/sass/course/_textbook.scss b/lms/static/sass/course/_textbook.scss index ae549d723f..ed5e528809 100644 --- a/lms/static/sass/course/_textbook.scss +++ b/lms/static/sass/course/_textbook.scss @@ -62,7 +62,6 @@ div.book-wrapper { @extend .clearfix; li { - background-color: darken($cream, 4%); &.last { display: block; diff --git a/lms/static/sass/course/discussion/_profile.scss b/lms/static/sass/course/discussion/_profile.scss index 42e6b772f8..010a03ffd6 100644 --- a/lms/static/sass/course/discussion/_profile.scss +++ b/lms/static/sass/course/discussion/_profile.scss @@ -72,7 +72,6 @@ body.user-profile-page { margin-bottom: 30px; li { - background-color: lighten($cream, 3%); background-position: 10px center; background-repeat: no-repeat; @include border-radius(4px); diff --git a/lms/static/sass/course/discussion/_question-view.scss b/lms/static/sass/course/discussion/_question-view.scss index 0920f64f9b..4c2acaf9be 100644 --- a/lms/static/sass/course/discussion/_question-view.scss +++ b/lms/static/sass/course/discussion/_question-view.scss @@ -32,8 +32,6 @@ div.question-header { &.post-vote { @include border-radius(4px); - background-color: lighten($cream, 5%); - border: 1px solid darken( $cream, 10% ); @include box-shadow(inset 0 1px 0px #fff); } @@ -149,7 +147,7 @@ div.question-header { &.revision { text-align: center; - background:lighten($cream, 7%); + // background:lighten($cream, 7%); a { color: black; diff --git a/lms/static/sass/course/old/.gitignore b/lms/static/sass/course/old/.gitignore deleted file mode 100644 index b3a5267117..0000000000 --- a/lms/static/sass/course/old/.gitignore +++ /dev/null @@ -1 +0,0 @@ -*.css diff --git a/lms/static/sass/course/wiki/_wiki.scss b/lms/static/sass/course/wiki/_wiki.scss index 9c878ad263..ec53044ed1 100644 --- a/lms/static/sass/course/wiki/_wiki.scss +++ b/lms/static/sass/course/wiki/_wiki.scss @@ -24,7 +24,6 @@ div.wiki-wrapper { } p { - color: darken($cream, 55%); float: left; line-height: 46px; margin-bottom: 0; @@ -40,14 +39,12 @@ div.wiki-wrapper { input[type="button"] { @extend .block-link; - background-color: darken($cream, 5%); background-position: 12px center; background-repeat: no-repeat; border: 0; border-left: 1px solid darken(#f6efd4, 20%); @include border-radius(0); @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%)); - color: darken($cream, 80%); display: block; font-size: 12px; font-weight: normal;