Merge pull request #561 from dod-ccpo/to-form-fixes

TO Form fixes

atst/forms/data.py

@@ -3,7 +3,7 @@ from atst.utils.localization import translate, translate_duration
 
 
 SERVICE_BRANCHES = [
-    ("", "Select an option"),
+    ("", "- Select -"),
     ("Air Force, Department of the", "Air Force, Department of the"),
     ("Army and Air Force Exchange Service", "Army and Air Force Exchange Service"),
     ("Army, Department of the", "Army, Department of the"),

atst/routes/task_orders/new.py

@@ -39,7 +39,7 @@ TASK_ORDER_SECTIONS = [
     },
     {
         "section": "review",
-        "title": "Review & Download",
+        "title": "Review",
         "template": "task_orders/new/review.html",
         "form": task_order_form.ReviewForm,
     },

styles/sections/_task_order.scss

@@ -191,10 +191,6 @@
     &.inactive {
       color: $color-gray-light;
     }
-
-    &.subheading {
-      color: $color-gray;
-    }
   }
 
   .funding-summary__table {
@@ -219,4 +215,35 @@
       font-weight: $font-bold;
     }
   }
+
+  .usa-input__title {
+    color: $color-gray;
+  }
+
+  .subheading, .description {
+    color: $color-gray;
+  }
+
+  .subheading--black {
+    .usa-input__title {
+      color: $color-black;
+    }
+  }
+
+  .usa-input {
+    &.normal {
+      label {
+        font-weight: 400;
+      }
+    }
+  }
+
+  .alert {
+    padding: 1.5rem;
+
+    .usa-input {
+      width: 100%;
+      margin: 0;
+    }
+  }
 }

templates/components/checkbox_input.html

@@ -1,7 +1,7 @@
 
-{% macro CheckboxInput(field, inline=False) -%}
+{% macro CheckboxInput(field, inline=False, classes="") -%}
   <checkboxinput name='{{ field.name }}' inline-template key='{{ field.name }}'>
-    <div class='usa-input {% if field.errors %}usa-input--error{% endif %}'>
+    <div class='usa-input {{ classes }} {% if field.errors %}usa-input--error{% endif %}'>
 
       <fieldset v-on:change="onInput" class="usa-input__choices {% if inline %}usa-input__choices--inline{% endif %}">
         <legend>

templates/task_orders/new/app_info.html

@@ -16,7 +16,9 @@
 {{ TextInput(form.portfolio_name, placeholder="The name of your office or organization") }}
 {{ TextInput(form.scope, paragraph=True) }}
 <p><i>{{ "task_orders.new.app_info.sample_scope" | translate | safe }}</i></p>
-{{ OptionsInput(form.defense_component) }}
+<div class="subheading--black">
+  {{ OptionsInput(form.defense_component) }}
+</div>
 
 <hr>
 

templates/task_orders/new/funding.html

@@ -29,7 +29,9 @@
     </a></p>
     <p>{{ "task_orders.new.funding.estimate_usage_paragraph" | translate }}</p>
     <div class="usa-input">
-      {{ form.pdf.label }}
+      <div class="usa-input__title">
+        {{ form.pdf.label }}
+      </div>
       {{ form.pdf.description }}
       <input type="file" disabled="disabled" />
     </div>
@@ -39,12 +41,12 @@
     <h3 class="subheading">{{ "task_orders.new.funding.cloud_calculations_title" | translate }}</h3>
     <p>{{ "task_orders.new.funding.cloud_calculations_paragraph" | translate }}</p>
 
-    <h4 class="task-order-form__heading">{{ "task_orders.new.funding.cloud_offerings_title" | translate }}</h4>
+    <h4 class="task-order-form__heading subheading">{{ "task_orders.new.funding.cloud_offerings_title" | translate }}</h4>
     <p>{{ "task_orders.new.funding.cloud_offerings_paragraph" | translate }}</p>
     {{ TextInput(form.clin_01, validation='dollars', placeholder="$0.00") }}
     {{ TextInput(form.clin_02, validation='dollars', disabled=(not config.CLASSIFIED)) }}
 
