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 %}
{% 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">
<h1>Domain request for {{ domainapplication.requested_domain.name }}</h1>
<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"
aria-labelledby="summary-box-key-information"
>
@ -38,11 +38,11 @@
<div class="grid-col desktop:grid-offset-2 maxw-tablet">
<h2 class="text-primary-darker"> Summary of your domain request </h2>
{% include "includes/summary_item.html" with title='Type of organization' value=domainapplication.get_organization_type_display %}
{% with heading_level='h3' %}
{% include "includes/summary_item.html" with title='Type of organization' value=domainapplication.get_organization_type_display heading_level=heading_level %}
{% 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 %}
<p>Federally-recognized tribe</p>
@ -55,44 +55,46 @@
{% endif %}
{% 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 %}
{% 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 %}
{% 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 %}
{% 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 %}
{% 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 %}
{% 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 %}
{% 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 %}
{% 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 %}
{% 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 %}
{% 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='Anything else we should know' value=domainapplication.anything_else|default:"No" %}
{% 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" heading_level=heading_level %}
{% endwith %}
</div>
</main>

View file

@ -2,66 +2,87 @@
<section class="summary-item margin-top-3">
<hr class="" aria-hidden="true" />
<h2 class="summary-item__title
text-primary-dark text-semibold
margin-top-0 margin-bottom-05"
>
{{ title }}
</h2>
{% if address %}
{% include "includes/organization_address.html" with organization=value %}
{% elif contact %}
{% if list %}
{% if value|length == 1 %}
{% include "includes/contact.html" with contact=value|first %}
<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
margin-top-0 margin-bottom-05
padding-right-1"
>
{{ title }}
{% if heading_level %}
</{{ heading_level }}>
{% else %}
</h2>
{% endif %}
{% if address %}
{% include "includes/organization_address.html" with organization=value %}
{% elif contact %}
{% if list %}
{% if value|length == 1 %}
{% include "includes/contact.html" with contact=value|first %}
{% else %}
<ul class="usa-list usa-list--unstyled margin-top-0">
{% for item in value %}
<li>
<p class="text-semibold margin-top-1 margin-bottom-0">
Contact {{forloop.counter}}
</p>
{% include "includes/contact.html" with contact=item %}</li>
{% empty %}
<li>None</li>
{% endfor %}
</ul>
{% endif %}
{% else %}
{% include "includes/contact.html" with contact=value %}
{% endif %}
{% elif list %}
{% if value|length == 1 %}
{% if users %}
<p class="margin-top-0">{{ value.0.user.email }} </p>
{% else %}
<p class="margin-top-0">{{ value | first }} </p>
{% endif %}
{% else %}
<ul class="usa-list margin-top-0">
{% for item in value %}
{% if users %}
<li>{{ item.user.email }}</li>
{% else %}
<li>{{ item }}</li>
{% endif %}
{% empty %}
<li>None</li>
{% endfor %}
</ul>
{% endif %}
{% else %}
<ul class="usa-list usa-list--unstyled margin-top-0">
{% for item in value %}
<li>
<p class="text-semibold margin-top-1 margin-bottom-0">
Contact {{forloop.counter}}
</p>
{% include "includes/contact.html" with contact=item %}</li>
{% empty %}
<li>None</li>
{% endfor %}</ul></p>
</ul>
<p class="margin-top-0 margin-bottom-0">
{% if value %}
{{ value }}
{% else %}
None
{% endif %}
</p>
{% endif %}
{% else %}
{% include "includes/contact.html" with contact=value %}
{% endif %}
{% elif list %}
{% if value|length == 1 %}
{% if users %}
<p class="margin-top-0">{{ value.0.user.email }} </p>
{% else %}
<p class="margin-top-0">{{ value | first }} </p>
{% endif %}
{% else %}
<ul class="usa-list margin-top-0">
{% for item in value %}
{% if users %}
<li>{{ item.user.email }}</li>
{% else %}
<li>{{ item }}</li>
{% endif %}
{% empty %}
<li>None</li>
{% endfor %}</ul></p>
</ul>
{% endif %}
{% else %}
<p class="margin-top-0">
{{ value }}
</p>
{% endif %}
</div>
{% if edit_link %}
<a
href="{{ edit_link }}"
>
Edit<span class="sr-only"> {{ title }}</span>
</a>
<div class="text-right">
<a
href="{{ edit_link }}"
class="usa-link font-sans-sm"
>
Edit<span class="sr-only"> {{ title }}</span>
</a>
</div>
{% endif %}
</div>
</section>