Verification: revises UI header copy

lms/static/sass/views/_verification.scss

@@ -469,15 +469,11 @@
       @include clearfix();
       width: flex-grid(12,12);
 
-      .wrapper-sts, .sts-track {
+      .sts-course, .sts-track {
         display: inline-block;
         vertical-align: middle;
       }
 
-      .wrapper-sts {
-        width: flex-grid(9,12);
-      }
-
       .sts-track {
         width: flex-grid(3,12);
         text-align: right;
@@ -495,19 +491,36 @@
         }
       }
 
-      .sts {
+      .sts-label {
         @extend .t-title7;
         display: block;
+        margin-bottom: ($baseline/2);
+        border-bottom: ($baseline/10) solid $m-gray-l4;
+        padding-bottom: ($baseline/2);
         color: $m-gray;
       }
 
       .sts-course {
         @extend .t-title;
+        width: flex-grid(9,12);
+        text-transform: none;
+      }
+
+      .sts-course-org, .sts-course-number {
+        @extend .t-title5;
+        @extend .t-weight4;
+        display: inline-block;
+      }
+
+      .sts-course-org {
+        margin-right: ($baseline/4);
+      }
+
+      .sts-course-name {
         @include font-size(28);
         @include line-height(28);
         @extend .t-weight4;
         display: block;
-        text-transform: none;
       }
     }
   }

lms/templates/shoppingcart/verified_cert_receipt.html

@@ -18,21 +18,26 @@
   <section class="wrapper cart-list">
 
     <header class="page-header">
-  <h2 class="title">
-    <span class="wrapper-sts">
-      <span class="sts">${_("You are now registered for")}</span>
-      <span class="sts-course">${course_name} (${course_org}, ${course_num})</span>
-    </span>
-    <span class="sts-track">
-      <span class="sts-track-value">
-        <span class="context">${_("Registered as: ")}</span> ${_("ID Verified")}
-      </span>
-    </span>
-  </h2>
-</header>
+      <h2 class="title">
+        <span class="sts-label">${_("You are now registered for: ")}</span>
 
+        <span class="wrapper-sts">
+          <span class="sts-course">
+            <span class="sts-course-org">${course_org}</span>
+            <span class="sts-course-number">${course_num}</span>
+            <span class="sts-course-name">${course_name}</span>
+          </span>
 
- <div class="wrapper-progress">
+          <span class="sts-track">
+            <span class="sts-track-value">
+              <span class="context">${_("Registering as: ")}</span> ${_("ID Verified")}
+            </span>
+          </span>
+        </span>
+      </h2>
+    </header>
+
+    <div class="wrapper-progress">
       <section class="progress">
         <h3 class="sr title">${_("Your Progress")}</h3>
 

lms/templates/verify_student/_verification_header.html

@@ -2,13 +2,19 @@
 
 <header class="page-header">
   <h2 class="title">
+    <span class="sts-label">${_("You are registering for")}</span>
+
     <span class="wrapper-sts">
-      <span class="sts">${_("You are registering for")}</span>
-      <span class="sts-course">${course_name} (${course_org}, ${course_num})</span>
-    </span>
-    <span class="sts-track">
-      <span class="sts-track-value">
-        <span class="context">${_("Registering as: ")}</span> ${_("ID Verified")}
+      <span class="sts-course">
+        <span class="sts-course-org">${course_org}</span>
+        <span class="sts-course-number">${course_num}</span>
+        <span class="sts-course-name">${course_name}</span>
+      </span>
+
+      <span class="sts-track">
+        <span class="sts-track-value">
+          <span class="context">${_("Registering as: ")}</span> ${_("ID Verified")}
+        </span>
       </span>
     </span>
   </h2>