From 17e9344f6e770e6e2f76f11e24b10e20c9a4d6a0 Mon Sep 17 00:00:00 2001
From: luis cielak <luis+dds@promptworks.com>
Date: Wed, 8 Aug 2018 13:46:48 -0400
Subject: [PATCH 1/8] Style form labels for inputs correctly

---
 styles/elements/_inputs.scss         | 22 +++++++++++++---------
 templates/components/text_input.html |  2 --
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/styles/elements/_inputs.scss b/styles/elements/_inputs.scss
index 459e907d..7ce1c714 100644
--- a/styles/elements/_inputs.scss
+++ b/styles/elements/_inputs.scss
@@ -65,20 +65,12 @@
   }
 
   label {
-    padding: 0 0 $gap 0;
+    padding: 0;
     margin: 0;
     @include h4;
     @include line-max;
     position: relative;
 
-    .usa-input__help {
-      display: block;
-      @include h5;
-      font-weight: normal;
-      padding-top: $gap / 2;
-      @include line-max;
-    }
-
     .icon {
       position: absolute;
       left: 100%;
@@ -88,6 +80,14 @@
     }
   }
 
+  .usa-input__help {
+    display: block;
+    @include h4;
+    font-weight: normal;
+    padding: $gap/2 0;
+    @include line-max;
+  }
+
   input,
   textarea,
   select {
@@ -103,6 +103,10 @@
       .icon {
         vertical-align: middle;
       }
+
+  .usa-input__help {
+    font-weight: $font-bold;
+  }
     }
 
     ul {
diff --git a/templates/components/text_input.html b/templates/components/text_input.html
index 0f50ca89..8145c366 100644
--- a/templates/components/text_input.html
+++ b/templates/components/text_input.html
@@ -1,6 +1,5 @@
 {% macro TextInput(field, placeholder='') -%}
   <div class='usa-input {% if errors %}usa-input--error{% endif %}'>
-    <label for={{field.name}}>
       {{ field.label }}
 
       {% if field.description %}
@@ -10,7 +9,6 @@
       {% if errors %}
         {{ Icon('alert') }}
       {% endif %}
-    </label>
 
     {{ field(placeholder=placeholder) | safe }}
 

From 41a6d28e8879720413615d6c923f03decfec9d5d Mon Sep 17 00:00:00 2001
From: luis cielak <luis+dds@promptworks.com>
Date: Wed, 8 Aug 2018 13:47:31 -0400
Subject: [PATCH 2/8] Add subtitle style

---
 styles/elements/_typography.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/styles/elements/_typography.scss b/styles/elements/_typography.scss
index fcdc97d9..b1af1be1 100644
--- a/styles/elements/_typography.scss
+++ b/styles/elements/_typography.scss
@@ -20,6 +20,7 @@ h1, h2, h3, h4, h5, h6 {
 
   + .subtitle * {
     margin-top: 0;
+    color: $color-gray;
   }
 
 }

From d582cf2a412365f81c740b38cd4c0957be17ef60 Mon Sep 17 00:00:00 2001
From: luis cielak <luis+dds@promptworks.com>
Date: Wed, 8 Aug 2018 13:50:48 -0400
Subject: [PATCH 3/8] Increase some padding

---
 styles/elements/_inputs.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/styles/elements/_inputs.scss b/styles/elements/_inputs.scss
index 7ce1c714..69750caf 100644
--- a/styles/elements/_inputs.scss
+++ b/styles/elements/_inputs.scss
@@ -65,7 +65,7 @@
   }
 
   label {
-    padding: 0;
+    padding: 0 0 $gap/2 0;
     margin: 0;
     @include h4;
     @include line-max;

From 74fc5f0ec91f9ff3daf4b87804af6efc35249385 Mon Sep 17 00:00:00 2001
From: luis cielak <luis+dds@promptworks.com>
Date: Wed, 8 Aug 2018 13:54:10 -0400
Subject: [PATCH 4/8] Make sure the label style for input text and radios match

---
 atst/forms/request.py        | 2 +-
 styles/elements/_inputs.scss | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/atst/forms/request.py b/atst/forms/request.py
index f15e9140..fb179587 100644
--- a/atst/forms/request.py
+++ b/atst/forms/request.py
@@ -62,7 +62,7 @@ class RequestForm(ValidatedForm):
     )
 
     engineering_assessment = RadioField(
-        description="Have you completed an engineering assessment of your software systems for cloud readiness?",
+        "Have you completed an engineering assessment of your software systems for cloud readiness?",
         choices=[("yes", "Yes"), ("no", "No"), ("in_progress", "In Progress")],
     )
 
diff --git a/styles/elements/_inputs.scss b/styles/elements/_inputs.scss
index 69750caf..e0cab5be 100644
--- a/styles/elements/_inputs.scss
+++ b/styles/elements/_inputs.scss
@@ -100,6 +100,10 @@
       padding: 0 0 $gap 0;
       @include h4;
 
+      label {
+        font-weight: $font-bold;
+      }
+
       .icon {
         vertical-align: middle;
       }

