altf4arnold/datatracker
1
0
Fork 0
Code Issues Pull requests Actions 3 Packages Projects Releases Wiki Activity

fix: add flex-wrap to pagination elements (#3822)

Browse source 
They seem to be one of the only bs5 elements that do not by default wrap, which
causes display issues on narrow screens when there are lots of page elements,
e.g., on http://127.0.0.1:8000/doc/draft-ietf-ipwave-vehicular-networking/

Adding `flex-wrap` (per https://github.com/twbs/bootstrap/issues/23504) makes
this better, but unfortunately doesn't fix it completely, because the layout
still jumps when the window is narrowed by the used. It does fix the issue on
first load and after a reload though.
This commit is contained in:
Lars Eggert 2022-04-14 20:36:24 +02:00 committed by GitHub
parent 310e828262
commit 81fe7a15cf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 5 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ietf/templates/doc/document_ballot_content.html
View file

@ -22,7 +22,7 @@
<div class="col-md-10"> <div class="col-md-10">
{% if all_ballots and all_ballots|length > 1 %} {% if all_ballots and all_ballots|length > 1 %}
<label class="my-1 fw-bold">Ballots:</label> <label class="my-1 fw-bold">Ballots:</label>
<ul class="pagination pagination-sm"> <ul class="pagination pagination-sm flex-wrap">
{% for b in all_ballots %} {% for b in all_ballots %}
<li class="page-item{% if b == ballot %} active{% endif %}"> <li class="page-item{% if b == ballot %} active{% endif %}">
<a class="page-link" href="{% url "ietf.doc.views_doc.document_ballot" name=doc.name ballot_id=b.pk %}"> <a class="page-link" href="{% url "ietf.doc.views_doc.document_ballot" name=doc.name ballot_id=b.pk %}">

4
ietf/templates/doc/revisions_list.html
View file

@ -3,7 +3,7 @@
{% origin %} {% origin %}
<label class="my-1 fw-bold">Versions:</label> <label class="my-1 fw-bold">Versions:</label>
<nav class="mb-3"> <nav class="mb-3">
<ul class="pagination pagination-sm"> <ul class="pagination pagination-sm flex-wrap">
{% for rev in revisions %} {% for rev in revisions %}
<li class="page-item {% if rev == doc.rev %}{% if snapshot or doc.get_state_slug != 'rfc' %}active{% endif %}{% endif %}"> <li class="page-item {% if rev == doc.rev %}{% if snapshot or doc.get_state_slug != 'rfc' %}active{% endif %}{% endif %}">
<a class="page-link" <a class="page-link"
@ -18,4 +18,4 @@
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>
</nav> </nav>

4
ietf/templates/nomcom/view_feedback_pending.html
View file

@ -155,7 +155,7 @@
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
<ul class="pagination pagination-sm mb-3"> <ul class="pagination pagination-sm flex-wrap mb-3">
<li class="page-item {% if not page.has_previous %}disabled{% endif %}"> <li class="page-item {% if not page.has_previous %}disabled{% endif %}">
<a class="page-link" aria-label="<" <a class="page-link" aria-label="<"
href="{% if not page.has_previous %}#{% else %}?page={{ page.previous_page_number }}{% endif %}"> href="{% if not page.has_previous %}#{% else %}?page={{ page.previous_page_number }}{% endif %}">
@ -181,4 +181,4 @@
</p> </p>
{% endif %} {% endif %}
{% endblock %} {% endblock %}
{% block js %}{{ formset.media.js }}{% endblock %} {% block js %}{{ formset.media.js }}{% endblock %}