Files
notifications-admin/app/templates/views/agreement/agreement-accept.html
Chris Hill-Scott b4c81f8960 Add progressive enhancement
When someone selects that they are accepting the agreement on behalf of
someone else then they need to provide that person’s details. Otherwise
they shouldn’t care about these extra fields.

This commit uses the progressive disclosure pattern from the GOV.UK
Frontend Toolkit to hide the additional fields unless someone selects
the relevant radio button.
2019-06-19 13:19:51 +01:00

43 lines
1.4 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{% extends "withnav_template.html" %}
{% from "components/textbox.html" import textbox %}
{% from "components/radios.html" import radio %}
{% from "components/select-input.html" import select_wrapper %}
{% from "components/form.html" import form_wrapper %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/page-header.html" import page_header %}
{% block per_page_title %}
Accept data sharing and financial agreement
{% endblock %}
{% block maincolumn_content %}
<div class="grid-row">
<div class="column-five-sixths">
{{ page_header(
'Accept data sharing and financial agreement',
back_link=url_for('main.service_agreement', service_id=current_service.id)
) }}
{% call form_wrapper(class='top-gutter') %}
{{ textbox(form.version, width='1-3', hint='The version number is on the front page, for example 3.6') }}
{% call select_wrapper(form.who) %}
{% for option in form.who %}
{{ radio(option, data_target='on-behalf-of' if option.data == 'someone-else' else None) }}
{% endfor %}
{% endcall %}
<div class="conditional-radio-panel js-hidden" id="on-behalf-of">
{{ textbox(form.on_behalf_of_name, width='1-1') }}
{{ textbox(form.on_behalf_of_email, width='1-1') }}
</div>
{{ page_footer('Continue') }}
{% endcall %}
</div>
</div>
{% endblock %}