-    <h4 class="task-order-form__heading">{{ "task_orders.new.funding.support_assistance_title" | translate }}</h4>
+    <h4 class="task-order-form__heading subheading">{{ "task_orders.new.funding.support_assistance_title" | translate }}</h4>
     <p>{{ "task_orders.new.funding.support_assistance_paragraph" | translate }}</p>
     {{ TextInput(form.clin_03, validation='dollars', tooltip='The cloud support and assistance packages cannot be used as a primary development resource.', placeholder="$0.00") }}
     {{ TextInput(form.clin_04, validation='dollars', tooltip='The cloud support and assistance packages cannot be used as a primary development resource.', disabled=(not config.CLASSIFIED)) }}

templates/task_orders/new/oversight.html

@@ -25,7 +25,7 @@
 
         <h3 class="subheading">{{ "task_orders.new.oversight.cor_info_title" | translate }}</h3>
         <p>{{ "task_orders.new.oversight.cor_info_paragraph" | translate }}</p>
-        {{ CheckboxInput(form.am_cor) }}
+        {{ CheckboxInput(form.am_cor, classes="normal") }}
         <template v-if="!am_cor">
             {{ UserInfo(form.cor_first_name, form.cor_last_name, form.cor_email, form.cor_phone_number) }}
             {{ CheckboxInput(form.cor_invite) }}

translations.yaml

@@ -200,7 +200,7 @@ forms:
       government_civilians: Government Civilians
       military: Military
       contractor: Contractor
-      other: "Other <em>(E.g. University or other partner)</em>"
+      other: "Other <em class='description'>(E.g. University or other partner)</em>"
     dev_team_other_label: Development Team Other
     team_experience:
       label: Team Experience
@@ -393,7 +393,7 @@ task_orders:
       performance_period_description: Choose the length of time your task order will cover.
       performance_period_paragraph: Because your funds will be lost if you don’t use them, we strongly recommend submitting small, short-duration task orders, usually a three month period. We’ll notify you when your period of performance is nearing the end so you can request your next set of funds with a new task order.
       estimate_usage_title: Estimate Your Cloud Usage
-      estimate_usage_description: Calculate how much your cloud usage will cost. A technical representative should help you complete this calculation. These calculations will become your CLINs.
+      estimate_usage_description: Calculate how much your cloud usage will cost. A technical representative from your team should help you complete this calculation. These calculations will become your CLINs.
       estimate_usage_paragraph: This is only an estimation tool to help you make an informed evaluation of what you expect to use. While you're tied to the dollar amount you specify in your task order, you're not obligated by the resources you indicate in the calculator.
       cloud_calculations_title: Cloud Usage Calculations
       cloud_calculations_paragraph: Enter the results of your cloud usage calculations.
@@ -408,7 +408,7 @@ task_orders:
       ko_info_paragraph: Your KO will need to approve funding for this Task Order by logging into the JEDI Cloud Portal, submitting the Task Order documents within their official system of record, and electronically signing. You might want to work with your program Financial Manager to get your TO documents moving in the right dirction.
       skip_ko_label: "Skip for now (We'll remind you to enter one later)"
       cor_info_title: Contracting Officer Representative (COR) Information
-      cor_info_paragraph: Your COR may assist in submitting the Task Order documents within thier official system of record. They may also be invited to log in an manage the Task Order entry within the JEDI Cloud portal.
+      cor_info_paragraph: Your COR may assist in submitting the Task Order documents within thier official system of record. They may also be invited to log in and manage the Task Order entry within the JEDI Cloud portal.
       so_info_title: Security Officer Information
       so_info_paragraph: Your Security Officer will need to answer some security configuration questions in order to generate a DD-254 document, then electronically sign.
     review: