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 @@
@extend %text-sr;
}
.deco-graphic {
position: absolute;
top: -5px;
right: -8px;
}
.sts-enrollment-value {
@extend %ui-depth1;
@extend %copy-badge;
......@@ -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 {
......
lms/templates/dashboard/_dashboard_course_listing.html
......@@ -56,42 +56,42 @@
% 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="label">${_("Enrolled as: ")}</span>
<img class="deco-graphic" src="${static.url('images/vcert-ribbon-s.png')}" alt="ID Verified Pending Ribbon/Badge" />
<span class="sts-enrollment-value">${_("Verified Pending")}</span>
<img class="deco-graphic" src="${static.url('images/verified-ribbon.png')}" alt="ID Verified Pending Ribbon/Badge" />
<div class="sts-enrollment-value">${_("Verified Pending")}</div>
</span>
% elif verification_status.get('status') == VERIFY_STATUS_APPROVED:
<span class="sts-enrollment" title="${_("You're enrolled as a verified student")}">
<span class="label">${_("Enrolled as: ")}</span>
<img class="deco-graphic" src="${static.url('images/vcert-ribbon-s.png')}" alt="ID Verified Ribbon/Badge" />
<span class="sts-enrollment-value">${_("Verified")}</span>
<img class="deco-graphic" src="${static.url('images/verified-ribbon.png')}" alt="ID Verified Ribbon/Badge" />
<div class="sts-enrollment-value">${_("Verified")}</div>
</span>
% else:
<span class="sts-enrollment" title="${_("You're enrolled as an honor code student")}">
<span class="label">${_("Enrolled as: ")}</span>
<span class="sts-enrollment-value">${_("Honor Code")}</span>
<div class="sts-enrollment-value">${_("Honor Code")}</div>
</span>
% endif
% else:
<span class="sts-enrollment" title="${_("You're enrolled as a verified student")}">
<span class="label">${_("Enrolled as: ")}</span>
<img class="deco-graphic" src="${static.url('images/vcert-ribbon-s.png')}" alt="ID Verified Ribbon/Badge" />
<span class="sts-enrollment-value">${_("Verified")}</span>
<img class="deco-graphic" src="${static.url('images/verified-ribbon.png')}" alt="ID Verified Ribbon/Badge" />
<div class="sts-enrollment-value">${_("Verified")}</div>
</span>
% endif
% elif enrollment.mode == "honor":
<span class="sts-enrollment" title="${_("You're enrolled as an honor code student")}">
<span class="label">${_("Enrolled as: ")}</span>
<span class="sts-enrollment-value">${_("Honor Code")}</span>
<div class="sts-enrollment-value">${_("Honor Code")}</div>
</span>
% elif enrollment.mode == "audit":
<span class="sts-enrollment" title="${_("You're auditing this course")}">
<span class="label">${_("Enrolled as: ")}</span>
<span class="sts-enrollment-value">${_("Auditing")}</span>
<div class="sts-enrollment-value">${_("Auditing")}</div>
</span>
% elif enrollment.mode == "professional":
<span class="sts-enrollment" title="${_("You're enrolled as a professional education student")}">
<span class="label">${_("Enrolled as: ")}</span>
<span class="sts-enrollment-value">${_("Professional Ed")}</span>
<div class="sts-enrollment-value">${_("Professional Ed")}</div>
</span>
% endif
% endif
......@@ -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:
<div class="message message-status is-shown">
% if verification_status['status'] == VERIFY_STATUS_NEED_TO_VERIFY:
% if verification_status['days_until_deadline'] is not None:
<h4 class="message-title">${_('Verification not yet complete.')}</h4>
<p class="message-copy">${_('You only have {days} days left to verify for this course.').format(days=verification_status['days_until_deadline'])}</p>
% else:
<h4 class="message-title">${_('Almost there!')}</h4>
<p class="message-copy">${_('You still need to verify for this course.')}</p>
% endif
## TODO: style this button
<p>${_('Verify Now')}</p>
<div class="verification-reminder">
% if verification_status['days_until_deadline'] is not None:
<h4 class="message-title">${_('Verification not yet complete.')}</h4>
<p class="message-copy">${_('You only have {days} days left to verify for this course.').format(days=verification_status['days_until_deadline'])}</p>
% else:
<h4 class="message-title">${_('Almost there!')}</h4>
<p class="message-copy">${_('You still need to verify for this course.')}</p>
% endif
</div>
<div class="verification-cta">
<a href="#" class="cta">${_('Verify Now')}</a>
</div>
% elif verification_status['status'] == VERIFY_STATUS_SUBMITTED:
<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>
......
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