Skip to content

E
edx-platform
Commit 962dc221 by AlasdairSwan Committed by Will Daly
Options

ECOM-677 ECOM-678 styled the new messages

parent 464dfcfa
Showing with 52 additions and 19 deletions
lms/static/sass/multicourse/_dashboard.scss
...@@ -488,6 +488,12 @@ ...@@ -488,6 +488,12 @@
@extend %text-sr; @extend %text-sr;
} }
.deco-graphic {
position: absolute;
top: -5px;
right: -8px;
}
.sts-enrollment-value { .sts-enrollment-value {
@extend %ui-depth1; @extend %ui-depth1;
@extend %copy-badge; @extend %copy-badge;
...@@ -893,6 +899,30 @@ ...@@ -893,6 +899,30 @@
} }
} }
} }
.verification-reminder {
width: flex-grid(8, 12);
position: relative;
float: left;
}
.verification-cta {
width: flex-grid(4, 12);
position: relative;
float: left;
.cta {
@include button(simple, $green-d1);
@include box-sizing(border-box);
@include float(right);
border-radius: 3px;
display: block;
font: normal 15px/1.6rem $sans-serif;
letter-spacing: 0;
padding: 6px 32px 7px;
text-align: center;
}
}
} }
a.unenroll { a.unenroll {
......
lms/templates/dashboard/_dashboard_course_listing.html
...@@ -56,42 +56,42 @@ ...@@ -56,42 +56,42 @@
% if verification_status.get('status') in [VERIFY_STATUS_NEED_TO_VERIFY, VERIFY_STATUS_SUBMITTED]: % if verification_status.get('status') in [VERIFY_STATUS_NEED_TO_VERIFY, VERIFY_STATUS_SUBMITTED]:
<span class="sts-enrollment" title="${_("Your verification is pending")}"> <span class="sts-enrollment" title="${_("Your verification is pending")}">
<span class="label">${_("Enrolled as: ")}</span> <span class="label">${_("Enrolled as: ")}</span>
<img class="deco-graphic" src="${static.url('images/vcert-ribbon-s.png')}" alt="ID Verified Pending Ribbon/Badge" /> <img class="deco-graphic" src="${static.url('images/verified-ribbon.png')}" alt="ID Verified Pending Ribbon/Badge" />
<span class="sts-enrollment-value">${_("Verified Pending")}</span> <div class="sts-enrollment-value">${_("Verified Pending")}</div>
</span> </span>
% elif verification_status.get('status') == VERIFY_STATUS_APPROVED: % elif verification_status.get('status') == VERIFY_STATUS_APPROVED:
<span class="sts-enrollment" title="${_("You're enrolled as a verified student")}"> <span class="sts-enrollment" title="${_("You're enrolled as a verified student")}">
<span class="label">${_("Enrolled as: ")}</span> <span class="label">${_("Enrolled as: ")}</span>
<img class="deco-graphic" src="${static.url('images/vcert-ribbon-s.png')}" alt="ID Verified Ribbon/Badge" /> <img class="deco-graphic" src="${static.url('images/verified-ribbon.png')}" alt="ID Verified Ribbon/Badge" />
<span class="sts-enrollment-value">${_("Verified")}</span> <div class="sts-enrollment-value">${_("Verified")}</div>
</span> </span>
% else: % else:
<span class="sts-enrollment" title="${_("You're enrolled as an honor code student")}"> <span class="sts-enrollment" title="${_("You're enrolled as an honor code student")}">
<span class="label">${_("Enrolled as: ")}</span> <span class="label">${_("Enrolled as: ")}</span>
<span class="sts-enrollment-value">${_("Honor Code")}</span> <div class="sts-enrollment-value">${_("Honor Code")}</div>
</span> </span>
% endif % endif
% else: % else:
<span class="sts-enrollment" title="${_("You're enrolled as a verified student")}"> <span class="sts-enrollment" title="${_("You're enrolled as a verified student")}">
<span class="label">${_("Enrolled as: ")}</span> <span class="label">${_("Enrolled as: ")}</span>
<img class="deco-graphic" src="${static.url('images/vcert-ribbon-s.png')}" alt="ID Verified Ribbon/Badge" /> <img class="deco-graphic" src="${static.url('images/verified-ribbon.png')}" alt="ID Verified Ribbon/Badge" />
<span class="sts-enrollment-value">${_("Verified")}</span> <div class="sts-enrollment-value">${_("Verified")}</div>
</span> </span>
% endif % endif
% elif enrollment.mode == "honor": % elif enrollment.mode == "honor":
<span class="sts-enrollment" title="${_("You're enrolled as an honor code student")}"> <span class="sts-enrollment" title="${_("You're enrolled as an honor code student")}">
<span class="label">${_("Enrolled as: ")}</span> <span class="label">${_("Enrolled as: ")}</span>
<span class="sts-enrollment-value">${_("Honor Code")}</span> <div class="sts-enrollment-value">${_("Honor Code")}</div>
</span> </span>
% elif enrollment.mode == "audit": % elif enrollment.mode == "audit":
<span class="sts-enrollment" title="${_("You're auditing this course")}"> <span class="sts-enrollment" title="${_("You're auditing this course")}">
<span class="label">${_("Enrolled as: ")}</span> <span class="label">${_("Enrolled as: ")}</span>
<span class="sts-enrollment-value">${_("Auditing")}</span> <div class="sts-enrollment-value">${_("Auditing")}</div>
</span> </span>
% elif enrollment.mode == "professional": % elif enrollment.mode == "professional":
<span class="sts-enrollment" title="${_("You're enrolled as a professional education student")}"> <span class="sts-enrollment" title="${_("You're enrolled as a professional education student")}">
<span class="label">${_("Enrolled as: ")}</span> <span class="label">${_("Enrolled as: ")}</span>
<span class="sts-enrollment-value">${_("Professional Ed")}</span> <div class="sts-enrollment-value">${_("Professional Ed")}</div>
</span> </span>
% endif % endif
% endif % endif
...@@ -131,15 +131,18 @@ ...@@ -131,15 +131,18 @@
% if verification_status.get('status') in [VERIFY_STATUS_NEED_TO_VERIFY, VERIFY_STATUS_SUBMITTED, VERIFY_STATUS_APPROVED] and not is_course_blocked: % if verification_status.get('status') in [VERIFY_STATUS_NEED_TO_VERIFY, VERIFY_STATUS_SUBMITTED, VERIFY_STATUS_APPROVED] and not is_course_blocked:
<div class="message message-status is-shown"> <div class="message message-status is-shown">
% if verification_status['status'] == VERIFY_STATUS_NEED_TO_VERIFY: % if verification_status['status'] == VERIFY_STATUS_NEED_TO_VERIFY:
% if verification_status['days_until_deadline'] is not None: <div class="verification-reminder">
<h4 class="message-title">${_('Verification not yet complete.')}</h4> % if verification_status['days_until_deadline'] is not None:
<p class="message-copy">${_('You only have {days} days left to verify for this course.').format(days=verification_status['days_until_deadline'])}</p> <h4 class="message-title">${_('Verification not yet complete.')}</h4>
% else: <p class="message-copy">${_('You only have {days} days left to verify for this course.').format(days=verification_status['days_until_deadline'])}</p>
<h4 class="message-title">${_('Almost there!')}</h4> % else:
<p class="message-copy">${_('You still need to verify for this course.')}</p> <h4 class="message-title">${_('Almost there!')}</h4>
% endif <p class="message-copy">${_('You still need to verify for this course.')}</p>
## TODO: style this button % endif
<p>${_('Verify Now')}</p> </div>
<div class="verification-cta">
<a href="#" class="cta">${_('Verify Now')}</a>
</div>
% elif verification_status['status'] == VERIFY_STATUS_SUBMITTED: % elif verification_status['status'] == VERIFY_STATUS_SUBMITTED:
<h4 class="message-title">${_('You have already verified your ID!')}</h4> <h4 class="message-title">${_('You have already verified your ID!')}</h4>
<p class="message-copy">${_('Thanks for your patience as we process your request.')}</p> <p class="message-copy">${_('Thanks for your patience as we process your request.')}</p>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment