mirror of
https://github.com/cisagov/manage.get.gov.git
synced 2025-07-23 11:16:07 +02:00
Merge branch 'main' into ad/3256-new-changes-on-name-servers-page
This commit is contained in:
commit
dd79477157
7 changed files with 55 additions and 35 deletions
|
@ -215,7 +215,18 @@ export function initFormsetsForms() {
|
|||
// For the other contacts form, we need to update the fieldset headers based on what's visible vs hidden,
|
||||
// since the form on the backend employs Django's DELETE widget.
|
||||
let totalShownForms = document.querySelectorAll(`.repeatable-form:not([style*="display: none"])`).length;
|
||||
newForm.innerHTML = newForm.innerHTML.replace(formLabelRegex, `${formLabel} ${totalShownForms + 1}`);
|
||||
let newFormCount = totalShownForms + 1;
|
||||
// update the header
|
||||
let header = newForm.querySelector('legend h3');
|
||||
header.textContent = `${formLabel} ${newFormCount}`;
|
||||
header.id = `org-contact-${newFormCount}`;
|
||||
// update accessibility elements on the delete buttons
|
||||
let deleteDescription = newForm.querySelector('.delete-button-description');
|
||||
deleteDescription.textContent = 'Delete new contact';
|
||||
deleteDescription.id = `org-contact-${newFormCount}__name`;
|
||||
let deleteButton = newForm.querySelector('button');
|
||||
deleteButton.setAttribute("aria-labelledby", header.id);
|
||||
deleteButton.setAttribute("aria-describedby", deleteDescription.id);
|
||||
} else {
|
||||
newForm.innerHTML = newForm.innerHTML.replace(formLabelRegex, `${formLabel} ${formNum}`);
|
||||
}
|
||||
|
|
|
@ -61,7 +61,7 @@
|
|||
|
||||
<fieldset class="usa-fieldset margin-top-1 dotgov-domain-form" id="form-container">
|
||||
<legend>
|
||||
<h2>Alternative domains (optional)</h2>
|
||||
<h2 id="alternative-domains-title">Alternative domains (optional)</h2>
|
||||
</legend>
|
||||
|
||||
<p id="alt_domain_instructions" class="margin-top-05">Are there other domains you’d like if we can’t give
|
||||
|
@ -79,19 +79,23 @@
|
|||
{% endfor %}
|
||||
{% endwith %}
|
||||
{% endwith %}
|
||||
|
||||
<button type="button" value="save" class="usa-button usa-button--unstyled usa-button--with-icon" id="add-form">
|
||||
|
||||
<div class="usa-sr-only" id="alternative-domains__add-another-alternative">Add another alternative domain</div>
|
||||
<button aria-labelledby="alternative-domains-title" aria-describedby="alternative-domains__add-another-alternative" type="button" value="save" class="usa-button usa-button--unstyled usa-button--with-icon" id="add-form">
|
||||
<svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24" height="24">
|
||||
<use xlink:href="{%static 'img/sprite.svg'%}#add_circle"></use>
|
||||
</svg><span class="margin-left-05">Add another alternative</span>
|
||||
</button>
|
||||
|
||||
<div class="margin-bottom-3">
|
||||
<div class="usa-sr-only" id="alternative-domains__check-availability">Check domain availability</div>
|
||||
<button
|
||||
id="validate-alt-domains-availability"
|
||||
type="button"
|
||||
class="usa-button usa-button--outline"
|
||||
validate-for="{{ forms.1.requested_domain.auto_id }}"
|
||||
aria-labelledby="alternative-domains-title"
|
||||
aria-describedby="alternative-domains__check-availability"
|
||||
>Check availability</button>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -31,10 +31,14 @@
|
|||
<fieldset class="usa-fieldset repeatable-form padding-y-1">
|
||||
|
||||
<legend class="float-left-tablet">
|
||||
<h3 class="margin-top-05">Organization contact {{ forloop.counter }}</h2>
|
||||
<h3 class="margin-top-05" id="org-contact-{{ forloop.counter }}">Organization contact {{ forloop.counter }}</h2>
|
||||
</legend>
|
||||
|
||||
<button type="button" class="usa-button usa-button--unstyled display-block float-right-tablet delete-record margin-top-1 text-secondary line-height-sans-5 usa-button--with-icon">
|
||||
{% if form.first_name or form.last_name %}
|
||||
<span class="usa-sr-only delete-button-description" id="org-contact-{{ forloop.counter }}__name">Delete {{form.first_name.value }} {{ form.last_name.value }}</span>
|
||||
{% else %}
|
||||
<span class="usa-sr-only" id="org-contact-{{ forloop.counter }}__name">Delete new contact</span>
|
||||
{% endif %}
|
||||
<button aria-labelledby="org-contact-{{ forloop.counter }}" aria-describedby="org-contact-{{ forloop.counter }}__name" type="button" class="usa-button usa-button--unstyled display-block float-right-tablet delete-record margin-top-1 text-secondary line-height-sans-5 usa-button--with-icon">
|
||||
<svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24" height="24">
|
||||
<use xlink:href="{%static 'img/sprite.svg'%}#delete"></use>
|
||||
</svg>Delete
|
||||
|
|
|
@ -14,22 +14,15 @@
|
|||
{% endif %}
|
||||
|
||||
<div class="section-outlined__search section-outlined__search--widescreen {% if portfolio %}mobile:grid-col-12 desktop:grid-col-6{% endif %}">
|
||||
<section aria-label="Domain requests search component" class="margin-top-2">
|
||||
<section aria-label="Domain requests search component" id="domain-requests-search-component" class="margin-top-2">
|
||||
<form class="usa-search usa-search--small" method="POST" role="search">
|
||||
{% csrf_token %}
|
||||
<button class="usa-button usa-button--unstyled margin-right-3 display-none" id="domain-requests__reset-search" type="button">
|
||||
<button class="usa-button usa-button--unstyled margin-right-3 display-none" id="domain-requests__reset-search" type="button" aria-labelledby="domain-requests-search-component">
|
||||
<svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24">
|
||||
<use xlink:href="{%static 'img/sprite.svg'%}#close"></use>
|
||||
</svg>
|
||||
Reset
|
||||
</button>
|
||||
<label id="domain-requests__search-label" class="usa-sr-only" for="domain-requests__search-field">
|
||||
{% if portfolio %}
|
||||
Search by domain name or creator
|
||||
{% else %}
|
||||
Search by domain name
|
||||
{% endif %}
|
||||
</label>
|
||||
</button>
|
||||
<input
|
||||
class="usa-input"
|
||||
id="domain-requests__search-field"
|
||||
|
@ -40,8 +33,10 @@
|
|||
{% else %}
|
||||
placeholder="Search by domain name"
|
||||
{% endif %}
|
||||
aria-labelledby="domain-requests-search-component"
|
||||
/>
|
||||
<button class="usa-button" type="submit" id="domain-requests__search-field-submit" aria-labelledby="domain-requests__search-label">
|
||||
<div class="usa-sr-only" id="domain-requests-search-button__description">Click to search</div>
|
||||
<button class="usa-button" type="submit" id="domain-requests__search-field-submit" aria-labelledby="domain-requests-search-component" aria-describedby="domain-requests-search-button__description">
|
||||
<img
|
||||
src="{% static 'img/usa-icons-bg/search--white.svg' %}"
|
||||
class="usa-search__submit-icon"
|
||||
|
|
|
@ -34,24 +34,25 @@
|
|||
<span id="portfolio-js-value" data-portfolio="{{ portfolio.id }}"></span>
|
||||
{% endif %}
|
||||
<div class="section-outlined__search section-outlined__search--widescreen {% if portfolio %}mobile:grid-col-12 desktop:grid-col-6{% endif %}">
|
||||
<section aria-label="Domains search component" class="margin-top-2">
|
||||
<section aria-label="Domains search component" class="margin-top-2" id="domains-search-component">
|
||||
<form class="usa-search usa-search--small" method="POST" role="search">
|
||||
{% csrf_token %}
|
||||
<button class="usa-button usa-button--unstyled margin-right-3 display-none" id="domains__reset-search" type="button">
|
||||
<button class="usa-button usa-button--unstyled margin-right-3 display-none" id="domains__reset-search" type="button" aria-labelledby="domains-search-component">
|
||||
<svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24">
|
||||
<use xlink:href="{%static 'img/sprite.svg'%}#close"></use>
|
||||
</svg>
|
||||
Reset
|
||||
</button>
|
||||
<label id="domains__search-label" class="usa-sr-only" for="domains__search-field">Search by domain name</label>
|
||||
<input
|
||||
class="usa-input"
|
||||
id="domains__search-field"
|
||||
type="search"
|
||||
name="domains-search"
|
||||
placeholder="Search by domain name"
|
||||
aria-labelledby="domains-search-component"
|
||||
/>
|
||||
<button class="usa-button" type="submit" id="domains__search-field-submit" aria-labelledby="domains__search-label">
|
||||
<div class="usa-sr-only" id="domains-search-button__description">Click to search</div>
|
||||
<button class="usa-button" type="submit" id="domains__search-field-submit" aria-labelledby="domains-search-component" aria-describedby="domains-search-button__description">
|
||||
<img
|
||||
src="{% static 'img/usa-icons-bg/search--white.svg' %}"
|
||||
class="usa-search__submit-icon"
|
||||
|
@ -63,12 +64,13 @@
|
|||
</div>
|
||||
{% if user_domain_count and user_domain_count > 0 %}
|
||||
<div class="section-outlined__utility-button mobile-lg:padding-right-105 {% if portfolio %} mobile:grid-col-12 desktop:grid-col-6 desktop:padding-left-3{% endif %}">
|
||||
<section aria-label="Domains report component" class="margin-top-205">
|
||||
<a href="{% url 'export_data_type_user' %}" class="usa-button usa-button--unstyled usa-button--with-icon usa-button--justify-right">
|
||||
<section aria-label="Domains report component" class="margin-top-205" id="domains-report-component">
|
||||
<div class="usa-sr-only" id="domains-export-button__description">Click to export as csv</div>
|
||||
<button data-href="{% url 'export_data_type_user' %}" class="use-button-as-link usa-button usa-button--unstyled usa-button--with-icon usa-button--justify-right" aria-labelledby="domains-report-component" aria-describedby="domains-export-button__description">
|
||||
<svg class="usa-icon usa-icon--large" aria-hidden="true" focusable="false" role="img" width="24" height="24">
|
||||
<use xlink:href="{%static 'img/sprite.svg'%}#file_download"></use>
|
||||
</svg>Export as CSV
|
||||
</a>
|
||||
</button>
|
||||
</section>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
|
|
@ -1,16 +1,18 @@
|
|||
{% if form.errors %}
|
||||
<div id="form-errors">
|
||||
{% for error in form.non_field_errors %}
|
||||
<div class="usa-alert usa-alert--error usa-alert--slim margin-bottom-2" role="alert">
|
||||
<div class="usa-alert usa-alert--error usa-alert--slim margin-bottom-2" role="alert" tabindex="0">
|
||||
<div class="usa-alert__body">
|
||||
{{ error|escape }}
|
||||
<span class="usa-sr-only">Error:</span>
|
||||
{{ error|escape }}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% for field in form %}
|
||||
{% for error in field.errors %}
|
||||
<div class="usa-alert usa-alert--error usa-alert--slim margin-bottom-2">
|
||||
<div class="usa-alert usa-alert--error usa-alert--slim margin-bottom-2" tabindex="0">
|
||||
<div class="usa-alert__body">
|
||||
<span class="usa-sr-only">Error:</span>
|
||||
{{ error|escape }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -9,24 +9,25 @@
|
|||
<div class="section-outlined__header margin-bottom-3 grid-row">
|
||||
<!-- ---------- SEARCH ---------- -->
|
||||
<div class="section-outlined__search mobile:grid-col-12 desktop:grid-col-6 section-outlined__search--widescreen">
|
||||
<section aria-label="Members search component" class="margin-top-2">
|
||||
<section aria-label="Members search component" class="margin-top-2" id="members-search-component">
|
||||
<form class="usa-search usa-search--small" method="POST" role="search">
|
||||
{% csrf_token %}
|
||||
<button class="usa-button usa-button--unstyled margin-right-3 display-none" id="members__reset-search" type="button">
|
||||
<button class="usa-button usa-button--unstyled margin-right-3 display-none" id="members__reset-search" type="button" aria-labelledby="members-search-component">
|
||||
<svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24">
|
||||
<use xlink:href="{%static 'img/sprite.svg'%}#close"></use>
|
||||
</svg>
|
||||
Reset
|
||||
</button>
|
||||
<label class="usa-sr-only" for="members__search-field">Search by member name</label>
|
||||
<input
|
||||
class="usa-input"
|
||||
id="members__search-field"
|
||||
type="search"
|
||||
name="members-search"
|
||||
placeholder="Search by member name"
|
||||
aria-labelledby="members-search-component"
|
||||
/>
|
||||
<button class="usa-button" type="submit" id="members__search-field-submit">
|
||||
<div class="usa-sr-only" id="members-search-button__description">Click to search</div>
|
||||
<button class="usa-button" type="submit" id="members__search-field-submit" aria-labelledby="members-search-component" aria-describedby="members-search-button__description">
|
||||
<img
|
||||
src="{% static 'img/usa-icons-bg/search--white.svg' %}"
|
||||
class="usa-search__submit-icon"
|
||||
|
@ -37,12 +38,13 @@
|
|||
</section>
|
||||
</div>
|
||||
<div class="section-outlined__utility-button mobile-lg:padding-right-105 {% if portfolio %} mobile:grid-col-12 desktop:grid-col-6 desktop:padding-left-3{% endif %}">
|
||||
<section aria-label="Domains report component" class="margin-top-205">
|
||||
<a href="{% url 'export_members_portfolio' %}" class="usa-button usa-button--unstyled usa-button--with-icon usa-button--justify-right">
|
||||
<section aria-label="Members report component" class="margin-top-205" id="members-report-component">
|
||||
<div class="usa-sr-only" id="members-export-button__description">Click to export as csv</div>
|
||||
<button href="{% url 'export_members_portfolio' %}" class="use-button-as-link usa-button usa-button--unstyled usa-button--with-icon usa-button--justify-right" aria-labelledby="members-report-component" aria-describedby="members-export-button__description">
|
||||
<svg class="usa-icon usa-icon--large" aria-hidden="true" focusable="false" role="img" width="24" height="24">
|
||||
<use xlink:href="{%static 'img/sprite.svg'%}#file_download"></use>
|
||||
</svg>Export as CSV
|
||||
</a>
|
||||
</button>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue