updated some of the design / architecture / styling

Author: Brendan English

app/components/header/header.html

@@ -1,26 +1,30 @@
-<div>
-  <!--
+<div class="header-wrap">
+  <div class="header-bg" ng-style="bottomHeaderStyle"></div>
   <div class="top-header">
     <div class="content">
       <div class="logo">
         <img ng-src="{{domain_logo}}"/>
       </div>
       <div class="user">
         <h1>{{transcript.user.givenName}} {{transcript.user.familyName}}</h1>
+        <div class="user-id">Student Id: {{transcript.user.sourced_id}}</div>
+        <div class="rop-time">Status as of: {{transcript.created_at}}</div>
+        <div class="btn-dash">
+          <button class="btn btn-white btn-outline">
+            <span>&laquo;</span>
+            Dashboard
+          </button>
+        </div>
       </div>
     </div>
   </div>
--->
-  <div class="bottom-header" ng-style="bottomHeaderStyle">
-    <div class="overlay">
-      <div class="content">
-        <div class="">
-          <button class="btn btn-default">Dashboard</button>
-        </div>
-        <div class="right">
-          <button class="btn btn-default">Send</button>
-        </div>
+  <div class="middle-header">
+    <div class="transcript-label content">
+      <span>Official Transcript</span>
+      <div class="right">
+        <div>This is an official transcript from the All American University Office of the Registrar.</div>
+        <div>Student information is guaranteed unaltered from the source.</div>
       </div>
     </div>
   </div>
-</div>
+</div>

app/components/transcript/competency/competency.scss

@@ -4,6 +4,7 @@
 
   .competency-content{
     margin-left: 40px;
+    margin-bottom: 0.25em;
     padding-top: 0.5em;
 
     * {

app/components/transcript/transcript.html

@@ -3,31 +3,22 @@
     <input type="text"
          ng-change="updateTranscript(transcriptUrl)"
          ng-model="transcriptUrl"
-         placeholder="url"></input>
+         placeholder="url">
     Url to transcript
     <i ng-if="transcriptLoading" class="fa fa-circle-o-notch fa-spin"></i>
   </div>
   <div class="content transcript" ng-if="!transcriptLoading">
-    <div class="transcript-label">
-      <span>Official Transcript</span>
-      <div class="right">
-        <div>This is an official transcript from the All American University Office of the Registrar.</div>
-        <div>Student information is guaranteed unaltered from the source.</div>
-      </div>
-    </div>
-
-    <div class="transcript-header">
-      <img ng-src="{{domain_logo_secondary}}" class="logo"/>
-      <div class="right">
-        <div class="user-name">{{transcript.user.givenName}} {{transcript.user.familyName}}</div>
-        <div class="user-id">Student Id: {{transcript.user.sourced_id}}</div>
-        <div class="rop-time">Status as of: {{transcript.created_at}}</div>
-      </div>
-    </div>
-
     <div class="transcript-body">
       <div class="program">
-        <div class="level">{{transcript.program.degree_level}}</div>
+        <h2 class="level">
+          {{transcript.program.degree_level}}
+          <div class="right">
+            <button class="btn btn-secondary">
+              Share
+              <span>&raquo;</span>
+            </button>
+          </div>
+        </h2>
         <div class="program-label">{{transcript.program.label}}</div>
       </div>
       <div class="unit-list">

app/index.html

@@ -7,12 +7,6 @@
         <meta name="description" content="">
         <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
         <link rel="stylesheet" href="/assets/styles/index.css"/>
-        <style>
-            body {
-                background: #FFF;
-                margin: 0;
-            }
-        </style>
         <script>
             window.lo_static_url = '/assets/';
         </script>