From 04de913dbefdf66bc663c48aa90fcac50d98f7f0 Mon Sep 17 00:00:00 2001 From: Ahsan Ulhaq Date: Thu, 8 Oct 2015 17:53:46 +0500 Subject: [PATCH] Updated Styling for Courses and Existing Messaging ECOM-2435 --- lms/static/images/icon-sm-verified.png | Bin 0 -> 3247 bytes lms/static/sass/elements/_controls.scss | 6 +++ lms/static/sass/multicourse/_dashboard.scss | 35 ++++++++++++++++-- .../dashboard/_dashboard_course_listing.html | 27 ++++++-------- 4 files changed, 49 insertions(+), 19 deletions(-) create mode 100644 lms/static/images/icon-sm-verified.png diff --git a/lms/static/images/icon-sm-verified.png b/lms/static/images/icon-sm-verified.png new file mode 100644 index 0000000000000000000000000000000000000000..b394da6041db1b975ba9f27d9c537069bdc92f77 GIT binary patch literal 3247 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 literal 0 HcmV?d00001 diff --git a/lms/static/sass/elements/_controls.scss b/lms/static/sass/elements/_controls.scss index b5fc942284..0400d9d15d 100644 --- a/lms/static/sass/elements/_controls.scss +++ b/lms/static/sass/elements/_controls.scss @@ -314,6 +314,12 @@ color: $action-primary-fg; } +%btn-pl-white-base{ + @extend %btn-pl-default-base; + background-color: $action-primary-fg; + color: $action-primary-bg; +} + %btn-pl-green-base { @extend %btn-pl-default-base; background-color: darken($green-d1,10%); diff --git a/lms/static/sass/multicourse/_dashboard.scss b/lms/static/sass/multicourse/_dashboard.scss index d4d7a351f2..52c87bb66d 100644 --- a/lms/static/sass/multicourse/_dashboard.scss +++ b/lms/static/sass/multicourse/_dashboard.scss @@ -251,6 +251,10 @@ border-bottom: 4px solid $border-color-l4; padding-bottom: $baseline; + .course-container{ + border: 1px solid $border-color-l4; + border-radius: 3px; + } &:last-child { margin-bottom: 0; border-bottom: none; @@ -528,7 +532,7 @@ } .enter-course { - @extend %btn-pl-primary-base; + @extend %btn-pl-white-base; @include float(right); &.archived { @@ -672,20 +676,43 @@ } .wrapper-extended { - padding: ($baseline/2) 0; + padding: ($baseline/4) 0; .message-copy { - margin-bottom: $baseline; + width: flex-grid(9, 12); + display: inline-block; + + .message-copy-bold{ + font-weight: 600; + } } } + .action-upgrade-container{ + @include float(right); + display: inline-block; + margin-top: ($baseline/2); + } .action-upgrade { @extend %btn-primary-green; @include clearfix(); position: relative; left: ($baseline/2); - padding: 8px $baseline 8px ($baseline*2); + padding: ($baseline * 0.4) 0 ($baseline * 0.4) ($baseline * 0.75); + .action-upgrade-icon{ + @include float(left); + display: inline; + + @include margin-right($baseline*0.4); + margin-top: ($baseline/4); + background: url('#{$static-path}/images/icon-sm-verified.png') no-repeat; + background-position: -($baseline*0.3); + background-color: white; + + width: ($baseline*0.8); + height: ($baseline*0.7); + } .deco-graphic { position: absolute; top: -($baseline/4); diff --git a/lms/templates/dashboard/_dashboard_course_listing.html b/lms/templates/dashboard/_dashboard_course_listing.html index 0798c9d920..10f66f91ad 100644 --- a/lms/templates/dashboard/_dashboard_course_listing.html +++ b/lms/templates/dashboard/_dashboard_course_listing.html @@ -42,7 +42,7 @@ from student.helpers import ( % else: <% mode_class = '' %> % endif - +
<% course_target = reverse('info', args=[unicode(course_overview.id)]) %>
@@ -319,26 +319,22 @@ from student.helpers import ( % if course_mode_info['show_upsell'] and not is_course_blocked:
-
-

- ${_("Challenge Yourself!")} -

-

${_("Take this course as an ID-verified student.")}

-
-

${_("You can still sign up for an ID verified {cert_name_long} for this course. If you plan to complete the whole course, it is a great way to recognize your achievement. {link_start}Learn more about the verified {cert_name_long}{link_end}.").format(link_start=''.format(marketing_link('WHAT_IS_VERIFIED_CERT')), link_end="", cert_name_long=cert_name_long)}

- - +
%endif @@ -383,6 +379,7 @@ from student.helpers import ( +