diff --git a/atst/forms/application_member.py b/atst/forms/application_member.py index 7839f1c8..1eaa4e06 100644 --- a/atst/forms/application_member.py +++ b/atst/forms/application_member.py @@ -29,13 +29,25 @@ class EnvironmentForm(FlaskForm): class PermissionsForm(FlaskForm): perms_env_mgmt = BooleanField( - translate("portfolios.applications.members.new.manage_envs"), default=False + translate("portfolios.applications.members.form.env_mgmt.label"), + default=False, + description=translate( + "portfolios.applications.members.form.env_mgmt.description" + ), ) perms_team_mgmt = BooleanField( - translate("portfolios.applications.members.new.manage_team"), default=False + translate("portfolios.applications.members.form.team_mgmt.label"), + default=False, + description=translate( + "portfolios.applications.members.form.team_mgmt.description" + ), ) perms_del_env = BooleanField( - translate("portfolios.applications.members.new.delete_envs"), default=False + translate("portfolios.applications.members.form.del_env.label"), + default=False, + description=translate( + "portfolios.applications.members.form.del_env.description" + ), ) @property diff --git a/js/components/checkbox_input.js b/js/components/checkbox_input.js index 9236caf8..32fd3337 100644 --- a/js/components/checkbox_input.js +++ b/js/components/checkbox_input.js @@ -1,13 +1,8 @@ import { emitEvent } from '../lib/emitters' -import nestedcheckboxinput from './nested_checkbox_input' export default { name: 'checkboxinput', - components: { - nestedcheckboxinput, - }, - props: { name: String, initialChecked: Boolean, diff --git a/js/components/nested_checkbox_input.js b/js/components/nested_checkbox_input.js deleted file mode 100644 index ebe8553c..00000000 --- a/js/components/nested_checkbox_input.js +++ /dev/null @@ -1,31 +0,0 @@ -import { emitEvent } from '../lib/emitters' - -export default { - name: 'nestedcheckboxinput', - - props: { - name: String, - isParentChecked: Boolean, - }, - - data: function() { - return { - isChecked: false, - } - }, - - updated: function() { - if (!this.isParentChecked) { - this.isChecked = false - } - }, - - methods: { - onInput: function(e) { - emitEvent('field-change', this, { - value: e.target.checked, - name: this.name, - }) - }, - }, -} diff --git a/js/index.js b/js/index.js index 5bb1a924..e1197b46 100644 --- a/js/index.js +++ b/js/index.js @@ -13,7 +13,6 @@ import optionsinput from './components/options_input' import multicheckboxinput from './components/multi_checkbox_input' import textinput from './components/text_input' import checkboxinput from './components/checkbox_input' -import nestedcheckboxinput from './components/nested_checkbox_input' import EditOfficerForm from './components/forms/edit_officer_form' import poc from './components/forms/poc' import oversight from './components/forms/oversight' @@ -78,7 +77,6 @@ const app = new Vue({ SidenavToggler, BaseForm, DeleteConfirmation, - nestedcheckboxinput, NewEnvironment, EnvironmentRole, SemiCollapsibleText, diff --git a/styles/sections/_application_edit.scss b/styles/sections/_application_edit.scss index 65ff8e6c..c011e361 100644 --- a/styles/sections/_application_edit.scss +++ b/styles/sections/_application_edit.scss @@ -35,6 +35,24 @@ text-align: left; } + .input__inline-fields { + padding: $gap * 2; + border: 1px solid $color-gray-lighter; + + &.checked { + border: 1px solid $color-blue; + } + + label { + font-weight: $font-bold; + } + + p.usa-input__help { + margin-bottom: 0; + padding-left: 3rem; + } + } + .form-row { margin-top: 0; @@ -58,6 +76,11 @@ } } } + + hr { + border: none; + border-bottom: 1px solid $color-gray-lighter; + } } .environment-roles { @@ -69,12 +92,11 @@ text-align: left; .usa-input { - margin: 2rem 0 2rem 0; + margin: $gap 0 $gap 0; .usa-input__title-inline { - line-height: $hit-area; - font-size: $lead-font-size; - padding: 0; + margin-top: $gap; + margin-left: $gap; } } diff --git a/templates/components/checkbox_input.html b/templates/components/checkbox_input.html index e573c4cd..4e527114 100644 --- a/templates/components/checkbox_input.html +++ b/templates/components/checkbox_input.html @@ -10,7 +10,7 @@ v-bind:initial-checked='{{ field.data|string|lower }}' >
-
+
@@ -25,9 +25,6 @@
- {% if caller %} - {{ caller() }} - {% endif %}
{%- endmacro %} diff --git a/templates/fragments/applications/new_member_modal_content.html b/templates/fragments/applications/new_member_modal_content.html index 92f34dcf..9d32984e 100644 --- a/templates/fragments/applications/new_member_modal_content.html +++ b/templates/fragments/applications/new_member_modal_content.html @@ -3,121 +3,100 @@ {% from "components/checkbox_input.html" import CheckboxInput %} {% from "components/phone_input.html" import PhoneInput %} -{% macro MemberStepOne(new_member_form) %} +{% macro MemberFormTemplate(title, next_button, previous=True) %} -
- {{ TextInput(new_member_form.user_data.first_name, validation='requiredField', optional=False) }} -
-
- {{ TextInput(new_member_form.user_data.last_name, validation='requiredField', optional=False) }} -
-
- {{ TextInput(new_member_form.user_data.email, validation='email', optional=False) }} -
-
- {{ PhoneInput(new_member_form.user_data.phone_number, new_member_form.user_data.phone_ext)}} -
-
- {{ TextInput(new_member_form.user_data.dod_id, validation='dodId', optional=False) }} -
+ + {{ caller() }} +
+ {{ next_button }} + {% if previous %} + + {% endif %} + {{ "common.cancel" | translate }} +
+{% endmacro %} + +{% macro MemberStepOne(new_member_form) %} + {% set next_button %} - {{ "common.cancel" | translate }} -
+ value='{{ "portfolios.applications.members.form.next_button" | translate }}'> + {% endset %} + + {% call MemberFormTemplate(title="portfolios.applications.members.form.add_member"|translate, next_button=next_button, previous=False) %} +
+ {{ TextInput(new_member_form.user_data.first_name, validation='requiredField', optional=False) }} +
+
+ {{ TextInput(new_member_form.user_data.last_name, validation='requiredField', optional=False) }} +
+
+ {{ TextInput(new_member_form.user_data.email, validation='email', optional=False) }} +
+
+ {{ PhoneInput(new_member_form.user_data.phone_number, new_member_form.user_data.phone_ext)}} +
+
+ {{ TextInput(new_member_form.user_data.dod_id, validation='dodId', optional=False) }} +
+ {% endcall %} {% endmacro %} {% macro MemberStepTwo(new_member_form, application) %} -