Skip to content

E
edx-platform
Commit 743326d2 by Stephen Sanchez
Options

Merge pull request #5497 from edx/sanchez/update-message-styles 

Adding new styles for dashboard notifications.
parents 1c2913dc afaaca96
Showing with 105 additions and 57 deletions
common/djangoapps/student/views.py
......@@ -480,7 +480,10 @@ def dashboard(request):
message = ""
if not user.is_active:
message = render_to_string('registration/activate_account_notice.html', {'email': user.email})
message = render_to_string(
'registration/activate_account_notice.html',
{'email': user.email, 'platform_name': settings.PLATFORM_NAME}
)
# Global staff can see what courses errored on their dashboard
staff_access = False
......
lms/djangoapps/courseware/features/signup.feature
......@@ -16,4 +16,4 @@ Feature: LMS.Sign in
And I check the checkbox named "terms_of_service"
And I check the checkbox named "honor_code"
And I submit the registration form
Then I should see "THANKS FOR REGISTERING!" in the dashboard banner
Then I should see "Thanks for Registering!" in the dashboard banner
lms/static/sass/elements/_system-feedback.scss
......@@ -6,8 +6,6 @@
// UI : message
.wrapper-msg {
display: block;
margin-bottom: ($baseline/4);
box-shadow: 0 0 5px $shadow-d1 inset;
background: $notify-banner-bg-1;
padding: $baseline ($baseline*1.5);
......
lms/static/sass/multicourse/_dashboard.scss
......@@ -5,27 +5,6 @@
@include clearfix;
padding: ($baseline*2) 0 0 0;
.dashboard-banner {
background: $yellow;
border: 1px solid rgb(200,200,200);
box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
padding: 10px;
margin-bottom: 30px;
&:empty {
display: none;
background-color: #FFF;
}
h2 {
margin-bottom: 0;
}
p {
margin-bottom: 0;
}
}
.profile-sidebar {
float: left;
margin-right: flex-gutter();
......@@ -1166,3 +1145,31 @@
opacity: 0.5;
}
.dashboard-banner {
&:empty {
display: none;
}
.wrapper-msg {
padding-bottom: 0;
}
.msg {
@include clearfix();
font-family: $sans-serif;
padding-bottom: $baseline;
border-bottom: thin solid $gray;
&.title {
@extend %t-title5;
@extend %t-weight4;
font-family: $f-sans-serif;
// Overriding Platform h2 styles
text-transform: none;
letter-spacing: 0;
}
}
}
lms/templates/dashboard.html
......@@ -24,6 +24,13 @@
<script type="text/javascript">
(function() {
// On initialization, set focus to the first notification available
// for screen readers.
var notifications = $('.dashboard-notifications');
if (notifications.children().length > 0) {
notifications.focus();
}
$('.message.is-expandable .wrapper-tip').bind('click', toggleExpandMessage);
function toggleExpandMessage(e) {
......@@ -178,30 +185,34 @@
</script>
</%block>
% if reverifications["must_reverify"] or reverifications["denied"]:
<section class="dashboard-banner">
<%include file='dashboard/_dashboard_prompt_midcourse_reverify.html' />
</section>
% endif
<div class="dashboard-notifications" tabindex="-1">
% if reverifications["must_reverify"] or reverifications["denied"]:
## Section Element must be outside of the re-verify template. The template is re-used for courseware, and has separate styling.
<section class="dashboard-banner">
<%include file='dashboard/_dashboard_prompt_midcourse_reverify.html' />
</section>
% endif
<section class="container dashboard" id="dashboard-main" aria-hidden="false">
%if message:
<section class="dashboard-banner">
${message}
</section>
%endif
%if message:
<section class="dashboard-banner">
${message}
</section>
%endif
% if duplicate_provider:
<section class="dashboard-banner third-party-auth">
<%include file='dashboard/_dashboard_third_party_error.html' />
</section>
% endif
%if enrollment_message:
${enrollment_message}
%endif
%if enrollment_message:
<section class="dashboard-banner">
${enrollment_message}
</section>
%endif
</div>
% if duplicate_provider:
<section class="dashboard-banner third-party-auth">
## Translators: this message is displayed when a user tries to link their account with a third-party authentication provider (for example, Google or LinkedIn) with a given edX account, but their third-party account is already associated with another edX account. provider_name is the name of the third-party authentication provider, and platform_name is the name of the edX deployment.
<p>${_("The {provider_name} account you selected is already linked to another {platform_name} account.").format(provider_name='<strong>%s</strong>' % duplicate_provider.NAME, platform_name=platform_name)}
</section>
% endif
<section class="container dashboard" id="dashboard-main">
<section class="profile-sidebar">
<header class="profile">
......
lms/templates/dashboard/_dashboard_prompt_midcourse_reverify.html
<%! from django.utils.translation import ugettext as _ %>
<%! from django.core.urlresolvers import reverse %>
% if reverifications["must_reverify"]:
% if len(reverifications["must_reverify"]) > 1:
......@@ -32,7 +31,6 @@
</nav>
</div>
</div>
</div>
% elif reverifications["must_reverify"]:
<div class="wrapper-msg urgency-high">
......@@ -57,13 +55,12 @@
</nav>
</div>
</div>
</div>
% endfor
%endif
%endif
%if reverifications["denied"] and denied_banner:
<div class="wrapper-msg urgency-low" id="failed-verification-banner">
<div class="wrapper-msg urgency-high" id="failed-verification-banner">
<div class="msg msg-reverify is-dismissable">
<div class="msg-content">
<h2 class="title">${_("Your re-verification failed")}</h2>
......@@ -79,13 +76,12 @@
)}
</p>
</div>
% endif
% endfor
</div>
<div class="action-dismiss">
<button class="button-dismiss" id="failed-verification-button-dismiss"><i class="icon-remove-sign"></i> <span class="sr">${_('Dismiss')}</span></button>
</div>
</div>
</div>
</div>
% endif
% endfor
%endif
lms/templates/dashboard/_dashboard_third_party_error.html 0 → 100644
<%! from django.utils.translation import ugettext as _ %>
<div class="wrapper-msg urgency-high">
<div class="msg">
<div class="msg-content">
<h2 class="sr">${_("Could Not Link Accounts")}</h2>
<div class="copy">
## Translators: this message is displayed when a user tries to link their account with a third-party authentication provider (for example, Google or LinkedIn) with a given edX account, but their third-party account is already associated with another edX account. provider_name is the name of the third-party authentication provider, and platform_name is the name of the edX deployment.
<p>${_("The {provider_name} account you selected is already linked to another {platform_name} account.").format(provider_name='<strong>{duplicate_provider}</strong>'.format(duplicate_provider=duplicate_provider.NAME), platform_name=platform_name)}</p>
</div>
</div>
</div>
</div>
lms/templates/enrollment/course_enrollment_message.html
<%! from django.utils.translation import ugettext as _ %>
% for course, enrollment in recent_course_enrollment_pairs:
<section class="dashboard-banner">
<p class='activation-message'>${_("You have successfully enrolled in {enrolled_course}.").format(enrolled_course=course.display_name)}</p>
</section>
<div class="wrapper-msg urgency-high">
<div class="msg">
<div class="msg-content">
<h2 class="sr">${_("Enrollment Successful")}</h2>
<div class="copy">
<p>${_("You have successfully enrolled in {enrolled_course}.").format(enrolled_course=course.display_name)}</p>
</div>
</div>
</div>
</div>
% endfor
lms/templates/registration/activate_account_notice.html
<%! from django.utils.translation import ugettext as _ %>
<h2>${_("Thanks For Registering!")}</h2>
<p class='activation-message'>${_("Your account is not active yet. An activation link has been sent to {email}, along with instructions for activating your account.").format(email="<strong>{}</strong>".format(email))}</p>
<div class="wrapper-msg urgency-high">
<div class="msg">
<div class="msg-content">
<h2 class="title">${_("Thanks for Registering!")}</h2>
<div class="copy">
<p class='activation-message'>${_(
"You've successfully created an account on {platform_name}. We've sent an account "
"activation message to {email}. To activate your account and start enrolling in "
"courses, click the link in the message."
).format(email="<strong>{}</strong>".format(email), platform_name=platform_name
)}
</p>
</div>
</div>
</div>
</div>
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