Merge pull request #201 from AppliedIS/ui-styling-admin

Layout, typograhpy updates for admin

DOL.WHD.Section14c.Web/src/modules/components/sectionAdminAppInfo/sectionAdminAppInfoTemplate.html

@@ -1,8 +1,9 @@
 <div class="admin-page">
+    <div class="dol-form-section-title">
+        <h2>Application Info</h2>
+    </div>
 
-    <h1>Application Info</h1>
-
-    <h2>Application Type</h2>
+    <h3>Application Type</h3>
     <hr>
 
     <answer-field answer="appData.applicationType.display">
@@ -31,7 +32,7 @@ <h2>Application Type</h2>
         </li>
     </ul>
 
-    <h2>Application Contact Person</h2>
+    <h3>Application Contact Person</h3>
     <hr>
 
     <answer-field answer="appData.contactName">

DOL.WHD.Section14c.Web/src/modules/components/sectionAdminAssurances/sectionAdminAssurancesTemplate.html

@@ -1,6 +1,7 @@
 <div class="admin-page">
-    <h1>Assurances</h1>
-    <hr>
+    <div class="dol-form-section-title">
+	    <h2>Assurances</h2>
+    </div>
     <div class="usa-content">
         <p>I certify that I have read this form and to the best of my knowledge and belief, all answers and information given
             in the application and attachments are true; that the representations set forth in support of this application

DOL.WHD.Section14c.Web/src/modules/components/sectionAdminEmployer/sectionAdminEmployerTemplate.html

@@ -1,8 +1,9 @@
 <div class="admin-page">
+    <div class="dol-form-section-title">
+        <h2>Employer</h2>
+    </div>
 
-    <h1>Employer</h1>
-
-    <h2>Employer Information</h2>
+    <h3>Employer Information</h3>
     <hr>
 
     <answer-field answer="appData.employer.legalName">
@@ -63,7 +64,7 @@ <h2>Employer Information</h2>
         Is this employer a local or State educational agency?
     </answer-field>
 
-    <h2>Number of Workers With Disabilities</h2>
+    <h3>Number of Workers With Disabilities</h3>
     <hr>
 
     <answer-field answer="appData.employer.fiscalQuarterEndDate" datefield="true">
@@ -94,7 +95,7 @@ <h2>Number of Workers With Disabilities</h2>
         <span class="subtext">Business Establishment</span>
     </answer-field>
 
-    <h2>Government Contracts</h2>
+    <h3>Government Contracts</h3>
     <hr>
 
     <answer-field answer="appData.employer.pca">
@@ -117,7 +118,7 @@ <h2>Government Contracts</h2>
         Since January 1, 2015, has this employer entered into a contract for services or concessions with the Federal Government  that may be subject to Executive Order 13658 (Establishing a Minimum Wage for Contractors)?
     </answer-field>
 
-    <h2>Additional Questions</h2>
+    <h3>Additional Questions</h3>
     <hr>
 
     <answer-field answer="appData.employer.representativePayee">

DOL.WHD.Section14c.Web/src/modules/components/sectionAdminSummary/sectionAdminSummaryTemplate.html

@@ -1,6 +1,7 @@
 <div class="admin-page">
-
-    <h1>Summary</h1>
+    <div class="dol-form-section-title">
+        <h2>Summary</h2>
+    </div>
     <hr>
 
     <div class="answer-block">

DOL.WHD.Section14c.Web/src/modules/components/sectionAdminWageData/sectionAdminWageDataTemplate.html

@@ -1,6 +1,7 @@
 <div class="admin-page">
-    <h1>Wage Data</h1>
-    <hr>
+    <div class="dol-form-section-title">
+        <h2>Wage Data</h2>
+    </div>
 
     <answer-field answer="appData.payType.display">
         Pay Type

DOL.WHD.Section14c.Web/src/modules/components/sectionAdminWioa/sectionAdminWioaTemplate.html

@@ -1,6 +1,7 @@
 <div class="admin-page">
-
-    <h1>Workforce Innovation and Opportunity Act (WIOA)</h1>
+    <div class="dol-form-section-title">
+        <h2>Workforce Innovation and Opportunity Act (WIOA)</h2>
+    </div>
 
     <answer-field answer="appData.wioa.hasVerifiedDocumentation">
         Has the employer reviewed and verified documentation that counseling and referrals have been provided to each worker paid at a subminimum wage, regardless of age, and each has been informed of available training opportunities as required by WIOA?

DOL.WHD.Section14c.Web/src/modules/components/sectionAdminWorkSites/sectionAdminWorkSitesTemplate.html

@@ -1,6 +1,7 @@
 <div class="admin-page">
-    <h1>Work Sites &amp; Employees</h1>
-    <hr>
+    <div class="dol-form-section-title">
+        <h2>Worksites &amp; Employees</h2>
+    </div>
 
     <answer-field answer="$parent.appData.totalNumWorkSites">
         What is the total number of establishments and work sites to be covered by this certificate?

DOL.WHD.Section14c.Web/src/styles/admin.scss

@@ -2,6 +2,19 @@
 
     .admin-page {
         @include span(12);
+        padding-bottom: 7.55rem;
+
+        .usa-content {
+            p:not(.usa-font-lead), 
+            ul,
+            ol {
+                max-width: 60rem;
+            }
+        }
+
+        h3 {
+            font-size: 2.4rem;
+        }
 
         .admin-filter-bar {
             .admin-filter {
@@ -17,12 +30,6 @@
             margin: 2.5rem 0;
         }
 
-        .usa-content {
-            p {
-                max-width: none;
-            }
-        }
-
         .form-spaced-div {
             margin-top: 40px;
         }
@@ -109,3 +116,9 @@
     }
 
 }
+
+@media (min-width: 50rem) {
+    .admin-page {
+        padding-bottom: 15rem;
+    }
+}

DOL.WHD.Section14c.Web/src/styles/modules/answerFieldControl.scss

@@ -1,11 +1,13 @@
 .answer-block {
     margin-top: 30px;
+    max-width: 60rem;
 
     .answer-question {
         font-weight: 700;
+        font-size: 2rem;
 
         .subtext {
-            font-weight: 400;
+            //font-weight: 400;
         }
     }