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

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 twbs/bootstrap#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.

ietf/templates/doc/document_ballot_content.html

@@ -22,7 +22,7 @@
     <div class="col-md-10">
         {% if all_ballots and all_ballots|length > 1 %}
 	        <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 %}
                     <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 %}">

ietf/templates/doc/revisions_list.html

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

ietf/templates/nomcom/view_feedback_pending.html

@@ -155,7 +155,7 @@ <h2>Feedback pending from email list</h2>
                     {% endfor %}
                 </tbody>
             </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 %}">
                     <a class="page-link" aria-label="<"
                        href="{% if not page.has_previous %}#{% else %}?page={{ page.previous_page_number }}{% endif %}">
@@ -181,4 +181,4 @@ <h2>Feedback pending from email list</h2>
     </p>
 {% endif %}
 {% endblock %}
-{% block js %}{{ formset.media.js }}{% endblock %}
+{% block js %}{{ formset.media.js }}{% endblock %}