From 993a6635b2d4192aefd1ad1feac04f2dd4181fd8 Mon Sep 17 00:00:00 2001
From: luis cielak <luis+dds@promptworks.com>
Date: Wed, 8 Aug 2018 17:39:03 -0400
Subject: [PATCH 5/8] Render error validation message with proper color

---
 templates/components/options_input.html | 2 +-
 templates/components/text_input.html    | 2 ++
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/templates/components/options_input.html b/templates/components/options_input.html
index ff0d8814..06f4c3db 100644
--- a/templates/components/options_input.html
+++ b/templates/components/options_input.html
@@ -1,7 +1,7 @@
 {% from "components/icon.html" import Icon %}
 
 {% macro OptionsInput(field, inline=False) -%}
-  <div class='usa-input {% if errors %}usa-input--error{% endif %}'>
+  <div class='usa-input {% if field.errors %}usa-input--error{% endif %}'>
 
     <fieldset class="usa-input__choices {% if inline %}usa-input__choices--inline{% endif %}">
       <legend>
diff --git a/templates/components/text_input.html b/templates/components/text_input.html
index 8145c366..0f50ca89 100644
--- a/templates/components/text_input.html
+++ b/templates/components/text_input.html
@@ -1,5 +1,6 @@
 {% macro TextInput(field, placeholder='') -%}
   <div class='usa-input {% if errors %}usa-input--error{% endif %}'>
+    <label for={{field.name}}>
       {{ field.label }}
 
       {% if field.description %}
@@ -9,6 +10,7 @@
       {% if errors %}
         {{ Icon('alert') }}
       {% endif %}
+    </label>
 
     {{ field(placeholder=placeholder) | safe }}
 

From 5b102651268c8c131efd2fe59c9d3134fb71e4c0 Mon Sep 17 00:00:00 2001
From: luis cielak <luis+dds@promptworks.com>
Date: Wed, 8 Aug 2018 17:44:37 -0400
Subject: [PATCH 6/8] Render error message with proper color for input text

---
 templates/components/text_input.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/components/text_input.html b/templates/components/text_input.html
index 0f50ca89..1f272934 100644
--- a/templates/components/text_input.html
+++ b/templates/components/text_input.html
@@ -1,5 +1,5 @@
 {% macro TextInput(field, placeholder='') -%}
-  <div class='usa-input {% if errors %}usa-input--error{% endif %}'>
+  <div class='usa-input {% if field.errors %}usa-input--error{% endif %}'>
     <label for={{field.name}}>
       {{ field.label }}
 

From cd3cb4f359844ac0cb9eb52949c5fd586e79389c Mon Sep 17 00:00:00 2001
From: luis cielak <luis+dds@promptworks.com>
Date: Wed, 8 Aug 2018 23:34:26 -0400
Subject: [PATCH 7/8] Place error icon next to text input box

---
 templates/components/text_input.html | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/templates/components/text_input.html b/templates/components/text_input.html
index 1f272934..80c24ec2 100644
--- a/templates/components/text_input.html
+++ b/templates/components/text_input.html
@@ -1,3 +1,5 @@
+{% from "components/icon.html" import Icon %}
+
 {% macro TextInput(field, placeholder='') -%}
   <div class='usa-input {% if field.errors %}usa-input--error{% endif %}'>
     <label for={{field.name}}>
@@ -7,9 +9,7 @@
         <span class='usa-input__help'>{{ field.description | safe }}</span>
       {% endif %}
 
-      {% if errors %}
-        {{ Icon('alert') }}
-      {% endif %}
+      {% if field.errors %}{{ Icon('alert') }}{% endif %}
     </label>
 
     {{ field(placeholder=placeholder) | safe }}
@@ -20,4 +20,4 @@
       {% endfor %}
     {% endif %}
   </div>
-{%- endmacro %}
+{%- endmacro %}
\ No newline at end of file

From fe36604685f58b665b3d39c773a94fe52abe7452 Mon Sep 17 00:00:00 2001
From: luis cielak <luis+dds@promptworks.com>
Date: Thu, 9 Aug 2018 10:28:23 -0400
Subject: [PATCH 8/8] Strip out html to remove markup label

---
 styles/elements/_inputs.scss            | 3 ---
 templates/components/options_input.html | 5 ++++-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/styles/elements/_inputs.scss b/styles/elements/_inputs.scss
index e0cab5be..eff35e34 100644
--- a/styles/elements/_inputs.scss
+++ b/styles/elements/_inputs.scss
@@ -108,9 +108,6 @@
         vertical-align: middle;
       }
 
-  .usa-input__help {
-    font-weight: $font-bold;
-  }
     }
 
     ul {
diff --git a/templates/components/options_input.html b/templates/components/options_input.html
index 06f4c3db..dbd01947 100644
--- a/templates/components/options_input.html
+++ b/templates/components/options_input.html
@@ -5,7 +5,7 @@
 
     <fieldset class="usa-input__choices {% if inline %}usa-input__choices--inline{% endif %}">
       <legend>
-        {{ field.label }}
+        {{ field.label | striptags}}
 
         {% if field.description %}
           <span class='usa-input__help'>{{ field.description | safe }}</span>
@@ -26,4 +26,7 @@
 
     </fieldset>
   </div>
+
+
+
 {%- endmacro %}