PR review changes for LMS reverification

lms/static/sass/base/_variables.scss

@@ -225,9 +225,9 @@ $warning-color: $m-pink;
 $confirm-color: $m-green;
 
 // Notifications
-$notify-banner-bg1: rgb(56,56,56);
-$notify-banner-bg2: rgb(136,136,136);
-$notify-banner-bg3: rgb(223,223,223);
+$notify-banner-bg-1: rgb(56,56,56);
+$notify-banner-bg-2: rgb(136,136,136);
+$notify-banner-bg-3: rgb(223,223,223);
 
 $alert-color: rgb(212, 64, 64); //rich red
 $warning-color: rgb(237, 189, 60); //rich yellow

lms/static/sass/elements/_system-feedback.scss

@@ -5,10 +5,15 @@
 
 // UI : message
 .wrapper-msg {
-  box-shadow: 0 0 5px $shadow-d1 inset;
+  display: block;
   margin-bottom: ($baseline/4);
+  box-shadow: 0 0 5px $shadow-d1 inset;
+  background: $notify-banner-bg-1;
   padding: $baseline ($baseline*1.5);
-  background: $notify-banner-bg1;
+
+  &.is-hidden {
+    display: none;
+  }
 
   // basic object
   .msg {
@@ -84,13 +89,17 @@
         border: none;
         text-shadow: none;
         color: inherit;
+
+        &:hover {
+          color: $action-primary-bg;
+        }
       }
     }
   }
 
   // object variations
   &.urgency-high {
-    background: $notify-banner-bg1;
+    background: $notify-banner-bg-1;
 
     .msg {
       color: $white;
@@ -98,7 +107,7 @@
   }
 
   &.urgency-mid {
-    background: $notify-banner-bg2;
+    background: $notify-banner-bg-2;
 
     .msg {
       color: $white;
@@ -106,7 +115,7 @@
   }
 
   &.urgency-low {
-    background: $notify-banner-bg3;
+    background: $notify-banner-bg-3;
 
     .msg {
       color: $black;
@@ -126,6 +135,7 @@
   }
 }
 
+
 // prompts
 
 // notifications

lms/static/sass/multicourse/_dashboard.scss

@@ -171,11 +171,11 @@
           }
 
           .course-name {
+            @include line-height(12);
             display: inline-block;
             vertical-align: top;
             width: 80%;
             color: inherit;
-            line-height: 1.4;
           }
         }
       }

lms/static/sass/views/_verification.scss

@@ -1853,10 +1853,10 @@
             }
 
             .reverify-status {
+              @extend %t-weight4;
               border-top: 1px solid $light-gray;
               background-color: $m-gray-l4;
               color: $success-color;
-              font-weight: 600;
             }
           }
 
@@ -1872,10 +1872,10 @@
             }
 
             .reverify-status {
+              @extend %t-weight4;
               border-top: 1px solid $light-gray;
               background-color: $m-gray-l4;
               color: $warning-color;
-              font-weight: 600;
             }
           }
 
@@ -1891,10 +1891,10 @@
             }
 
             .reverify-status {
+              @extend %t-weight4;
               border-top: 1px solid $light-gray;
               background-color: $m-gray-l4;
               color: $alert-color;
-              font-weight: 600;
             }
           }
         }
@@ -2261,7 +2261,7 @@
 //reverify notification special styles
 .msg-reverify {
   .reverify-list {
-    margin: 5px 0;
+    margin: ($baseline/4) 0;
   }
 }
 

lms/templates/courseware/progress.html

@@ -29,7 +29,6 @@ ${progress_graph.body(grade_summary, course.grade_cutoffs, "grade-detail-graph",
 <%include file="/dashboard/_dashboard_prompt_midcourse_reverify.html" />
 <%include file="/courseware/course_navigation.html" args="active_page='progress'" />
 
-
 <section class="container">
   <div class="profile-wrapper">
 

lms/templates/dashboard.html

@@ -29,7 +29,7 @@
         type: "post",
         data: { 'user_id': ${user.id}, }
         })
-      $("#failed-verification-banner").css("display","none");
+      $("#failed-verification-banner").addClass('is-hidden');
       })
 
     $("#upgrade-to-verified").click(function(event) {

lms/templates/dashboard/_dashboard_prompt_midcourse_reverify.html

@@ -12,7 +12,7 @@
           <h2 class="title">${_("You need to re-verify to continue")}</h2>
           <div class="copy">
             <p class="activation-message">
-            ${_("To continue in the verified track in the following courses, you need to re-verify your identity:")}
+            ${_("To continue in the ID Verified track in the following courses, you need to re-verify your identity:")}
             </p>
             <ul class="reverify-list">
               % for item in reverifications["must_reverify"]:
@@ -41,7 +41,7 @@
           % for item in reverifications["must_reverify"]:
           <div class="copy">
             <p class='activation-message'>
-              ${_('To continue in the verified track in <strong>{course_name}</strong>, you need to re-verify your identity by {date}.').format(course_name=item.course_name, date=item.date)}
+              ${_('To continue in the ID Verified track in <strong>{course_name}</strong>, you need to re-verify your identity by {date}.').format(course_name=item.course_name, date=item.date)}
             </p>
           </div>
         </div>

lms/templates/verify_student/midcourse_reverify_dash.html

@@ -14,7 +14,7 @@
     <div class="wrapper-content-main">
       <article class="content-main">
 
-        <h2 class="title">${_("You are in the Verified track")}</h2>
+        <h2 class="title">${_("You are in the ID Verified track")}</h2>
 
         <div class="copy">
 
@@ -128,7 +128,7 @@
           <div class="faq-item">
             <h3 class="title faq-question">${_("What if I have trouble with my re-verification?")}</h3>
             <div class="copy faq-answer">
-              <p>Because of the short time that re-verification is open, you <b>will not be able to correct a failed verification</b>. If you think there was an error in the review, please contact us at <a href="stuff">support@edx.org</a>.</p>
+              <p>Because of the short time that re-verification is open, you <strong>will not be able to correct a failed verification</strong>. If you think there was an error in the review, please contact us at <a href="stuff">support@edx.org</a>.</p>
             </div>
           </div>
         </div>

lms/templates/verify_student/prompt_midcourse_reverify.html

 <%! from django.utils.translation import ugettext as _ %>
 <!--TODO replace this with something a clever deisgn person approves of-->
-<h2>${_("You need to re-verify to continue")}</h2>
+<h2 class="title">${_("You need to re-verify to continue")}</h2>
 <p class='activation-message'>
-	${_("To continue in the verified track in {course}, you need to re-verify your identity by {date}.  Go to URL.").format(email)}
+	${_("To continue in the ID Verified track in {course}, you need to re-verify your identity by {date}.  Go to URL.").format(email)}
 </p>