LMS: revises styling/placement of message for verified status on dashboard

lms/static/sass/multicourse/_dashboard.scss

@@ -419,22 +419,22 @@
       // STATE: course mode - verified
       &.verified {
         @extend %ui-depth2;
-        margin-top: ($baseline*2.5);
-        border-top: 1px solid $verified-color-lvl3;
-        padding-top: ($baseline*1.25);
-        background: $white;
+        position: relative;
 
-        // FIXME: bad, but needed selector!
-        .info > hgroup .date-block {
-          top: ($baseline*1.25);
+        .cover {
+          border-radius: ($baseline/10);
+          border: 1px solid $verified-color-lvl3;
+          border-bottom: 4px solid $verified-color-lvl3;
+          padding: ($baseline/10);
         }
 
         // course enrollment status message
         .sts-enrollment {
           display: inline-block;
           position: absolute;
-          top: -28px;
-          right: ($baseline/2);
+          top: 105px;
+          left: 55px;
+          bottom: ($baseline/2);
           text-align: center;
 
           .label {
@@ -454,8 +454,8 @@
             @extend %copy-badge;
             border-radius: 0;
             padding: ($baseline/4) ($baseline/2) ($baseline/4) $baseline;
-            color: $white;
             background: $verified-color-lvl3;
+            color: $white;
           }
         }
       }

lms/static/sass/views/_verification.scss

@@ -82,10 +82,11 @@
 
 %copy-badge {
   @extend %t-title8;
-  @extend %t-weight5;
+  @extend %t-weight4;
   border-radius: ($baseline/5);
   padding: ($baseline/2) $baseline;
   text-transform: uppercase;
+  letter-spacing: 0.1rem;
 }
 
 // ====================

lms/templates/dashboard/dashboard_course_listing.html

@@ -30,11 +30,11 @@
     % endif
 
     % if enrollment.mode == "verified":
-    <span class="sts-enrollment">
-      <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">${_("ID Verified")}</span>
-    </span>
+      <span class="sts-enrollment">
+        <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">${_("ID Verified")}</span>
+      </span>
     % endif
 
     <section class="info">