fix: Add popup to explain colors for liaisons needing action. Rework how aria-label is supplied for several input fields. Update vnu.jar. Adjust some field styling. (#4115)

* fix: Add popup to explain colors for liaisons needing action

Also fix the search field styling while I'm here.

* Also fix some other field styling issues while I am here
This commit is contained in:
Lars Eggert 2022-07-07 22:01:21 +03:00 committed by GitHub
parent dfc0ebc11b
commit 01abc93cce
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 61 additions and 56 deletions

Binary file not shown.

View file

@ -1,5 +1,5 @@
{% extends "base_site.html" %}
{% load staticfiles %}
{% load staticfiles widget_tweaks %}
{% block title %}Groups - People{% endblock %}
@ -51,9 +51,9 @@
<table class="full-width">
<tbody>
<tr>
<td>{{ form.name.errors }}<label for="{{ form.name.id_for_label }}" aria-label="Name"></label>{{ form.name }}</td>
<td>{{ form.person.errors }}<label for="{{ form.person.id_for_label }}" aria-label="Person"></label>{{ form.person }}{% if form.person.help_text %}<br>{{ form.person.help_text }}{% endif %}</td>
<td>{{ form.email.errors }}<label for="{{ form.email.id_for_label }}" aria-label="Email"></label>{{ form.email }}{% if form.email.help_text %}<br>{{ form.email.help_text }}{% endif %}</td>
<td>{{ form.name.errors }}{{ form.name|attr:"aria-label:Name" }}</td>
<td>{{ form.person.errors }}{{ form.person|attr:"aria-label:Person" }}{% if form.person.help_text %}<br>{{ form.person.help_text }}{% endif %}</td>
<td>{{ form.email.errors }}{{ form.email|attr:"aria-label:Email" }}{% if form.email.help_text %}<br>{{ form.email.help_text }}{% endif %}</td>
<td><button type="submit" name="submit">Add</button></td>
</tr>
</tbody>

View file

@ -7,15 +7,13 @@
class="form-horizontal"
action="{% url 'ietf.doc.views_search.search' %}">
{% csrf_token %}
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
<div class="input-group search_field">
<label for="id_name" aria-label="Document name/title/RFC number"></label>
{{ form.name|add_class:"form-control"|attr:"placeholder:Document name/title/RFC number" }}
<span class="input-group-btn">
<button class="btn btn-primary" type="submit">
<i class="bi bi-search"></i>
Search
</button>
</span>
{{ form.name|add_class:"form-control"|attr:"placeholder:Document name/title/RFC number"|attr:"aria-label:Document name/title/RFC number" }}
<button class="btn btn-primary" type="submit">
<i class="bi bi-search"></i>
Search
</button>
</div>
{{ form.sort }}
<div class="accordion pt-3" id="search-accordion">
@ -42,15 +40,15 @@
<div class="col-sm-8">
<div class="form-check">
{{ form.rfcs|add_class:"form-check-input" }}
<label class="form-check-label" for="id_rfcs">RFC</label>
<label class="form-check-label" for="{{ form.rfcs.id_for_label }}">RFC</label>
</div>
<div class="form-check">
{{ form.activedrafts|add_class:"form-check-input" }}
<label class="form-check-label" for="id_activedrafts">Internet-Draft (active)</label>
<label class="form-check-label" for="{{ form.activedrafts.id_for_label }}">Internet-Draft (active)</label>
</div>
<div class="form-check">
{{ form.olddrafts|add_class:"form-check-input advdoctype" }}
<label class="form-check-label" for="id_olddrafts">Internet-Draft (expired, replaced or withdrawn)</label>
<label class="form-check-label" for="{{ form.olddrafts.id_for_label }}">Internet-Draft (expired, replaced or withdrawn)</label>
</div>
{% for value, label in form.fields.doctypes.choices %}
<div class="form-check">
@ -74,10 +72,10 @@
value="author"
{% if form.by.value == "author" %}checked{% endif %}
id="author">
<label for="author" class="form-check-label fw-bold">Author or Affiliation Name</label>
<label for="{{ form.author.id_for_label }}" class="form-check-label fw-bold">Author or Affiliation Name</label>
</div>
</div>
<div class="col-sm-8"><label aria-label="Author">{{ form.author|add_class:"form-control" }}</label></div>
<div class="col-sm-8">{{ form.author|add_class:"form-control" }}</div>
</div>
<div class="row mb-3 search_field">
<div class="col-sm-4">
@ -88,10 +86,10 @@
value="group"
{% if form.by.value == "group" %}checked{% endif %}
id="group">
<label for="group" class="form-check-label fw-bold">WG</label>
<label for="{{ form.group.id_for_label }}" class="form-check-label fw-bold">WG</label>
</div>
</div>
<div class="col-sm-8"><label aria-label="Group">{{ form.group|add_class:"form-control" }}</label></div>
<div class="col-sm-8">{{ form.group|add_class:"form-control" }}</div>
</div>
<div class="row mb-3 search_field">
<div class="col-sm-4">
@ -102,10 +100,10 @@
value="area"
{% if form.by.value == "area" %}checked{% endif %}
id="area">
<label for="area" class="form-check-label fw-bold">Area</label>
<label for="{{ form.area.id_for_label }}" class="form-check-label fw-bold">Area</label>
</div>
</div>
<div class="col-sm-8"><label aria-label="Area">{{ form.area|add_class:"form-select" }}</label></div>
<div class="col-sm-8">{{ form.area|add_class:"select2-field"|attr:"data-minimum-input-length:0"|attr:"data-max-entries:1"|attr:"data-minimum-results-for-search:Infinity" }}</div>
</div>
<div class="row mb-3 search_field">
<div class="col-sm-4">
@ -116,10 +114,10 @@
value="ad"
{% if form.by.value == "ad" %}checked{% endif %}
id="areadir">
<label for="areadir" class="form-check-label fw-bold">AD</label>
<label for="{{ form.ad.id_for_label }}" class="form-check-label fw-bold">AD</label>
</div>
</div>
<div class="col-sm-8"><label aria-label="AD">{{ form.ad|add_class:"form-select" }}</label></div>
<div class="col-sm-8">{{ form.ad|add_class:"select2-field"|attr:"data-minimum-input-length:0"|attr:"data-max-entries:1"|attr:"data-minimum-results-for-search:Infinity" }}</div>
</div>
<div class="row mb-3 search_field">
<div class="col-sm-4">
@ -130,11 +128,11 @@
value="state"
{% if form.by.value == "state" %}checked{% endif %}
id="state">
<label for="state" class="form-check-label fw-bold">IESG State</label>
<label for="{{ form.state.id_for_label }}" class="form-check-label fw-bold">IESG State</label>
</div>
</div>
<div class="col-sm-4"><label aria-label="State">{{ form.state|add_class:"form-select col-sm-4" }}</label></div>
<div class="col-sm-4"><label aria-label="Substate">{{ form.substate|add_class:"form-select" }}</label></div>
<div class="col-sm-4">{{ form.state|add_class:"select2-field"|attr:"data-minimum-input-length:0"|attr:"data-max-entries:1"|attr:"data-minimum-results-for-search:Infinity" }}</div>
<div class="col-sm-4">{{ form.substate|add_class:"select2-field"|attr:"data-minimum-input-length:0"|attr:"data-max-entries:1"|attr:"data-minimum-results-for-search:Infinity" }}</div>
</div>
<div class="row mb-3 search_field">
<div class="col-sm-4">
@ -145,10 +143,10 @@
value="irtfstate"
{% if form.by.value == "irtfstate" %}checked{% endif %}
id="irtfstate">
<label for="irtfstate" class="form-check-label fw-bold">IRTF State</label>
<label for="{{ form.irtfstate.id_for_label }}" class="form-check-label fw-bold">IRTF State</label>
</div>
</div>
<div class="col-sm-8"><label aria-label="IRTF State">{{ form.irtfstate|add_class:"form-select" }}</label></div>
<div class="col-sm-8">{{ form.irtfstate|add_class:"select2-field"|attr:"data-minimum-input-length:0"|attr:"data-max-entries:1"|attr:"data-minimum-results-for-search:Infinity" }}</div>
</div>
<div class="row mb-3 search_field">
<div class="col-sm-4">
@ -159,10 +157,10 @@
value="stream"
{% if form.by.value == "stream" %}checked{% endif %}
id="stream">
<label for="stream" class="form-check-label fw-bold">Stream</label>
<label for="{{ form.stream.id_for_label }}" class="form-check-label fw-bold">Stream</label>
</div>
</div>
<div class="col-sm-8"><label aria-label="Stream">{{ form.stream|add_class:"form-select" }}</label></div>
<div class="col-sm-8">{{ form.stream|add_class:"select2-field"|attr:"data-minimum-input-length:0"|attr:"data-max-entries:1"|attr:"data-minimum-results-for-search:Infinity" }}</div>
</div>
<div class="row mb-3 search_field">
<div class="col-sm-4 d-grid">
@ -180,8 +178,7 @@
</div>
</div>
</form>
<p class="text-center pt-3">
<a href="https://www.ietf.org/search">Search page for www.ietf.org website</a>
|
<a href="https://mailarchive.ietf.org">Search page for IETF mail list archives</a>
<p class="text-center pt-5">
<a class="btn btn-outline-primary btn-sm" href="https://www.ietf.org/search">Search page for www.ietf.org website</a>
<a class="btn btn-outline-primary btn-sm" href="https://mailarchive.ietf.org">Search page for IETF mail list archives</a>
</p>

View file

@ -1,9 +1,9 @@
{# Copyright The IETF Trust 2015, All Rights Reserved #}
{% load origin %}
{% origin %}
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
{% for rfc,choice_slug in form.relations.items %}
<div class="input-group mb-3">
<label for="new_relation_row_{{ rfc }}" aria-label="Enter new affected RFC"></label>
<select class="form-control select2-field"
data-ajax--url="{% url 'ietf.doc.views_search.ajax_select2_search_docs' model_name='document' doc_type='draft' %}"
data-max-entries="1"
@ -11,13 +11,16 @@
data-result-key="text"
name="new_relation_row_{{ rfc }}"
id="new_relation_row_{{ rfc }}"
aria-label="Enter new affected RFC"
data-placeholder="Enter new affected RFC.">
<option id="{{ rfc|upper }}" selected>
{{ rfc|upper }}
</option>
</select>
<label for="statchg_relation_row_{{ rfc }}" aria-label="Select proposed new status"></label>
<select class="form-select" name="statchg_relation_row_{{ rfc }}" id="statchg_relation_row_{{ rfc }}">
<select class="form-select"
aria-label="Select proposed new status"
name="statchg_relation_row_{{ rfc }}"
id="statchg_relation_row_{{ rfc }}">
<option {% if choice_slug == "" %}selected{% endif %}>
(None)
</option>
@ -32,9 +35,9 @@
</div>
{% endfor %}
<div class="input-group mb-3 new-relation-row">
<label for="new_relation_row_rfc" aria-label="Enter new affected RFC"></label>
<select name="new_relation_row_"
id="new_relation_row_rfc"
aria-label="Enter new affected RFC"
class="form-control select2-field"
data-ajax--url="{% url 'ietf.doc.views_search.ajax_select2_search_docs' model_name='docalias' doc_type='draft' %}"
data-result-key="text"
@ -42,8 +45,10 @@
data-width="resolve"
data-placeholder="Enter new affected RFC.">
</select>
<label for="statchg_relation_row" aria-label="Select proposed new status"></label>
<select id="statchg_relation_row" class="form-select" name="statchg_relation_row_">
<select id="statchg_relation_row"
class="form-select"
aria-label="Select proposed new status"
name="statchg_relation_row_">
<option {% if choice_slug == "" %}selected{% endif %}>
(Select proposed new status.)
</option>

View file

@ -21,7 +21,8 @@
{{ liaison.deadline|default:"-"|date:"Y-m-d" }}
{% if liaison.deadline and not liaison.action_taken %}
<br>
<span class="badge rounded-pill
<span title="{{ liaison.is_outgoing|yesno:'Outgoing,Incoming' }} liaison"
class="badge rounded-pill
{% if liaison.is_outgoing %}
bg-warning
{% else %}
@ -36,4 +37,4 @@
{% endfor %}
</tbody>
{% endif %}
</table>
</table>

View file

@ -8,9 +8,8 @@
action="{% url "ietf.liaisons.views.liaison_list" state=state %}"
method="get">
<div class="input-group search_field my-3">
<label aria-label="Liaison search">
{{ form.text|add_class:"form-control"|attr:"placeholder:Title, body, identifiers, etc." }}
</label>
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
{{ form.text|add_class:"form-control"|attr:"placeholder:Title, body, identifiers, etc."|attr:"aria-label:Liaison search" }}
<button class="btn btn-primary" type="submit">
<i class="bi bi-search"></i>
Search

View file

@ -171,15 +171,16 @@
</tr>
</thead>
<tbody>
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
{% for np in nominee_positions %}
<tr>
{% if is_chair and nomcom.group.state_id == 'active' %}
<td>
<label class="d-none" aria-label="np.nominee.name" for="id-{{ np.id }}"></label>
<input class="batch-select form-check-input"
type="checkbox"
value="{{ np.id }}"
id="id-{{ np.id }}"
aria-label="np.nominee.name"
name="selected">
</td>
<td class="edit">
@ -246,4 +247,4 @@
{% endblock %}
{% block js %}
<script src="{% static "ietf/js/list.js" %}"></script>
{% endblock %}
{% endblock %}

View file

@ -39,13 +39,14 @@
</tr>
</thead>
<tbody>
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
{% for nominee in nominees %}
<tr>
<td>
<label class="d-none" aria-label="{{ nominee.name }}" for="id-{{ nominee.id }}"></label>
<input type="checkbox"
class="batch-select form-check-input"
id="id-{{ nominee.id }}"
aria-label="{{ nominee.name }}"
value="{{ nominee.id }}"
name="selected"
checked>

View file

@ -104,15 +104,16 @@
</tr>
{% endif %}
<tr>
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
<td>{{ form.instance.time|date:"r" }}{{ form.id }}</td>
{% for choice in form.type.field.choices %}
<td class="text-center">
<label class="d-none" aria-label="{{ choice.1 }}" for="{{ choice.1|slugify }}"></label>
<input type="radio"
class="form-check-input"
name="{{ form.type.html_name }}"
value="{{ choice.0 }}"
id="{{ choice.1|slugify }}"
aria-label="{{ choice.1 }}"
{% if not choice.0 %}checked{% endif %}
title="{{ choice.1 }}">
</td>
@ -181,4 +182,4 @@
</p>
{% endif %}
{% endblock %}
{% block js %}{{ formset.media.js }}{% endblock %}
{% block js %}{{ formset.media.js }}{% endblock %}

View file

@ -132,25 +132,24 @@
</tr>
</thead>
<tbody>
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
{% for email in emails %}
<tr>
<td class="text-center">
<label aria-label="Primary email">
<input class="form-check-input"
type="radio"
name="primary_email"
aria-label="Primary email"
value="{{ email.pk }}"
{% if email.primary %}checked{% endif %}>
</label>
</td>
<td class="text-center">
<label aria-label="Active email">
<input class="form-check-input"
type="checkbox"
name="active_emails"
value="{{ email.pk }}"
aria-label="Active email"
{% if email.active %}checked{% endif %}>
</label>
</td>
<td>
{% if email.origin == person.user.username or email.origin == '' %}

View file

@ -51,10 +51,11 @@
<label id="reqtime" class="fw-bold col-sm-2 col-form-label">Request time:</label>
<div class="col-sm-10">
<div class="input-group">
<label class="d-none" for="from" aria-label="Request time, from"></label>
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
<input class="form-control"
type="text"
name="from"
aria-label="Request time, from"
id="from"
value="{{ from_date }}"
data-provide="datepicker"
@ -64,10 +65,10 @@
data-date-end-date="{{ today.isoformat }}"
data-date-start-view="months">
<span class="input-group-text" id="basic-addon2">&mdash;</span>
<label class="d-none" for="to" aria-label="Request time, to"></label>
<input class="form-control"
type="text"
name="to"
aria-label="Request time, to"
id="to"
value="{{ to_date }}"
data-provide="datepicker"