Set max width on p elements and add in p tags where they were missing

templates/components/alert.html

@@ -31,7 +31,9 @@
       {% endif %}
 
       {% if message %}
-        <div class='usa-alert-text'>{{ message | safe }}</div>
+        <p class='usa-alert-text'>
+          {{ message | safe }}
+        </p>
       {% endif %}
 
       {% if caller %}

templates/components/checkbox_input.html

@@ -18,7 +18,9 @@
             {{ label | safe }}
 
             {% if field.description %}
-            <span class='usa-input__help'>{{ field.description | safe }}</span>
+              <p class='usa-input__help'>
+                {{ field.description | safe }}
+              </p>
             {% endif %}
           </legend>
         </fieldset>

templates/components/date_picker.html

@@ -27,7 +27,9 @@
         </div>
 
         {% if description %}
-          <span class='usa-input__help'>{{ description | safe }}</span>
+          <p class='usa-input__help'>
+            {{ description | safe }}
+          </p>
         {% endif %}
       </legend>
 

templates/components/multi_checkbox_input.html

@@ -31,7 +31,9 @@
           </div>
 
           {% if field.description %}
-            <span class='usa-input__help'>{{ field.description | safe }}</span>
+            <p class='usa-input__help'>
+              {{ field.description | safe }}
+            </p>
             {{ validation_icons }}
           {% endif %}
         </legend>

templates/components/options_input.html

@@ -24,7 +24,9 @@
             </div>
 
             {% if field.description %}
-              <span class='usa-input__help'>{{ field.description | safe }}</span>
+              <p class='usa-input__help'>
+                {{ field.description | safe }}
+              </p>
             {% endif %}
 
             {% if show_validation %}

templates/components/selector.html

@@ -16,7 +16,9 @@
         <div class="usa-input__title">{{ field.label | striptags }}</div>
 
         {% if field.description %}
-          <span class='usa-input__help'>{{ field.description | safe }}</span>
+          <p class='usa-input__help'>
+            {{ field.description | safe }}
+          </p>
         {% endif %}
 
         <span v-show='showError'>{{ Icon('alert',classes="icon-validation") }}</span>

templates/components/text_input.html

@@ -48,7 +48,9 @@
           </div>
 
           {% if field.description %}
-            <span class='usa-input__help'>{{ description | safe }}</span>
+            <p class='usa-input__help'>
+              {{ description | safe }}
+            </p>
           {% endif %}
 
           {% if not disabled %}

templates/components/totals_box.html

@@ -8,13 +8,13 @@
 
     <div class="h4">{{ 'components.totals_box.obligated_funds' | translate }}</div>
     <div class="h3">{{ obligated_funds | dollars }}</div>
-    <div>{{ 'components.totals_box.obligated_text' | translate }}</div>
+    <p>{{ 'components.totals_box.obligated_text' | translate }}</p>
 
     <hr>
 
     <div class="h4">{{ 'components.totals_box.total_amount' | translate }}</div>
     <div class="h3">{{ contract_amount | dollars }}</div>
-    <div>{{ 'components.totals_box.total_text' | translate }}</div>
+    <p>{{ 'components.totals_box.total_text' | translate }}</p>
 
   </div>
 

templates/components/upload_input.html

@@ -23,7 +23,9 @@
       {% if show_label %}
         {{ field.label }}
       {% endif %}
-      {{ field.description }}
+      <p>
+        {{ field.description }}
+      </p>
       <div v-if="!hideInput" class="upload-widget">
         <label class="upload-label" for="{{ field.name }}">
           <span class="upload-button">