Low-fi update of multi-step modals to fix styling

This commit is contained in:
leigh-mil
2019-10-02 14:47:41 -04:00
parent 7a4c26419f
commit fe29b5d838
7 changed files with 51 additions and 56 deletions

View File

@@ -16,9 +16,8 @@
{% endmacro %}
{% set step_one %}
<div class="modal__form--header">
<h1>Invite new portfolio member</h1>
</div>
<hr>
<h1>Invite new portfolio member</h1>
<div class='form-row'>
<div class='form-col form-col--half'>
{{ TextInput(member_form.user_data.first_name, validation='requiredField', optional=False) }}
@@ -47,32 +46,29 @@
type='button'
v-on:click="next()"
v-bind:disabled="invalid"
class='action-group__action usa-button'
class='action-group__action usa-button usa-button-primary'
value='Next'>
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">Cancel</a>
</div>
{% endset %}
{% set step_two %}
<div class="modal__form--padded">
<div class="modal__form--header">
<h1>Assign member permissions</h1>
<a class='icon-link'>
{{ Icon('info') }}
{{ "portfolios.admin.permissions_info" | translate }}
</a>
</div>
{{ SimpleOptionsInput(member_form.permission_sets.perms_app_mgmt) }}
{{ SimpleOptionsInput(member_form.permission_sets.perms_funding) }}
{{ SimpleOptionsInput(member_form.permission_sets.perms_reporting) }}
{{ SimpleOptionsInput(member_form.permission_sets.perms_portfolio_mgmt) }}
<div class='action-group'>
<input
type="submit"
class='action-group__action usa-button'
form="add-port-mem"
value='Invite member'>
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">Cancel</a>
</div>
<hr>
<h1>Assign member permissions</h1>
<a class='icon-link'>
{{ Icon('info') }}
{{ "portfolios.admin.permissions_info" | translate }}
</a>
{{ SimpleOptionsInput(member_form.permission_sets.perms_app_mgmt) }}
{{ SimpleOptionsInput(member_form.permission_sets.perms_funding) }}
{{ SimpleOptionsInput(member_form.permission_sets.perms_reporting) }}
{{ SimpleOptionsInput(member_form.permission_sets.perms_portfolio_mgmt) }}
<div class='action-group'>
<input
type="submit"
class='action-group__action usa-button usa-button-primary'
form="add-port-mem"
value='Invite member'>
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">Cancel</a>
</div>
{% endset %}
{{ MultiStepModalForm(

View File

@@ -6,9 +6,8 @@
{% from "components/options_input.html" import OptionsInput %}
{% set step_one %}
<div class="modal__form--header">
<h1>{{ "fragments.ppoc.update_ppoc_title" | translate }}</h1>
</div>
<hr>
<h1>{{ "fragments.ppoc.update_ppoc_title" | translate }}</h1>
{{
Alert(
@@ -43,28 +42,25 @@
{% endset %}
{% set step_two %}
<div class="modal__form--padded">
<div class="modal__form--header">
<h1>{{ "fragments.ppoc.update_ppoc_confirmation_title" | translate }}</h1>
</div>
<hr>
<h1>{{ "fragments.ppoc.update_ppoc_confirmation_title" | translate }}</h1>
{{
Alert(
level="info",
title=("fragments.ppoc.confirm_alert.title" | translate),
)
}}
{{
Alert(
level="info",
title=("fragments.ppoc.confirm_alert.title" | translate),
)
}}
<div class='action-group'>
<input
type="submit"
class='action-group__action usa-button'
form="change-ppoc-form"
value='{{ "common.confirm" | translate }}'>
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('change-ppoc-form')">
{{ "common.cancel" | translate }}
</a>
</div>
<div class='action-group'>
<input
type="submit"
class='action-group__action usa-button'
form="change-ppoc-form"
value='{{ "common.confirm" | translate }}'>
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('change-ppoc-form')">
{{ "common.cancel" | translate }}
</a>
</div>
{% endset %}