${_("Loading")}
+${_("Loading")}
+diff --git a/.gitignore b/.gitignore index fa417911e5..637b00b853 100644 --- a/.gitignore +++ b/.gitignore @@ -107,8 +107,7 @@ cms/static/css/ cms/static/sass/*.css cms/static/sass/*.css.map cms/static/themed_sass/ -themes/**/css/*.css -themes/**/css/discussion/*.css +themes/**/css ### Logging artifacts log/ diff --git a/common/djangoapps/student/views.py b/common/djangoapps/student/views.py index dacbec78d5..83f6c71b46 100644 --- a/common/djangoapps/student/views.py +++ b/common/djangoapps/student/views.py @@ -245,6 +245,7 @@ def cert_info(user, course_overview, course_mode): """ if not course_overview.may_certify(): return {} + # Note: this should be rewritten to use the certificates API return _cert_info( user, course_overview, diff --git a/lms/static/images/certificates/audit.png b/lms/static/images/certificates/audit.png new file mode 100644 index 0000000000..7363f01845 Binary files /dev/null and b/lms/static/images/certificates/audit.png differ diff --git a/lms/static/images/certificates/honor.png b/lms/static/images/certificates/honor.png new file mode 100644 index 0000000000..7363f01845 Binary files /dev/null and b/lms/static/images/certificates/honor.png differ diff --git a/lms/static/images/certificates/professional.png b/lms/static/images/certificates/professional.png new file mode 100644 index 0000000000..7363f01845 Binary files /dev/null and b/lms/static/images/certificates/professional.png differ diff --git a/lms/static/images/certificates/verified.png b/lms/static/images/certificates/verified.png new file mode 100644 index 0000000000..7363f01845 Binary files /dev/null and b/lms/static/images/certificates/verified.png differ diff --git a/lms/static/sass/_build-base-v1-rtl.scss b/lms/static/sass/_build-base-v1-rtl.scss index 7396056d54..621fe4fdb1 100644 --- a/lms/static/sass/_build-base-v1-rtl.scss +++ b/lms/static/sass/_build-base-v1-rtl.scss @@ -7,3 +7,4 @@ @import 'base/reset'; @import 'base/variables'; @import 'base/mixins'; +@import 'base/theme'; diff --git a/lms/static/sass/_build-base-v1.scss b/lms/static/sass/_build-base-v1.scss index 30979a5af9..0c63cb6c34 100644 --- a/lms/static/sass/_build-base-v1.scss +++ b/lms/static/sass/_build-base-v1.scss @@ -6,3 +6,4 @@ @import 'base/reset'; @import 'base/variables'; @import 'base/mixins'; +@import 'base/theme'; diff --git a/lms/static/sass/_build-footer-edx.scss b/lms/static/sass/_build-footer-edx.scss index 09b539b5c5..51546929dc 100644 --- a/lms/static/sass/_build-footer-edx.scss +++ b/lms/static/sass/_build-footer-edx.scss @@ -4,6 +4,7 @@ // base - utilities @import 'base/variables'; @import 'base/mixins'; +@import 'base/theme'; footer#footer-edx-v3 { @import 'base/extends'; diff --git a/lms/static/sass/features/_learner-profile.scss b/lms/static/sass/features/_learner-profile.scss index 33a1305462..f9d1997142 100644 --- a/lms/static/sass/features/_learner-profile.scss +++ b/lms/static/sass/features/_learner-profile.scss @@ -1,10 +1,102 @@ // lms - application - learner profile // ==================== -// Table of Contents -// * +Container - Learner Profile -// * +Main - Header -// * +Settings Section +.learner-achievements { + .learner-message { + @extend %no-content; + margin: $baseline*0.75 0; + + .message-header, .message-actions { + text-align: center; + } + + .message-actions { + margin-top: $baseline/2; + + .btn-brand { + color: $white; + } + } + } +} + +.certificate-card { + display: flex; + flex-direction: row; + margin-bottom: $baseline; + padding: $baseline/2; + border: 1px; + border-style: solid; + background-color: $white; + cursor: pointer; + + &:hover { + box-shadow: 0 0 1px 1px $gray-l2; + } + + .card-logo { + @include margin-right($baseline); + width: 100px; + height: 100px; + + @media (max-width: $learner-profile-container-flex) { // Switch to map-get($grid-breakpoints,md) for bootstrap + display: none; + } + } + + .card-content { + color: $base-font-color; + margin-top: $baseline/2; + } + + .card-supertitle { + @extend %t-title6; + color: $lightest-base-font-color; + } + + .card-title { + @extend %t-title5; + @extend %t-strong; + margin-bottom: $baseline/2; + } + + .card-text { + @extend %t-title8; + color: $lightest-base-font-color; + } + + &.mode-audit { + border-color: $audit-mode-color; + + .card-logo { + background-image: url('#{$static-path}/images/certificates/audit.png'); + } + } + + &.mode-honor { + border-color: $honor-mode-color; + + .card-logo { + background-image: url('#{$static-path}/images/certificates/honor.png'); + } + } + + &.mode-verified { + border-color: $verified-mode-color; + + .card-logo { + background-image: url('#{$static-path}/images/certificates/verified.png'); + } + } + + &.mode-professional { + border-color: $professional-certificate-color; + + .card-logo { + background-image: url('#{$static-path}/images/certificates/professional.png'); + } + } +} .view-profile { $profile-image-dimension: 120px; @@ -210,133 +302,146 @@ } } - .wrapper-profile-section-one { - @include float(left); - @include margin-left($baseline*3); - width: 300px; - background-color: $white; - border-top: 5px solid $blue; - padding-bottom: $baseline; - + .wrapper-profile-section-container-one { @media (max-width: $learner-profile-container-flex) { // Switch to map-get($grid-breakpoints,md) for bootstrap - @include margin-left(0); - width: 100%; + width: 90%; + padding: 0 5%; + } + + .wrapper-profile-section-one { + @include float(left); + @include margin-left($baseline*3); + width: 300px; + background-color: $white; + border-top: 5px solid $blue; + padding-bottom: $baseline; + + @media (max-width: $learner-profile-container-flex) { // Switch to map-get($grid-breakpoints,md) for bootstrap + @include margin-left(0); + width: 100%; + } + + .profile-section-one-fields { + margin: 0 $baseline/2; + + .social-links { + font-size: 2rem; + padding-top: $baseline/4; + + & > span { + color: $gray-l4; + } + + a { + .fa-facebook-square { + color: $facebook-blue; + } + + .fa-twitter-square { + color: $twitter-blue; + } + + .fa-linkedin-square { + color: $linkedin-blue; + } + } + } + + .u-field { + @extend %t-weight4; + @include padding(0, 0, 0, 3px); + color: $base-font-color; + margin-top: $baseline/5; + + .u-field-value, .u-field-title { + @extend %t-weight4; + width: calc(100% - 40px); + } + + .u-field-value-readonly { + @extend %t-weight3; + font-family: $sans-serif; + color: $darkest-base-font-color; + } + + .u-field-title { + color: $lightest-base-font-color; + display: block; + } + + &.u-field-dropdown { + position: relative; + + &:not(.editable-never) { + cursor: pointer; + } + + &:not(:last-child) { + padding-bottom: $baseline/4; + border-bottom: 1px solid $gray-lighter; + + &:hover.mode-placeholder { + padding-bottom: $baseline/5; + border-bottom: 2px dashed $link-color; + } + } + } + } + + &>.u-field { + &:not(:first-child) { + font-size: $body-font-size; + color: $base-font-color; + font-weight: $font-light; + margin-bottom: 0; + } + + &:first-child { + @extend %t-title4; + @extend %t-weight4; + font-size: em(24); + } + } + + select { + width: 85% + } + + .u-field-message { + @include right(0); + position: absolute; + top: 0; + width: 20px; + + .icon { + vertical-align: baseline; + } + } + } } } - .profile-section-one-fields { - @include margin(0, $baseline/2, 0, $baseline*0.75); - - .social-links { - font-size: 2rem; - padding-top: $baseline/4; - - & > span { - color: $gray-l4; - } - - a { - .fa-facebook-square { - color: $facebook-blue; - } - - .fa-twitter-square { - color: $twitter-blue; - } - - .fa-linkedin-square { - color: $linkedin-blue; - } - } - } - - .u-field { - @extend %t-weight4; - padding: 0; - color: $base-font-color; - margin-top: $baseline/5; - - .u-field-value, .u-field-title { - @extend %t-weight4; - width: calc(100% - 40px); - } - - .u-field-value-readonly { - font-weight: 500; - font-family: $sans-serif; - color: $darkest-base-font-color; - } - - .u-field-title { - color: $lightest-base-font-color; - display: block; - } - - &:not(.u-field-readonly):not(:last-child) { - padding-bottom: $baseline/4; - border-bottom: 1px solid $gray-lighter; - - &:hover.mode-placeholder { - padding-bottom: $baseline/5; - border-bottom: 2px dashed $link-color; - } - } - &.u-field-dropdown { - position: relative; - - &:not(.editable-never) { - cursor: pointer; - } - - } - } - - &>.u-field { - &:not(:first-child) { - font-size: $body-font-size; - color: $base-font-color; - font-weight: $font-light; - margin-bottom: 0; - } - - &:first-child { - @extend %t-title4; - @extend %t-weight4; - font-size: em(24); - } - } - - select { - width: 85% - } - - .u-field-message { - @include right(0); - position: absolute; - top: 0; - width: 20px; - - .icon { - vertical-align: baseline; - } - } - } .wrapper-profile-section-container-two { @include float(left); @include padding-left($baseline); width: calc(100% - 380px); max-width: $learner-profile-container-flex; // Switch to map-get($grid-breakpoints,md) for bootstrap + font-family: $sans-serif; @media (max-width: $learner-profile-container-flex) { // Switch to map-get($grid-breakpoints,md) for bootstrap - @include padding-left(0); - width: 100%; + width: 90%; margin-top: $baseline; + padding: 0 5%; } .u-field-textarea { + @include padding(0, ($baseline*.75), ($baseline*.75), 0); margin-bottom: ($baseline/2); - @include padding(0, ($baseline*.75), ($baseline*.75), ($baseline/4)); + + @media (max-width: $learner-profile-container-flex) { // Switch to map-get($grid-breakpoints,md) for bootstrap + @include padding-left($baseline/4); + } .u-field-header { position: relative; @@ -355,12 +460,11 @@ .u-field-title { @extend %t-title6; - @extend %t-weight5; display: inline-block; margin-top: 0; margin-bottom: ($baseline/4); - color: $gray-dark; width: 100%; + font: $font-semibold 1.4em/1.4em $sans-serif; } .u-field-value { @@ -396,7 +500,7 @@ .u-field.mode-placeholder { padding: $baseline; - margin: $baseline * 0.75; + margin: $baseline*0.75 0; border: 2px dashed $gray-l3; i { diff --git a/lms/static/sass/lms-course-rtl.scss b/lms/static/sass/lms-course-rtl.scss index 654565bd98..d7b20b2b3d 100644 --- a/lms/static/sass/lms-course-rtl.scss +++ b/lms/static/sass/lms-course-rtl.scss @@ -5,5 +5,6 @@ @import 'base/variables'; @import 'base/font_face'; @import 'base/mixins'; +@import 'base/theme'; @import 'build-course'; // shared app style assets/rendering diff --git a/lms/static/sass/lms-course.scss b/lms/static/sass/lms-course.scss index 8ebd978a8e..4faa14b9f4 100644 --- a/lms/static/sass/lms-course.scss +++ b/lms/static/sass/lms-course.scss @@ -5,5 +5,6 @@ @import 'base/variables'; @import 'base/font_face'; @import 'base/mixins'; +@import 'base/theme'; @import 'build-course'; // shared app style assets/rendering diff --git a/lms/static/sass/lms-footer-edx-rtl.scss b/lms/static/sass/lms-footer-edx-rtl.scss index e189fe9e6d..e435906758 100644 --- a/lms/static/sass/lms-footer-edx-rtl.scss +++ b/lms/static/sass/lms-footer-edx-rtl.scss @@ -7,4 +7,4 @@ @import 'base/variables-rtl'; // Import shared build for the edx.org footer -@import 'build-footer-edx' +@import 'build-footer-edx'; diff --git a/lms/static/sass/lms-footer-edx.scss b/lms/static/sass/lms-footer-edx.scss index afa3d26592..44f54ccd87 100644 --- a/lms/static/sass/lms-footer-edx.scss +++ b/lms/static/sass/lms-footer-edx.scss @@ -7,4 +7,4 @@ @import 'base/variables-ltr'; // Import shared build for the edx.org footer -@import 'build-footer-edx' +@import 'build-footer-edx'; diff --git a/lms/static/sass/lms-footer-rtl.scss b/lms/static/sass/lms-footer-rtl.scss index ad15a1c9aa..ea5f2ab9ea 100644 --- a/lms/static/sass/lms-footer-rtl.scss +++ b/lms/static/sass/lms-footer-rtl.scss @@ -8,6 +8,7 @@ // base - utilities @import 'base/variables'; @import 'base/mixins'; +@import 'base/theme'; footer#footer-openedx { @import 'base/reset'; diff --git a/lms/static/sass/lms-footer.scss b/lms/static/sass/lms-footer.scss index 9173c23b7e..975c1a211a 100644 --- a/lms/static/sass/lms-footer.scss +++ b/lms/static/sass/lms-footer.scss @@ -8,6 +8,7 @@ // base - utilities @import 'base/variables'; @import 'base/mixins'; +@import 'base/theme'; footer#footer-openedx { @import 'base/reset'; diff --git a/lms/static/sass/partials/base/_theme.scss b/lms/static/sass/partials/base/_theme.scss new file mode 100644 index 0000000000..c1e4fb2230 --- /dev/null +++ b/lms/static/sass/partials/base/_theme.scss @@ -0,0 +1 @@ +// File to be overridden by themes diff --git a/lms/static/sass/partials/base/_variables.scss b/lms/static/sass/partials/base/_variables.scss index 1a86d447a0..d637e93d60 100644 --- a/lms/static/sass/partials/base/_variables.scss +++ b/lms/static/sass/partials/base/_variables.scss @@ -248,11 +248,14 @@ $state-danger-border: darken($state-danger-bg, 5%) !default; // ---------------------------- // logo colors -$micromasters-color: #005585; -$xseries-color: #424242; -$professional-certificate-color: #9a1f60; -$zebra-stripe-color: rgb(249, 250, 252); -$divider-color: rgb(226,231,236); +$audit-mode-color: $gray-dark !default; +$honor-mode-color: $uxpl-blue-base !default; +$verified-mode-color: $uxpl-green-base !default; +$micromasters-color: #005585 !default; +$xseries-color: #424242 !default; +$professional-certificate-color: #9a1f60 !default; +$zebra-stripe-color: rgb(249, 250, 252) !default; +$divider-color: rgb(226,231,236) !default; // old color variables // DEPRECATED: Do not continue to use these colors, instead use pattern libary and base colors above. diff --git a/openedx/features/learner_profile/__init__.py b/openedx/features/learner_profile/__init__.py index e69de29bb2..d1d21fdd14 100644 --- a/openedx/features/learner_profile/__init__.py +++ b/openedx/features/learner_profile/__init__.py @@ -0,0 +1,13 @@ +""" +Learner profile settings and helper methods. +""" + +from openedx.core.djangoapps.waffle_utils import WaffleFlag, WaffleFlagNamespace + + +# Namespace for learner profile waffle flags. +WAFFLE_FLAG_NAMESPACE = WaffleFlagNamespace(name='learner_profile') + +# Waffle flag to show achievements on the learner profile. +# TODO: LEARNER-2443: 08/2017: Remove flag after rollout. +SHOW_ACHIEVEMENTS_FLAG = WaffleFlag(WAFFLE_FLAG_NAMESPACE, 'show_achievements') diff --git a/openedx/features/learner_profile/static/learner_profile/fixtures/learner_profile.html b/openedx/features/learner_profile/static/learner_profile/fixtures/learner_profile.html index d3719597f5..61c139210a 100644 --- a/openedx/features/learner_profile/static/learner_profile/fixtures/learner_profile.html +++ b/openedx/features/learner_profile/static/learner_profile/fixtures/learner_profile.html @@ -1,19 +1,40 @@
+
- + Loading -
-${completion_date_message_html}
+${completion_date_message_html}
+${_("Loading")}
+${_("Loading")}
+