diff --git a/styles/elements/_inputs.scss b/styles/elements/_inputs.scss index eeef4cc8..47cc4f3c 100644 --- a/styles/elements/_inputs.scss +++ b/styles/elements/_inputs.scss @@ -57,13 +57,9 @@ } .usa-input { - margin: ($gap * 4) ($gap * 2) ($gap * 4) 0; + margin: ($gap * 2) 0; max-width: 75rem; - @include media($medium-screen) { - margin: ($gap * 4) 0; - } - label { padding: 0 0 ($gap / 2) 0; margin: 0; @@ -363,6 +359,8 @@ select { margin-right: $gap * 4; .usa-input { + margin: 0; + input, label, .usa-input__message { @@ -379,6 +377,8 @@ select { margin-left: $gap * 4; .usa-input { + margin: 0; + input { max-width: 12rem; } diff --git a/styles/sections/_application_edit.scss b/styles/sections/_application_edit.scss index 1d6de7fd..e53ed262 100644 --- a/styles/sections/_application_edit.scss +++ b/styles/sections/_application_edit.scss @@ -18,7 +18,6 @@ } .usa-input { - margin: 0 ($gap * 4) 0 0; flex-grow: 2; } } @@ -58,11 +57,8 @@ } } - .form-row { - margin-top: 0; - + .application-member__user-info { .usa-input { - margin: 0; width: 45rem; input, diff --git a/templates/applications/fragments/member_form_fields.html b/templates/applications/fragments/member_form_fields.html index 96c6966b..759c8428 100644 --- a/templates/applications/fragments/member_form_fields.html +++ b/templates/applications/fragments/member_form_fields.html @@ -52,20 +52,13 @@ {% endmacro %} {% macro InfoFields(member_form) %} -
- {{ TextInput(member_form.first_name, validation='requiredField', optional=False) }} -
-
- {{ TextInput(member_form.last_name, validation='requiredField', optional=False) }} -
-
- {{ TextInput(member_form.email, validation='email', optional=False) }} -
-
- {{ PhoneInput(member_form.phone_number, member_form.phone_ext)}} -
-
- {{ TextInput(member_form.dod_id, validation='dodId', optional=False) }} +
+
+ {{ TextInput(member_form.first_name, validation='requiredField', optional=False) }} + {{ TextInput(member_form.last_name, validation='requiredField', optional=False) }} + {{ TextInput(member_form.email, validation='email', optional=False) }} + {{ PhoneInput(member_form.phone_number, member_form.phone_ext)}} + {{ TextInput(member_form.dod_id, validation='dodId', optional=False) }} How do I find the DoD ID? {% endmacro %} diff --git a/templates/components/phone_input.html b/templates/components/phone_input.html index 74200436..0aae1401 100644 --- a/templates/components/phone_input.html +++ b/templates/components/phone_input.html @@ -1,7 +1,7 @@ {% from "components/text_input.html" import TextInput %} {% macro PhoneInput(phone_number, phone_ext, placeholder_phone="", phone_optional=True, extension_optional=True) %} -
+
{{ TextInput(phone_number, placeholder=placeholder_phone, validation='usPhone', optional=phone_optional) }}
diff --git a/translations.yaml b/translations.yaml index f1a95729..8b91d15a 100644 --- a/translations.yaml +++ b/translations.yaml @@ -314,7 +314,7 @@ portfolios: step_1_button_text: "Save and Add Environments" step_1_form_help_text: name: | -
+

The name of your application should be intuitive and easily recognizable for all of your team members.

@@ -326,7 +326,7 @@ portfolios:

description: | -
+

Add a brief one to two sentence description of your application. You should be able to reference your TO Description of Work.