fix: Better agenda display on phone screens (#4156)

* fix: Better agenda display on phone screens

* Remove comment

* Conditional <br>

* Retain existing columns on non-small screens
This commit is contained in:
Lars Eggert 2022-07-09 00:34:40 +03:00 committed by GitHub
parent 091144d7c1
commit 629bff0f88
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 31 additions and 18 deletions

View file

@ -278,6 +278,7 @@
{% endif %}
</td>
<td>
<div class="d-none d-sm-block">
{% if item.session.historic_group %}
<a href="{% url 'ietf.group.views.group_about' acronym=item.session.historic_group.acronym %}">
{{ item.session.historic_group.acronym }}
@ -285,21 +286,34 @@
{% else %}
{{ item.session.historic_group.acronym }}
{% endif %}
</div>
</td>
{% endif %}
<td>
{% if item.session.current_status == 'canceled' %}
<span class="badge rounded-pill bg-danger float-end">Cancelled</span>
{% else %}
<div class="float-end ps-2">
{% include "meeting/session_buttons_include.html" with show_agenda=True session=item.session meeting=schedule.meeting %}
</div>
{% endif %}
<div class="d-sm-none">
{% if item.session.historic_group %}
<a href="{% url 'ietf.group.views.group_about' acronym=item.session.historic_group.acronym %}">
{{ item.session.historic_group.acronym }}</a>
{% else %}
{{ item.session.historic_group.acronym }}
{% endif %}
{% if item.session.historic_group.historic_parent.acronym %}
<span class="text-muted">{{ item.session.historic_group.historic_parent.acronym }}</span>
{% endif %}
</div>
{% agenda_anchor item.session %}
{% assignment_display_name item %}
{% end_agenda_anchor %}
{% if item.session.current_status == 'canceled' %}
<span class="badge rounded-pill bg-danger float-end">Cancelled</span>
{% else %}
<div class="float-end ps-2">
{% include "meeting/session_buttons_include.html" with show_agenda=True session=item.session meeting=schedule.meeting %}
</div>
{% endif %}
{% if item.session.historic_group.state_id == "bof" %}
<span class="badge rounded-pill bg-success float-end me-2">BOF</span>
<span class="badge rounded-pill bg-success float-end">BOF</span>
{% endif %}
{% if item.session.current_status == 'resched' %}
<div class="badge rounded-pill bg-danger float-end">
@ -326,7 +340,7 @@
</a>
{% elif item.session.agenda_note %}
<br>
<span class="text-danger">{{ item.session.agenda_note }}</span>
<span class="text-danger small">{{ item.session.agenda_note }}</span>
{% endif %}
</td>
</tr>
@ -510,4 +524,4 @@
}
);
</script>
{% endblock %}
{% endblock %}

View file

@ -43,7 +43,7 @@ Optional parameters:
<div class="col-1 ms-1">
<div class="row">
<button type="button"
class="agenda-filter-areaselectbtn btn btn-sm btn-outline-primary {% if area.label or area.keyword %}pickview {{ area.keyword }}{% endif %}"
class="agenda-filter-areaselectbtn overflow-hidden btn btn-sm btn-outline-primary {% if area.label or area.keyword %}pickview {{ area.keyword }}{% endif %}"
data-filter-item="{{ area.keyword }}"
{% if not area.label and not area.keyword %}disabled{% endif %}>
{% if area.label or area.keyword %}

View file

@ -20,13 +20,11 @@
</h1>
<div class="lead row">
<div class="{% if updated %}col-6{% else %}col-12{% endif %}">
{{ meeting.city|default:"Location TBD" }}, {{ meeting.date|date:"F j" }} -
{% if meeting.date.month != meeting.end_date.month %}{{ meeting.end_date|date:"F " }}{% endif %}
{{ meeting.end_date|date:"j, Y" }}
{{ meeting.city|default:"Location TBD" }}, {{ meeting.date|date:"F j" }}{% if meeting.date.month != meeting.end_date.month %} - {{ meeting.end_date|date:"F " }}{% else %}-{% endif %}{{ meeting.end_date|date:"j, Y" }}
</div>
{% if updated %}
<div class="col-6 text-end">
Updated: {{ updated|date:"Y-m-d \a\t G:i:s (T)" }}
Updated {{ updated|date:"Y-m-d \a\t G:i (T)" }}
</div>
{% endif %}
</div>
@ -96,4 +94,4 @@
<a class="nav-link"
href="{% url 'ietf.meeting.views.agenda' num=meeting.number ext='.txt' %}">Plaintext</a>
</li>
</ul>
</ul>

View file

@ -35,8 +35,9 @@ As long as id_suffix is different, should allow for as many copies of the widget
value="UTC">
<label class="btn btn-outline-primary" for="utc-timezone{{ suffix }}">UTC</label>
{% if not minimal %}
<label aria-label="Select timezone" class="d-none" for="timezone-select{{ id_suffix }}"></label>
<!-- [html-validate-disable-block input-missing-label -- labelled via aria-label] -->
<select id="timezone-select{{ suffix }}"
aria-label="Select timezone"
class="tz-select select2-field form-select border-primary"
data-max-entries="1" data-minimum-input-length="0">
{# Avoid blank while loading. JavaScript replaces the option list after init. #}
@ -45,4 +46,4 @@ As long as id_suffix is different, should allow for as many copies of the widget
</option>
</select>
{% endif %}
</div>
</div>