mirror of
https://github.com/cisagov/manage.get.gov.git
synced 2025-07-21 18:25:58 +02:00
Merge pull request #3193 from cisagov/es/2913-domain-request-screenreader
2913: Update domain request screenreader outputs [ES]
This commit is contained in:
commit
db9d4ded2e
8 changed files with 56 additions and 37 deletions
|
@ -149,6 +149,11 @@ footer {
|
|||
color: color('primary');
|
||||
}
|
||||
|
||||
.usa-radio {
|
||||
margin-top: 1rem;
|
||||
font-size: 1.06rem;
|
||||
}
|
||||
|
||||
abbr[title] {
|
||||
// workaround for underlining abbr element
|
||||
border-bottom: none;
|
||||
|
|
|
@ -34,6 +34,9 @@ h2 {
|
|||
.usa-form,
|
||||
.usa-form fieldset {
|
||||
font-size: 1rem;
|
||||
.usa-legend {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.p--blockquote {
|
||||
|
|
|
@ -530,7 +530,7 @@ class PurposeForm(RegistrarForm):
|
|||
widget=forms.Textarea(
|
||||
attrs={
|
||||
"aria-label": "What is the purpose of your requested domain? Describe how you’ll use your .gov domain. \
|
||||
Will it be used for a website, email, or something else? You can enter up to 2000 characters."
|
||||
Will it be used for a website, email, or something else?"
|
||||
}
|
||||
),
|
||||
validators=[
|
||||
|
@ -736,7 +736,13 @@ class NoOtherContactsForm(BaseDeletableRegistrarForm):
|
|||
required=True,
|
||||
# label has to end in a space to get the label_suffix to show
|
||||
label=("No other employees rationale"),
|
||||
widget=forms.Textarea(),
|
||||
widget=forms.Textarea(
|
||||
attrs={
|
||||
"aria-label": "You don’t need to provide names of other employees now, \
|
||||
but it may slow down our assessment of your eligibility. Describe \
|
||||
why there are no other employees who can help verify your request."
|
||||
}
|
||||
),
|
||||
validators=[
|
||||
MaxLengthValidator(
|
||||
1000,
|
||||
|
@ -784,7 +790,12 @@ class AnythingElseForm(BaseDeletableRegistrarForm):
|
|||
anything_else = forms.CharField(
|
||||
required=True,
|
||||
label="Anything else?",
|
||||
widget=forms.Textarea(),
|
||||
widget=forms.Textarea(
|
||||
attrs={
|
||||
"aria-label": "Is there anything else you’d like us to know about your domain request? \
|
||||
Provide details below. You can enter up to 2000 characters"
|
||||
}
|
||||
),
|
||||
validators=[
|
||||
MaxLengthValidator(
|
||||
2000,
|
||||
|
|
|
@ -2,15 +2,25 @@
|
|||
class="{% if label_classes %} {{ label_classes }}{% endif %}{% if label_tag == 'legend' %} {{ legend_classes }}{% endif %}"
|
||||
{% if not field.use_fieldset %}for="{{ widget.attrs.id }}"{% endif %}
|
||||
>
|
||||
{% if span_for_text %}
|
||||
<span>{{ field.label }}</span>
|
||||
{% if legend_heading %}
|
||||
<h2 class="{{ legend_classes }}">{{ legend_heading }} </h2>
|
||||
{% if widget.attrs.id == 'id_additional_details-has_cisa_representative' %}
|
||||
<p>.gov is managed by the Cybersecurity and Infrastructure Security Agency. CISA has <a href="https://www.cisa.gov/about/regions" target="_blank">10 regions</a> that some organizations choose to work with. Regional representatives use titles like protective security advisors, cyber security advisors, or election security advisors.</p>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{{ field.label }}
|
||||
{% if span_for_text %}
|
||||
<span>{{ field.label }}</span>
|
||||
{% else %}
|
||||
{{ field.label }}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if widget.attrs.required %}
|
||||
<!--Don't add asterisk to one-field forms -->
|
||||
{% if field.label == "Is your organization an election office?" or field.label == "What .gov domain do you want?" or field.label == "I read and agree to the requirements for operating a .gov domain." or field.label == "Please explain why there are no other employees from your organization we can contact to help us assess your eligibility for a .gov domain." %}
|
||||
|
||||
{% if field.widget_type == 'radioselect' %}
|
||||
<em>Select one. <abbr class="usa-hint usa-hint--required" title="required">*</abbr></em>
|
||||
<!--Don't add asterisk to one-field forms -->
|
||||
{% elif field.label == "Is your organization an election office?" or field.label == "What .gov domain do you want?" or field.label == "I read and agree to the requirements for operating a .gov domain." or field.label == "Please explain why there are no other employees from your organization we can contact to help us assess your eligibility for a .gov domain." or field.label == "Has other contacts" %}
|
||||
{% else %}
|
||||
<abbr class="usa-hint usa-hint--required" title="required">*</abbr>
|
||||
{% endif %}
|
||||
|
|
|
@ -9,15 +9,9 @@
|
|||
|
||||
{% block form_fields %}
|
||||
|
||||
<fieldset class="usa-fieldset margin-top-2">
|
||||
<legend>
|
||||
<h2>Are you working with a CISA regional representative on your domain request?</h2>
|
||||
<p>.gov is managed by the Cybersecurity and Infrastructure Security Agency. CISA has <a href="https://www.cisa.gov/about/regions" target="_blank">10 regions</a> that some organizations choose to work with. Regional representatives use titles like protective security advisors, cyber security advisors, or election security advisors.</p>
|
||||
</legend>
|
||||
|
||||
<fieldset class="usa-fieldset">
|
||||
<!-- Toggle -->
|
||||
<em>Select one. <abbr class="usa-hint usa-hint--required" title="required">*</abbr></em>
|
||||
{% with add_class="usa-radio__input--tile" add_legend_class="usa-sr-only" %}
|
||||
{% with add_class="usa-radio__input--tile" add_legend_class="margin-top-0" add_legend_heading="Are you working with a CISA regional representative on your domain request?" %}
|
||||
{% input_with_errors forms.0.has_cisa_representative %}
|
||||
{% endwith %}
|
||||
{# forms.0 is a small yes/no form that toggles the visibility of "cisa representative" formset #}
|
||||
|
@ -31,13 +25,8 @@
|
|||
</div>
|
||||
|
||||
<fieldset class="usa-fieldset margin-top-2">
|
||||
<legend>
|
||||
<h2>Is there anything else you’d like us to know about your domain request?</h2>
|
||||
</legend>
|
||||
|
||||
<!-- Toggle -->
|
||||
<em>Select one. <abbr class="usa-hint usa-hint--required" title="required">*</abbr></em>
|
||||
{% with add_class="usa-radio__input--tile" add_legend_class="usa-sr-only" %}
|
||||
{% with add_class="usa-radio__input--tile" add_legend_heading="Is there anything else you’d like us to know about your domain request?" %}
|
||||
{% input_with_errors forms.2.has_anything_else_text %}
|
||||
{% endwith %}
|
||||
{# forms.2 is a small yes/no form that toggles the visibility of "cisa representative" formset #}
|
||||
|
@ -45,7 +34,7 @@
|
|||
|
||||
<div class="margin-top-3" id="anything-else">
|
||||
<p>Provide details below. <abbr class="usa-hint usa-hint--required" title="required">*</abbr></p>
|
||||
{% with attr_maxlength=2000 add_label_class="usa-sr-only" %}
|
||||
{% with attr_maxlength=2000 add_label_class="usa-sr-only" add_legend_class="usa-sr-only" add_legend_heading="Is there anything else you’d like us to know about your domain request?" add_aria_label="Provide details below. You can enter up to 2000 characters" %}
|
||||
{% input_with_errors forms.3.anything_else %}
|
||||
{% endwith %}
|
||||
{# forms.3 is a form for inputting the e-mail of a cisa representative #}
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<li><strong>We typically don’t reach out to these employees</strong>, but if contact is necessary, our practice is to coordinate with you first.</li>
|
||||
</ul>
|
||||
</p>
|
||||
|
||||
{% include "includes/required_fields.html" %}
|
||||
{% endblock %}
|
||||
|
||||
{% block form_required_fields_help_text %}
|
||||
|
@ -17,20 +17,14 @@
|
|||
{% endblock %}
|
||||
|
||||
{% block form_fields %}
|
||||
<fieldset class="usa-fieldset margin-top-2">
|
||||
<legend>
|
||||
<h2>Are there other employees who can help verify your request?</h2>
|
||||
</legend>
|
||||
|
||||
{% with add_class="usa-radio__input--tile" add_legend_class="usa-sr-only" %}
|
||||
<div class="margin-top-2">
|
||||
{% with add_class="usa-radio__input--tile" add_legend_heading="Are there other employees who can help verify your request?" %}
|
||||
{% input_with_errors forms.0.has_other_contacts %}
|
||||
{% endwith %}
|
||||
{# forms.0 is a small yes/no form that toggles the visibility of "other contact" formset #}
|
||||
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
<div id="other-employees" class="other-contacts-form">
|
||||
{% include "includes/required_fields.html" %}
|
||||
{{ forms.1.management_form }}
|
||||
{# forms.1 is a formset and this iterates over its forms #}
|
||||
{% for form in forms.1.forms %}
|
||||
|
|
|
@ -71,7 +71,11 @@ error messages, if necessary.
|
|||
{% endif %}
|
||||
|
||||
{# this is the input field, itself #}
|
||||
{% include widget.template_name %}
|
||||
{% with aria_label=aria_label %}
|
||||
{% include widget.template_name %}
|
||||
{% endwith %}
|
||||
|
||||
|
||||
|
||||
{% if append_gov %}
|
||||
<span class="padding-top-05 padding-left-2px">.gov </span>
|
||||
|
|
|
@ -57,6 +57,7 @@ def input_with_errors(context, field=None): # noqa: C901
|
|||
legend_classes = []
|
||||
group_classes = []
|
||||
aria_labels = []
|
||||
legend_headings = []
|
||||
sublabel_text = []
|
||||
|
||||
# this will be converted to an attribute string
|
||||
|
@ -91,6 +92,8 @@ def input_with_errors(context, field=None): # noqa: C901
|
|||
label_classes.append(value)
|
||||
elif key == "add_legend_class":
|
||||
legend_classes.append(value)
|
||||
elif key == "add_legend_heading":
|
||||
legend_headings.append(value)
|
||||
|
||||
elif key == "add_group_class":
|
||||
group_classes.append(value)
|
||||
|
@ -120,9 +123,6 @@ def input_with_errors(context, field=None): # noqa: C901
|
|||
else:
|
||||
context["label_tag"] = "label"
|
||||
|
||||
if field.use_fieldset:
|
||||
label_classes.append("usa-legend")
|
||||
|
||||
if field.widget_type == "checkbox":
|
||||
label_classes.append("usa-checkbox__label")
|
||||
elif not field.use_fieldset:
|
||||
|
@ -153,6 +153,9 @@ def input_with_errors(context, field=None): # noqa: C901
|
|||
if legend_classes:
|
||||
context["legend_classes"] = " ".join(legend_classes)
|
||||
|
||||
if legend_headings:
|
||||
context["legend_heading"] = " ".join(legend_headings)
|
||||
|
||||
if group_classes:
|
||||
context["group_classes"] = " ".join(group_classes)
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue