Merge pull request #683 from cisagov/ik/overview-styling

Update styles on Domain overview page
This commit is contained in:
Igor Korenfeld 2023-06-05 16:30:13 -04:00 committed by GitHub
commit d4162c5d9c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 96 additions and 73 deletions

View file

@ -4,11 +4,11 @@
{% load static url_helpers %} {% load static url_helpers %}
{% block content %} {% block content %}
<main id="main-content" class="grid-container register-form-step"> <main id="main-content" class="grid-container">
<div class="grid-col desktop:grid-offset-2 desktop:grid-col-8"> <div class="grid-col desktop:grid-offset-2 desktop:grid-col-8">
<h1>Domain request for {{ domainapplication.requested_domain.name }}</h1> <h1>Domain request for {{ domainapplication.requested_domain.name }}</h1>
<div <div
class="usa-summary-box dotgov-status-box margin-top-3" class="usa-summary-box dotgov-status-box margin-top-3 padding-left-2"
role="region" role="region"
aria-labelledby="summary-box-key-information" aria-labelledby="summary-box-key-information"
> >
@ -38,11 +38,11 @@
<div class="grid-col desktop:grid-offset-2 maxw-tablet"> <div class="grid-col desktop:grid-offset-2 maxw-tablet">
<h2 class="text-primary-darker"> Summary of your domain request </h2> <h2 class="text-primary-darker"> Summary of your domain request </h2>
{% with heading_level='h3' %}
{% include "includes/summary_item.html" with title='Type of organization' value=domainapplication.get_organization_type_display %} {% include "includes/summary_item.html" with title='Type of organization' value=domainapplication.get_organization_type_display heading_level=heading_level %}
{% if domainapplication.tribe_name %} {% if domainapplication.tribe_name %}
{% include "includes/summary_item.html" with title='Tribal government' value=domainapplication.tribe_name %} {% include "includes/summary_item.html" with title='Tribal government' value=domainapplication.tribe_name heading_level=heading_level %}
{% if domainapplication.federally_recognized_tribe %} {% if domainapplication.federally_recognized_tribe %}
<p>Federally-recognized tribe</p> <p>Federally-recognized tribe</p>
@ -55,44 +55,46 @@
{% endif %} {% endif %}
{% if domainapplication.get_federal_type_display %} {% if domainapplication.get_federal_type_display %}
{% include "includes/summary_item.html" with title='Federal government branch' value=domainapplication.get_federal_type_display %} {% include "includes/summary_item.html" with title='Federal government branch' value=domainapplication.get_federal_type_display heading_level=heading_level %}
{% endif %} {% endif %}
{% if domainapplication.is_election_board %} {% if domainapplication.is_election_board %}
{% include "includes/summary_item.html" with title='Election office' value=domainapplication.is_election_board %} {% include "includes/summary_item.html" with title='Election office' value=domainapplication.is_election_board heading_level=heading_level %}
{% endif %} {% endif %}
{% if domainapplication.organization_name %} {% if domainapplication.organization_name %}
{% include "includes/summary_item.html" with title='Organization name and mailing address' value=domainapplication address='true' %} {% include "includes/summary_item.html" with title='Organization name and mailing address' value=domainapplication address='true' heading_level=heading_level %}
{% endif %} {% endif %}
{% if domainapplication.type_of_work %} {% if domainapplication.type_of_work %}
{% include "includes/summary_item.html" with title='Type of work' value=domainapplication.type_of_work %} {% include "includes/summary_item.html" with title='Type of work' value=domainapplication.type_of_work heading_level=heading_level %}
{% endif %} {% endif %}
{% if domainapplication.more_organization_information %} {% if domainapplication.more_organization_information %}
{% include "includes/summary_item.html" with title='More information about your organization' value=domainapplication.more_organization_information %} {% include "includes/summary_item.html" with title='More information about your organization' value=domainapplication.more_organization_information heading_level=heading_level %}
{% endif %} {% endif %}
{% if domainapplication.authorizing_official %} {% if domainapplication.authorizing_official %}
{% include "includes/summary_item.html" with title='Authorizing official' value=domainapplication.authorizing_official contact='true' %} {% include "includes/summary_item.html" with title='Authorizing official' value=domainapplication.authorizing_official contact='true' heading_level=heading_level %}
{% endif %} {% endif %}
{% if domainapplication.current_websites.all %} {% if domainapplication.current_websites.all %}
{% include "includes/summary_item.html" with title='Current website for your organization' value=domainapplication.current_websites.all list='true' %} {% include "includes/summary_item.html" with title='Current website for your organization' value=domainapplication.current_websites.all list='true' heading_level=heading_level %}
{% endif %} {% endif %}
{% if domainapplication.purpose %} {% if domainapplication.purpose %}
{% include "includes/summary_item.html" with title='Purpose of your domain' value=domainapplication.purpose %} {% include "includes/summary_item.html" with title='Purpose of your domain' value=domainapplication.purpose heading_level=heading_level %}
{% endif %} {% endif %}
{% if domainapplication.submitter %} {% if domainapplication.submitter %}
{% include "includes/summary_item.html" with title='Your contact information' value=domainapplication.submitter contact='true'%} {% include "includes/summary_item.html" with title='Your contact information' value=domainapplication.submitter contact='true' heading_level=heading_level %}
{% endif %} {% endif %}
{% include "includes/summary_item.html" with title='Other employees from your organization' value=domainapplication.other_contacts.all contact='true' list='true' %} {% include "includes/summary_item.html" with title='Other employees from your organization' value=domainapplication.other_contacts.all contact='true' list='true' heading_level=heading_level %}
{% include "includes/summary_item.html" with title='Anything else we should know' value=domainapplication.anything_else|default:"No" %}
{% include "includes/summary_item.html" with title='Anything else we should know' value=domainapplication.anything_else|default:"No" heading_level=heading_level %}
{% endwith %}
</div> </div>
</main> </main>

View file

@ -2,12 +2,25 @@
<section class="summary-item margin-top-3"> <section class="summary-item margin-top-3">
<hr class="" aria-hidden="true" /> <hr class="" aria-hidden="true" />
<h2 class="summary-item__title <div class="display-flex flex-justify">
<div>
{% if heading_level %}
<{{ heading_level }}
{% else %}
<h2
{% endif %}
class="summary-item__title
font-sans-md
text-primary-dark text-semibold text-primary-dark text-semibold
margin-top-0 margin-bottom-05" margin-top-0 margin-bottom-05
padding-right-1"
> >
{{ title }} {{ title }}
{% if heading_level %}
</{{ heading_level }}>
{% else %}
</h2> </h2>
{% endif %}
{% if address %} {% if address %}
{% include "includes/organization_address.html" with organization=value %} {% include "includes/organization_address.html" with organization=value %}
{% elif contact %} {% elif contact %}
@ -24,7 +37,7 @@
{% include "includes/contact.html" with contact=item %}</li> {% include "includes/contact.html" with contact=item %}</li>
{% empty %} {% empty %}
<li>None</li> <li>None</li>
{% endfor %}</ul></p> {% endfor %}
</ul> </ul>
{% endif %} {% endif %}
{% else %} {% else %}
@ -47,21 +60,29 @@
{% endif %} {% endif %}
{% empty %} {% empty %}
<li>None</li> <li>None</li>
{% endfor %}</ul></p> {% endfor %}
</ul> </ul>
{% endif %} {% endif %}
{% else %} {% else %}
<p class="margin-top-0"> <p class="margin-top-0 margin-bottom-0">
{% if value %}
{{ value }} {{ value }}
{% else %}
None
{% endif %}
</p> </p>
{% endif %} {% endif %}
</div>
{% if edit_link %} {% if edit_link %}
<div class="text-right">
<a <a
href="{{ edit_link }}" href="{{ edit_link }}"
class="usa-link font-sans-sm"
> >
Edit<span class="sr-only"> {{ title }}</span> Edit<span class="sr-only"> {{ title }}</span>
</a> </a>
</div>
{% endif %} {% endif %}
</div>
</section> </section>