Many more changes related to tablesorter.

- Legacy-Id: 19702

ietf/dbtemplate/templates/dbtemplate/template_edit.html

@@ -39,7 +39,7 @@
 
 
 
-        <button class="btn btn-default" type="submit">Save changes</button>
+        <button class="btn btn-primary" type="submit">Save changes</button>
 
 
     </form>

ietf/doc/templatetags/ietf_filters.py

@@ -426,13 +426,13 @@ def format_snippet(text, trunc_words=25):
     full = keep_spacing(collapsebr(linebreaksbr(mark_safe(sanitize_fragment(text)))))
     snippet = truncatewords_html(full, trunc_words)
     if snippet != full:
-        return mark_safe('<div class="snippet">%s<button class="btn btn-xs btn-default show-all"><span class="bi bi-caret-down"></span></button></div><div class="hidden full">%s</div>' % (snippet, full))
+        return mark_safe('<div class="snippet">%s<button class="btn btn-sm btn-primary show-all"><i class="bi bi-caret-down"></i></button></div><div class="hidden full">%s</div>' % (snippet, full))
     return full
 
 @register.simple_tag
 def doc_edit_button(url_name, *args, **kwargs):
     """Given URL name/args/kwargs, looks up the URL just like "url" tag and returns a properly formatted button for the document material tables."""
-    return mark_safe('<a class="btn btn-default btn-xs" href="%s">Edit</a>' % (urlreverse(url_name, args=args, kwargs=kwargs)))
+    return mark_safe('<a class="btn btn-primary btn-sm" role="button" href="%s">Edit</a>' % (urlreverse(url_name, args=args, kwargs=kwargs)))
 
 @register.filter
 def textify(text):

ietf/doc/tests.py

@@ -2103,9 +2103,9 @@ class DocumentMeetingTests(TestCase):
         self.assertEqual(response.status_code, 200)
         q = PyQuery(response.content)
         self.assertTrue(q('#addsessionsbutton'))
-        self.assertEqual(1,len(q("#inprogressmeets a.btn-default:contains('Remove document')")))
-        self.assertEqual(1,len(q("#futuremeets a.btn-default:contains('Remove document')")))
-        self.assertEqual(1,len(q("#pastmeets a.btn-default:contains('Remove document')")))
+        self.assertEqual(1,len(q("#inprogressmeets a.btn-primary:contains('Remove document')")))
+        self.assertEqual(1,len(q("#futuremeets a.btn-primary:contains('Remove document')")))
+        self.assertEqual(1,len(q("#pastmeets a.btn-primary:contains('Remove document')")))
         self.assertEqual(1,len(q("#pastmeets a.btn-warning:contains('Remove document')")))
 
         self.client.login(username=self.group_chair.user.username,password='%s+password'%self.group_chair.user.username)
@@ -2113,9 +2113,9 @@ class DocumentMeetingTests(TestCase):
         self.assertEqual(response.status_code, 200)
         q = PyQuery(response.content)
         self.assertTrue(q('#addsessionsbutton'))
-        self.assertEqual(1,len(q("#inprogressmeets a.btn-default:contains('Remove document')")))
-        self.assertEqual(1,len(q("#futuremeets a.btn-default:contains('Remove document')")))
-        self.assertEqual(1,len(q("#pastmeets a.btn-default:contains('Remove document')")))
+        self.assertEqual(1,len(q("#inprogressmeets a.btn-primary:contains('Remove document')")))
+        self.assertEqual(1,len(q("#futuremeets a.btn-primary:contains('Remove document')")))
+        self.assertEqual(1,len(q("#pastmeets a.btn-primary:contains('Remove document')")))
         self.assertTrue(q('#pastmeets'))
         self.assertFalse(q("#pastmeets a.btn-warning:contains('Remove document')"))
 

ietf/liaisons/widgets.py

@@ -37,8 +37,8 @@ class ShowAttachmentsWidget(Widget):
         if value and isinstance(value, QuerySet):
             for attachment in value:
                 html += '<a class="initialAttach" href="%s">%s</a>&nbsp' % (conditional_escape(attachment.document.get_href()), conditional_escape(attachment.document.title))
-                html += '<a class="btn btn-default btn-xs" href="{}">Edit</a>&nbsp'.format(urlreverse("ietf.liaisons.views.liaison_edit_attachment", kwargs={'object_id':attachment.statement.pk,'doc_id':attachment.document.pk}))
-                html += '<a class="btn btn-default btn-xs" href="{}">Delete</a>&nbsp'.format(urlreverse("ietf.liaisons.views.liaison_delete_attachment", kwargs={'object_id':attachment.statement.pk,'attach_id':attachment.pk}))
+                html += '<a class="btn btn-primary btn-sm" href="{}">Edit</a>&nbsp'.format(urlreverse("ietf.liaisons.views.liaison_edit_attachment", kwargs={'object_id':attachment.statement.pk,'doc_id':attachment.document.pk}))
+                html += '<a class="btn btn-primary btn-sm" href="{}">Delete</a>&nbsp'.format(urlreverse("ietf.liaisons.views.liaison_delete_attachment", kwargs={'object_id':attachment.statement.pk,'attach_id':attachment.pk}))
                 html += '<br />'
         else:
             html += 'No files attached'

ietf/static/css/list.scss

@@ -6,7 +6,6 @@
 
 table .sort {
     white-space: nowrap;
-    padding-right: .5em;
     cursor: pointer;
 }
 
@@ -18,6 +17,7 @@ table .sort:hover {
 table .sort:before {
     font-family: 'bootstrap-icons';
     content: '\f127';
+    padding-right: .25em;
 }
 
 table .sort.asc:before {

ietf/static/js/list.js

@@ -6,10 +6,10 @@ function text_sort(a, b, options) {
     return dummy.utils.naturalSort.caseInsensitive($($.parseHTML(a.values()[options.valueName]))
         .text()
         .trim()
-        .replaceAll(/\w+/g, ' '), $($.parseHTML(b.values()[options.valueName]))
+        .replaceAll(/\s+/g, ' '), $($.parseHTML(b.values()[options.valueName]))
         .text()
         .trim()
-        .replaceAll(/\w+/g, ' '));
+        .replaceAll(/\s+/g, ' '));
 }
 
 $(document)

ietf/templates/base.html

@@ -123,7 +123,7 @@
 
         {% block js %}{% endblock js %}
         {% if debug %}
-            <script src="{% static 'ietf/js/datatables.js' %}"></script>
+            <script src="{% static 'ietf/js/list.js' %}"></script>
         {% endif %}
     </body>
 

ietf/templates/community/manage_list.html

@@ -36,7 +36,7 @@
                             <form method="post" id="remove_document_{{d.pk}}">
                                 {% csrf_token %}
                                 <input type="hidden" name="document" value="{{ d.pk }}">
-                                <button class="btn btn-danger btn-xs" name="action" value="remove_document">Remove</button>
+                                <button class="btn btn-danger btn-sm" name="action" value="remove_document">Remove</button>
                             </form>
                         </td>
                     </tr>
@@ -91,7 +91,7 @@
                             <form method="post">
                                 {% csrf_token %}
                                 <input type="hidden" name="rule" value="{{ rule.pk }}">
-                                <button class="btn btn-danger btn-xs" name="action" value="remove_rule">Remove</button>
+                                <button class="btn btn-danger btn-sm" name="action" value="remove_rule">Remove</button>
                             </form>
                         </td>
                     </tr>

ietf/templates/debug.html

@@ -9,7 +9,7 @@
             <p>
                 {{ sql_queries|length }} queries ({{ sql_queries|timesum }}s)
                 {% if sql_queries|length != 0 %}
-                    <a class="btn btn-primary btn-xs"
+                    <a class="btn btn-primary btn-sm"
                         onclick="$('#debug-query-table').toggleClass('hide');">Show</a>
                 {% endif %}
             </p>
@@ -36,7 +36,7 @@
                                 <td>
                                     {{ query.loc }}
                                     {% if query.origin %}
-                                        <button type="button" class="btn btn-primary btn-xs" data-bs-toggle="modal" data-bs-target="#modal-{{forloop.counter}}" >Origin</button>
+                                        <button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#modal-{{forloop.counter}}" >Origin</button>
                                     {% endif %}
                                     <div class="modal fade" id="modal-{{forloop.counter}}" tabindex="-1" role="dialog" aria-labelledby="modal-title-{{forloop.counter}}">
                                         <div class="modal-dialog modal-max" role="document">

ietf/templates/doc/add_comment.html

@@ -8,19 +8,17 @@
 
 {% block content %}
     {% origin %}
-    <h1>Add comment<br><small>{{ doc }}</small></h1>
+    <h1>Add comment<br><small class="text-muted">{{ doc }}</small></h1>
 
     <form method="post">
         {% csrf_token %}
         {% bootstrap_form form %}
         <p class="help-block">The comment will be added to the history trail.</p>
 
-
-
-        <button type="submit" class="btn btn-primary">Submit</button>
-        <a class="btn btn-primary float-end" href="{% url "ietf.doc.views_doc.document_main" name=doc.name %}">Back</a>
+        {% bootstrap_button button_type="submit" content="Submit" %}
+        <a class="btn btn-secondary float-end" href="{% url "ietf.doc.views_doc.document_main" name=doc.name %}">Back</a>
 
 
     </form>
 
-{% endblock %}
+{% endblock %}

ietf/templates/doc/document_ballot_content.html

@@ -78,7 +78,7 @@
                             {% if p.old_positions %}<span class="text-muted small">(was {{ p.old_positions|join:", " }})</span>{% endif %}
                             <span class="badge bg-{{ p.pos|pos_to_label }}">{{p.pos}}</span>
                             {% if user|has_role:"Secretariat" %}
-                                <a href="{% url "ietf.doc.views_ballot.edit_position" name=doc.name ballot_id=ballot.pk %}?balloter={{ p.balloter.pk }}" title="Click to edit the position of {{ p.balloter.plain_name }}" class="btn btn-primary btn-xs">Edit</a>
+                                <a href="{% url "ietf.doc.views_ballot.edit_position" name=doc.name ballot_id=ballot.pk %}?balloter={{ p.balloter.pk }}" title="Click to edit the position of {{ p.balloter.plain_name }}" class="btn btn-primary btn-sm">Edit</a>
                             {% endif %}
                         </span>
                     </h4>
@@ -132,7 +132,7 @@
                             {% if p.old_positions %}<span class="text-muted small">(was {{ p.old_positions|join:", " }})</span>{% endif %}
                             <span class="badge bg-{{ p.pos|pos_to_label }}">{{p.pos}}</span>
                             {% if user|has_role:"Secretariat" %}
-                                <a href="{% url "ietf.doc.views_ballot.edit_position" name=doc.name ballot_id=ballot.pk %}?balloter={{ p.balloter.pk }}" title="Click to edit the position of {{ p.balloter.plain_name }}" class="btn btn-primary btn-xs">Edit</a>
+                                <a href="{% url "ietf.doc.views_ballot.edit_position" name=doc.name ballot_id=ballot.pk %}?balloter={{ p.balloter.pk }}" title="Click to edit the position of {{ p.balloter.plain_name }}" class="btn btn-primary btn-sm">Edit</a>
                             {% endif %}
                         </span>
                     </h4>

ietf/templates/doc/document_bofreq.html

@@ -117,7 +117,7 @@
                         <th>Additional Resources</th>
                         <td class="edit">
                             {% if editor_can_manage or can_manage %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.edit_doc_extresources' name=doc.name %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.edit_doc_extresources' name=doc.name %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>

ietf/templates/doc/document_conflict_review.html

@@ -59,7 +59,7 @@
                 <th><a href="{% url 'ietf.doc.views_help.state_help' type='conflict-review' %}">State</a></th>
                 <td class="edit">
                     {% if not snapshot and user|has_role:"Area Director,Secretariat" %}
-                        <a title="{{ doc.get_state.desc }}" class="btn btn-primary btn-xs float-end" href="{% url 'ietf.doc.views_conflict_review.change_state' name=doc.name %}">Edit</a>
+                        <a title="{{ doc.get_state.desc }}" class="btn btn-primary btn-sm float-end" href="{% url 'ietf.doc.views_conflict_review.change_state' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -74,7 +74,7 @@
                 <th>Shepherding AD</th>
                 <td class="edit">
                     {% if not snapshot and user|has_role:"Area Director,Secretariat" and doc.get_state_slug not in approved_states %}
-                        <a class="btn btn-primary btn-xs float-end" href="{% url 'ietf.doc.views_conflict_review.edit_ad' name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm float-end" href="{% url 'ietf.doc.views_conflict_review.edit_ad' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -88,7 +88,7 @@
                     <th>Telechat date</th>
                     <td class="edit">
                         {% if not snapshot and user|has_role:"Area Director,Secretariat" and doc.get_state_slug not in approved_states %}
-                            <a class="btn btn-primary btn-xs float-end" href="{% url 'ietf.doc.views_doc.telechat_date;conflict-review' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm float-end" href="{% url 'ietf.doc.views_doc.telechat_date;conflict-review' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -111,7 +111,7 @@
                 <th>Send notices to</th>
                 <td class="edit">
                     {% if not snapshot and user|has_role:"Area Director,Secretariat" and doc.get_state_slug not in approved_states %}
-                        <a class="btn btn-primary btn-xs float-end" href="{% url 'ietf.doc.views_doc.edit_notify;conflict-review' name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm float-end" href="{% url 'ietf.doc.views_doc.edit_notify;conflict-review' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>

ietf/templates/doc/document_draft.html

@@ -74,7 +74,7 @@
                 <th>Author{{doc.authors|pluralize}}</th>
                 <td class="edit">
                     {% if can_edit_authors %}
-                        <a class="btn btn-primary btn-xs" href="{%  url 'ietf.doc.views_doc.edit_authors' name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm" href="{%  url 'ietf.doc.views_doc.edit_authors' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -110,7 +110,7 @@
                     <th>Replaces</th>
                     <td class="edit">
                         {% if can_edit_stream_info and not snapshot %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.replaces' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.replaces' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -137,7 +137,7 @@
                         <th>Possibly Replaces</th>
                         <td class="edit">
                             {% if can_edit_replaces and not snapshot %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.review_possibly_replaces' name=doc.name %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.review_possibly_replaces' name=doc.name %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -152,7 +152,7 @@
                         <th>Possibly Replaced By</th>
                         <td class="edit">
                             {% if can_edit_replaces and not snapshot %}
-                                {% comment %}<a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.review_possibly_replaces' name=doc.name %}">Edit</a>{% endcomment %}
+                                {% comment %}<a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.review_possibly_replaces' name=doc.name %}">Edit</a>{% endcomment %}
                             {% endif %}
                         </td>
                         <td>
@@ -167,7 +167,7 @@
                 <th>Stream</th>
                 <td class="edit">
                     {% if can_change_stream and not snapshot %}
-                        <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.change_stream' name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.change_stream' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -182,7 +182,7 @@
                     <th>Intended RFC status</th>
                     <td class="edit">
                         {% if can_edit_stream_info and not snapshot %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.change_intention' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.change_intention' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -199,7 +199,7 @@
                     {% if doc.get_state_slug != "active" and doc.get_state_slug != "rfc" %}<div class="float-end badge bg-warning">Expired & archived</div>{% endif %}
                     {% if file_urls %}
                         {% for label, url in file_urls %}
-                            <a class="btn btn-primary btn-xs" href="{{ url }}">
+                            <a class="btn btn-primary btn-sm" href="{{ url }}">
                                 <span class="bi bi-file-{% if label == "pdf" %}pdf-{% elif label == "xml" or label == "html" %}code-{% elif label == "plain text" %}text-{% endif %}o"></span>
                                 {{ label }}</a>
                         {% endfor %}
@@ -249,11 +249,11 @@
 
                         {% if can_request_review %}
                             <div>
-                                <a class="btn btn-primary btn-xs" href="{% url "ietf.doc.views_review.request_review" doc.name %}"><span class="bi bi-check-circle-o"></span> Request review</a>
+                                <a class="btn btn-primary btn-sm" href="{% url "ietf.doc.views_review.request_review" doc.name %}"><span class="bi bi-check-circle-o"></span> Request review</a>
                                 {% if can_submit_unsolicited_review_for_teams|length == 1 %}
-                                    <a class="btn btn-primary btn-xs" href="{% url "ietf.doc.views_review.complete_review" doc.name can_submit_unsolicited_review_for_teams.0.acronym %}"><span class="bi bi-pencil-square-o"></span> Submit unsolicited review</a>
+                                    <a class="btn btn-primary btn-sm" href="{% url "ietf.doc.views_review.complete_review" doc.name can_submit_unsolicited_review_for_teams.0.acronym %}"><span class="bi bi-pencil-square-o"></span> Submit unsolicited review</a>
                                 {% elif can_submit_unsolicited_review_for_teams %}
-                                    <a class="btn btn-primary btn-xs" href="{% url "ietf.doc.views_review.submit_unsolicited_review_choose_team" doc.name %}"><span class="bi bi-pencil-square-o"></span> Submit unsolicited review</a>
+                                    <a class="btn btn-primary btn-sm" href="{% url "ietf.doc.views_review.submit_unsolicited_review_choose_team" doc.name %}"><span class="bi bi-pencil-square-o"></span> Submit unsolicited review</a>
                                 {% endif %}
                             </div>
                         {% endif %}
@@ -278,7 +278,7 @@
                         <th>Additional Resources</th>
                         <td class="edit">
                             {% if can_edit_stream_info or can_edit_individual %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.edit_doc_extresources' name=doc.name %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.edit_doc_extresources' name=doc.name %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -319,7 +319,7 @@
                     </th>
                     <td class="edit">
                         {% if doc.stream and can_edit_stream_info and doc.stream.slug != "legacy" and not snapshot %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.change_stream_state' name=doc.name state_type=stream_state_type_slug %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.change_stream_state' name=doc.name state_type=stream_state_type_slug %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -350,7 +350,7 @@
                     <th>Consensus Boilerplate</th>
                     <td class="edit">
                         {% if can_edit_stream_info and not snapshot %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.edit_consensus' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.edit_consensus' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -392,9 +392,9 @@
                     <td class="edit">
 
                         {% if can_edit_stream_info and not snapshot %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.edit_shepherd' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.edit_shepherd' name=doc.name %}">Edit</a>
                         {% elif is_shepherd %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.change_shepherd_email' name=doc.name %}">Change Email</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.change_shepherd_email' name=doc.name %}">Change Email</a>
                         {% endif %}
                     </td>
                     <td>
@@ -410,13 +410,13 @@
                             {% if can_edit_shepherd_writeup %}
                                 {% url 'ietf.doc.views_draft.edit_shepherd_writeup' name=doc.name as doc_edit_url %}
                                 {% if doc_edit_url %}
-                                    <a class="btn btn-primary btn-xs" href="{{doc_edit_url}}">Edit</a>
+                                    <a class="btn btn-primary btn-sm" href="{{doc_edit_url}}">Edit</a>
                                 {% endif %}
                             {% endif %}
                         </td>
                         <td>
                             {% if shepherd_writeup %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.document_shepherd_writeup' name=doc.name %}">Show</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.document_shepherd_writeup' name=doc.name %}">Show</a>
                                 (last changed {{ shepherd_writeup.time|date:"Y-m-d"}})
                             {% else %}
                                 (None)
@@ -430,7 +430,7 @@
                     <th>RFC Editor Note</th>
                     <td class="edit">
                         {% if can_edit_stream_info %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_ballot.ballot_rfceditornote' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_ballot.ballot_rfceditornote' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -455,7 +455,7 @@
                     <th><a href="{% url "ietf.help.views.state" doc=doc.type.slug type="iesg" %}">IESG state</a></th>
                     <td class="edit">
                         {% if iesg_state.slug != 'idexists' and can_edit %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.change_state' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.change_state' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -469,7 +469,7 @@
                         <th>Action Holders</th>
                         <td class="edit">
                             {% if can_edit %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.edit_action_holders' name=doc.name %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.edit_action_holders' name=doc.name %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -478,7 +478,7 @@
                                     {% for action_holder in doc.documentactionholder_set.all %}
                                         <div>{% person_link action_holder.person title=action_holder.role_for_doc %} {{ action_holder|action_holder_badge }}</div>
                                     {% endfor %}
-                                    {% if can_edit %}<a class="btn btn-primary btn-xs" href="{% url "ietf.doc.views_doc.remind_action_holders" name=doc.name %}"><span class="bi bi-envelope"></span> Send reminder email </a>{% endif %}
+                                    {% if can_edit %}<a class="btn btn-primary btn-sm" href="{% url "ietf.doc.views_doc.remind_action_holders" name=doc.name %}"><span class="bi bi-envelope"></span> Send reminder email </a>{% endif %}
                                 {% else %}
                                     (None)
                                 {% endif %}
@@ -492,7 +492,7 @@
                         <th>Consensus Boilerplate</th>
                         <td class="edit">
                             {% if can_edit or can_edit_stream_info and not snapshot %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.edit_consensus' name=doc.name %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.edit_consensus' name=doc.name %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -506,7 +506,7 @@
                     <th>Telechat date</th>
                     <td class="edit">
                         {% if can_edit and not snapshot %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.telechat_date' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.telechat_date' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -532,7 +532,7 @@
                     <th>Responsible AD</th>
                     <td class="edit">
                         {% if can_edit %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.edit_ad' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.edit_ad' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -547,7 +547,7 @@
                             <th>IESG note</th>
                             <td class="edit">
                                 {% if can_edit and not snapshot %}
-                                    <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.edit_iesg_note' name=doc.name %}">Edit</a>
+                                    <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.edit_iesg_note' name=doc.name %}">Edit</a>
                                 {% endif %}
                             </td>
                             <td>
@@ -562,7 +562,7 @@
                     <th>Send notices to</th>
                     <td class="edit">
                         {% if can_edit_notify and not snapshot %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.edit_notify' name=doc.name %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.edit_notify' name=doc.name %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -581,7 +581,7 @@
                         <th><a href="{% url "ietf.help.views.state" doc=doc.type.slug type="iana-review" %}">IANA review state</a></th>
                         <td class="edit">
                             {% if can_edit_iana_state and not snapshot %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.change_iana_state' name=doc.name state_type="iana-review" %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.change_iana_state' name=doc.name state_type="iana-review" %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -596,7 +596,7 @@
                         <th><a href="{% url "ietf.help.views.state" doc=doc.type.slug type="iana-action" %}">IANA action state</a></th>
                         <td class="edit">
                             {% if can_edit_iana_state and not snapshot %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.change_iana_state' name=doc.name state_type="iana-action" %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.change_iana_state' name=doc.name state_type="iana-action" %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -611,7 +611,7 @@
                         <th><a href="{% url "ietf.help.views.state" doc=doc.type.slug type="iana-experts" %}">IANA expert review state</a></th>
                         <td class="edit">
                             {% if can_edit_iana_state and not snapshot %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.change_iana_state' name=doc.name state_type="iana-experts" %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.change_iana_state' name=doc.name state_type="iana-experts" %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -626,7 +626,7 @@
                         <th>IANA expert review comments</th>
                         <td class="edit">
                             {% if can_edit_iana_state and not snapshot %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_draft.add_iana_experts_comment' name=doc.name %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_draft.add_iana_experts_comment' name=doc.name %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -674,16 +674,16 @@
     </table>
 
     <div class="buttonlist">
-        <a class="btn btn-primary btn-xs" href="mailto:{{ doc.name }}@ietf.org?subject=Mail%20regarding%20{{ doc.name }}"><span class="bi bi-envelope"></span> Email authors</a>
+        <a class="btn btn-primary btn-sm" href="mailto:{{ doc.name }}@ietf.org?subject=Mail%20regarding%20{{ doc.name }}"><span class="bi bi-envelope"></span> Email authors</a>
         {% if doc.group.type.slug == 'wg' or doc.group.type.slug == 'rg' %}
-            <a class="btn btn-primary btn-xs" href="mailto:{{ doc.group.list_email}}?subject=Mail%20regarding%20{{ doc.name }}"><span class="bi bi-envelope"></span> Email {{ doc.group.type }}</a>
+            <a class="btn btn-primary btn-sm" href="mailto:{{ doc.group.list_email}}?subject=Mail%20regarding%20{{ doc.name }}"><span class="bi bi-envelope"></span> Email {{ doc.group.type }}</a>
         {% endif %}
-        <a class="btn btn-primary btn-xs" href="{% url "ietf.ipr.views.search" %}?submit=draft&amp;id={{ doc.name }}" rel="nofollow"><span class="bi bi-lightning"></span> IPR {% if doc.related_ipr %} <span class="badge">{{doc.related_ipr|length}}</span>{% endif %}</a>
-        <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.document_references' doc.canonical_name %}" rel="nofollow"><span class="bi bi-arrow-left"></span> References</a>
-        <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.document_referenced_by' doc.canonical_name %}" rel="nofollow"><span class="bi bi-arrow-right"></span> Referenced by</a>
-        <a class="btn btn-primary btn-xs" href="{{settings.IDNITS_BASE_URL}}?url=https://www.ietf.org/archive/id/{{ doc.filename_with_rev }}" rel="nofollow" target="_blank"><span class="bi bi-exclamation"></span> Nits</a>
+        <a class="btn btn-primary btn-sm" href="{% url "ietf.ipr.views.search" %}?submit=draft&amp;id={{ doc.name }}" rel="nofollow"><span class="bi bi-lightning"></span> IPR {% if doc.related_ipr %} <span class="badge">{{doc.related_ipr|length}}</span>{% endif %}</a>
+        <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.document_references' doc.canonical_name %}" rel="nofollow"><span class="bi bi-arrow-left"></span> References</a>
+        <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.document_referenced_by' doc.canonical_name %}" rel="nofollow"><span class="bi bi-arrow-right"></span> Referenced by</a>
+        <a class="btn btn-primary btn-sm" href="{{settings.IDNITS_BASE_URL}}?url=https://www.ietf.org/archive/id/{{ doc.filename_with_rev }}" rel="nofollow" target="_blank"><span class="bi bi-exclamation"></span> Nits</a>
         <div class="dropdown inline">
-            <button class="btn btn-primary btn-xs dropdown-toggle" type="button" id="ddSearchMenu" data-bs-toggle="dropdown" aria-expanded="true">
+            <button class="btn btn-primary btn-sm dropdown-toggle" type="button" id="ddSearchMenu" data-bs-toggle="dropdown" aria-expanded="true">
                 <span class="bi bi-search"></span> Search lists <span class="caret"></span>
             </button>
             <ul class="dropdown-menu" role="menu">
@@ -695,23 +695,23 @@
             </ul>
         </div>
         {% if user.is_authenticated %}
-            <a class="btn btn-primary btn-xs track-untrack-doc {% if not doc.tracked_in_personal_community_list %}hide{% endif %}" href="{% url "ietf.community.views.untrack_document" username=user.username name=doc.name %}" title="Remove from your personal ID list"><span class="bi bi-bookmark-check-fill"></span> Untrack</a>
-            <a class="btn btn-primary btn-xs track-untrack-doc {% if doc.tracked_in_personal_community_list %}hide{% endif %}" href="{% url "ietf.community.views.track_document" username=user.username name=doc.name %}" title="Add to your personal ID list"><span class="bi bi-bookmark"></span> Track</a>
+            <a class="btn btn-primary btn-sm track-untrack-doc {% if not doc.tracked_in_personal_community_list %}hide{% endif %}" href="{% url "ietf.community.views.untrack_document" username=user.username name=doc.name %}" title="Remove from your personal ID list"><span class="bi bi-bookmark-check-fill"></span> Untrack</a>
+            <a class="btn btn-primary btn-sm track-untrack-doc {% if doc.tracked_in_personal_community_list %}hide{% endif %}" href="{% url "ietf.community.views.track_document" username=user.username name=doc.name %}" title="Add to your personal ID list"><span class="bi bi-bookmark"></span> Track</a>
         {% endif %}
         {% if user.review_teams %}
-            <a class="btn btn-primary btn-xs review-wish-add-remove-doc ajax {% if not doc.has_review_wish %}hide{% endif %}" href="{% url "ietf.doc.views_review.review_wishes_remove" name=doc.name %}?next={{ request.get_full_path|urlencode }}" title="Remove from your review wishes for all teams"><span class="bi bi-chats"></span> Remove review wishes</a>
-            <a class="btn btn-primary btn-xs review-wish-add-remove-doc {% if user.review_teams|length_is:"1" %}ajax {% endif %}{% if doc.has_review_wish %}hide{% endif %}" href="{% url "ietf.doc.views_review.review_wish_add" name=doc.name %}?next={{ request.get_full_path|urlencode }}" title="Add to your review wishes"><span class="bi bi-chats-o"></span> Add review wish</a>
+            <a class="btn btn-primary btn-sm review-wish-add-remove-doc ajax {% if not doc.has_review_wish %}hide{% endif %}" href="{% url "ietf.doc.views_review.review_wishes_remove" name=doc.name %}?next={{ request.get_full_path|urlencode }}" title="Remove from your review wishes for all teams"><span class="bi bi-chats"></span> Remove review wishes</a>
+            <a class="btn btn-primary btn-sm review-wish-add-remove-doc {% if user.review_teams|length_is:"1" %}ajax {% endif %}{% if doc.has_review_wish %}hide{% endif %}" href="{% url "ietf.doc.views_review.review_wish_add" name=doc.name %}?next={{ request.get_full_path|urlencode }}" title="Add to your review wishes"><span class="bi bi-chats-o"></span> Add review wish</a>
         {% endif %}
 
         {% if can_edit and iesg_state.slug != 'idexists' %}
-            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_ballot.lastcalltext' name=doc.name %}">Last call text</a>
-            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_ballot.ballot_writeupnotes' name=doc.name %}">Ballot text</a>
-            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_ballot.ballot_approvaltext' name=doc.name %}">Announcement text</a>
+            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_ballot.lastcalltext' name=doc.name %}">Last call text</a>
+            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_ballot.ballot_writeupnotes' name=doc.name %}">Ballot text</a>
+            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_ballot.ballot_approvaltext' name=doc.name %}">Announcement text</a>
         {% endif %}
 
         {% if actions %}
             {% for label, url in actions %}
-                <a class="btn btn-primary btn-xs" href="{{ url }}">{{ label|capfirst_allcaps }}</a>
+                <a class="btn btn-primary btn-sm" href="{{ url }}">{{ label|capfirst_allcaps }}</a>
             {% endfor %}
         {% endif %}
     </div>

ietf/templates/doc/document_email.html

@@ -5,7 +5,7 @@
 {% load static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Email expansions for {{ doc.name }}-{{ doc.rev }}{% endblock %}
@@ -20,17 +20,17 @@
         <table class="table table-sm table-striped tablesorter">
             <thead>
                 <tr>
-                    <th>Alias</th>
-                    <th>Expansion</th>
+                    <th data-sort="alias">Alias</th>
+                    <th data-sort="expansion">Expansion</th>
                 </tr>
             </thead>
             <tbody>
                 {% for alias in aliases %}
                     <tr>
-                        <td>
+                        <td class="alias">
                             <a href="mailto:{{ doc.name }}{{ alias.alias_type|default:''}}@{{ietf_domain}}">
                                 {{ doc.name }}{{ alias.alias_type|default:''}}@{{ietf_domain}}</a></td>
-                        <td>{{ alias.expansion }}</td>
+                        <td class="expansion">{{ alias.expansion }}</td>
                     </tr>
                 {% endfor %}
             </tbody>
@@ -42,18 +42,18 @@
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>Mail trigger</th>
-                <th>To</th>
-                <th>Cc</th>
+                <th data-sort="trigger">Mail trigger</th>
+                <th data-sort="to">To</th>
+                <th data-sort="cc">Cc</th>
             </tr>
         </thead>
         <tbody>
             {% for trigger,desc,to,cc in expansions %}
                 <tr>
-                    <td><a href="{% url 'ietf.mailtrigger.views.show_triggers' trigger %}"
+                    <td class="trigger"><a href="{% url 'ietf.mailtrigger.views.show_triggers' trigger %}"
                         title="{{desc}}">{{trigger}}</a></td>
-                    <td> {{to|join:', '}}</td>
-                    <td> {{cc|join:', '}}</td>
+                    <td class="to"> {{to|join:', '}}</td>
+                    <td class="cc"> {{cc|join:', '}}</td>
                 </tr>
             {% endfor %}
         </tbody>
@@ -61,5 +61,5 @@
 {% endblock content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/document_history.html

@@ -6,13 +6,9 @@
 
 {% block title %}History for {{ doc.name }}{% if doc.rev %}-{{ doc.rev }}{% endif %}{% endblock %}
 
-{% block morecss %}
-    form.diff-form button[type=submit] { margin-left: 2em; }
-{% endblock %}
-
 {% block pagehead %}
     <link rel="alternate" type="application/atom+xml" href="/feed/document-changes/{{ doc.name }}/" />
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block content %}
@@ -24,10 +20,8 @@
 
         <form class="form-horizontal diff-form" action="{{rfcdiff_base_url}}" method="get" target="_blank">
 
-            <div class="form-group">
-                <div class="col-sm-2 ">
-                    <label for="url1" class="control-label">From revision</label>
-                </div>
+            <div class="row mb-3">
+                <label for="url1" class="col-form-label col-sm-2">From revision</label>
                 <div class="col-sm-10">
                     <select class="form-control" id="url1" name="url1">
                         {% for name, rev, time, url in diff_revisions %}
@@ -45,10 +39,8 @@
                 </div>
             </div>
 
-            <div class="form-group">
-                <div class="col-sm-2 ">
-                    <label for="url2" class="control-label">To revision</label>
-                </div>
+            <div class="row mb-3">
+                <label for="url2" class="col-form-label col-sm-2">To revision</label>
                 <div class="col-sm-10">
                     <select class="form-control" id="url2" name="url2">
                         {% for name, rev, time, url in diff_revisions %}
@@ -66,29 +58,23 @@
                 </div>
             </div>
 
-            <div class="form-group">
-                <div class="col-sm-2 ">
-                    <label class="control-label">Diff format</label>
-                </div>
+            <div class="row mb-3">
+                <label class="col-form-label col-sm-2">Diff format</label>
                 <div class="col-sm-10">
                     <div class="btn-group" data-bs-toggle="buttons">
-                        <label class="btn btn-primary active">
-                            <input type="radio" name="difftype" value="--html"> Side-by-side
-                        </label>
-                        <label class="btn btn-primary">
-                            <input type="radio" name="difftype" value="--abdiff"> Before-after
-                        </label>
-                        <label class="btn btn-primary">
-                            <input type="radio" name="difftype" value="--chbars"> Change bars
-                        </label>
-                        <label class="btn btn-primary">
-                            <input type="radio" name="difftype" value="--hwdiff"> Wdiff
-                        </label>
+                        <input type="radio" class="btn-check" checked name="difftype" value="--html" id="html">
+                        <label for="html"class="btn btn-outline-primary">Side-by-side</label>
+                        <input type="radio" class="btn-check" name="difftype" value="--abdiff" id="abdiff">
+                        <label for="abdiff"class="btn btn-outline-primary">Before-after</label>
+                        <input type="radio" class="btn-check" name="difftype" value="--chbars" id="chbars">
+                        <label for="chbars"class="btn btn-outline-primary">Change bars</label>
+                        <input type="radio" class="btn-check" name="difftype" value="--hwdiff" id="hwdiff">
+                        <label for="hwdiff"class="btn btn-outline-primary">Wdiff</label>
                     </div>
-
-                    <button type="submit" class="btn btn-primary">Submit</button>
                 </div>
             </div>
+
+                <button type="submit" class="btn btn-primary mb-3">Submit</button>
         </form>
     {% endif %}
 
@@ -102,20 +88,20 @@
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>Date</th>
-                <th>Rev.</th>
-                <th>By</th>
-                <th>Action</th>
+                <th data-sort="date">Date</th>
+                <th data-sort="rev">Rev.</th>
+                <th data-sort="by">By</th>
+                <th data-sort="action">Action</th>
             </tr>
         </thead>
 
         <tbody>
             {% for e in events %}
                 <tr class="anchor-target" id="history-{{ e.pk }}">
-                    <td class="text-nowrap"><div title="{{ e.time|date:'Y-m-d H:i:s O' }}">{{ e.time|date:"Y-m-d" }}</div></td>
-                    <td class="text-center">{{ e.rev }}</td>
-                    <td>{{ e.by|escape }}</td>
-                    <td>{{ e.desc|format_history_text|safe }}</td>
+                    <td class="text-nowrap date"><div title="{{ e.time|date:'Y-m-d H:i:s O' }}">{{ e.time|date:"Y-m-d" }}</div></td>
+                    <td class="text-end rev">{{ e.rev }}</td>
+                    <td class="by">{{ e.by|escape }}</td>
+                    <td class="action">{{ e.desc|format_history_text|safe }}</td>
                 </tr>
             {% endfor %}
         </tbody>
@@ -123,5 +109,5 @@
 {% endblock content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/document_referenced_by.html

@@ -3,7 +3,7 @@
 {% load origin static ietf_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}
@@ -32,37 +32,37 @@
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>Document</th>
-                <th>Title</th>
-                <th>Status</th>
-                <th>Type</th>
-                <th>Downref</th>
+                <th data-sort="document">Document</th>
+                <th data-sort="title">Title</th>
+                <th data-sort="status">Status</th>
+                <th data-sort="type">Type</th>
+                <th data-sort="downref">Downref</th>
             </tr>
         </thead>
         <tbody>
             {% for ref in refs %}
                 {% with ref.source.canonical_name as name %}
                     <tr>
-                        <td>
+                        <td class="document">
                             <a href="{% url 'ietf.doc.views_doc.document_main' name=name %}">{{ name|prettystdname }}</a>
                             {% if ref.target.name != alias_name %}
                                 <br><span class="badge bg-info">As {{ref.target.name}}</span>
                             {% endif %}
                         </td>
-                        <td>
+                        <td class="title">
                             <b>{{ref.source.title}}</b><br>
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.document_references' name %}" rel="nofollow"><span class="bi bi-arrow-left"></span> References</a>
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.document_referenced_by' name %}" rel="nofollow"><span class="bi bi-arrow-right"></span> Referenced by</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.document_references' name %}" rel="nofollow"><span class="bi bi-arrow-left"></span> References</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.document_referenced_by' name %}" rel="nofollow"><span class="bi bi-arrow-right"></span> Referenced by</a>
                         </td>
-                        <td>
+                        <td class="status">
                             {% ifequal ref.source.get_state.slug 'rfc' %}
                                 {% with ref.source.std_level as lvl %}{% if lvl %}{{lvl}}{% endif %}{%endwith%}
                             {% else %}
                                 {% with ref.source.intended_std_level as lvl %}{% if lvl %}{{lvl}}{% endif %}{%endwith%}
                             {% endifequal %}
                         </td>
-                        <td>{{ref.relationship.name}}</td>
-                        <td>{{ref.is_downref|default:''}}</td>
+                        <td class="type">{{ref.relationship.name}}</td>
+                        <td class="downref">{{ref.is_downref|default:''}}</td>
                     </tr>
                 {% endwith %}
             {% endfor %}
@@ -71,5 +71,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/document_references.html

@@ -3,7 +3,7 @@
 {% load origin static ietf_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}
@@ -24,32 +24,32 @@
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>Document</th>
-                <th>Title</th>
-                <th>Status</th>
-                <th>Type</th>
-                <th>Downref</th>
+                <th data-sort="document">Document</th>
+                <th data-sort="title">Title</th>
+                <th data-sort="status">Status</th>
+                <th data-sort="type">Type</th>
+                <th data-sort="downref">Downref</th>
             </tr>
         </thead>
         <tbody>
             {% for ref in refs %}
                 {% with ref.target.name as name %}
                     <tr>
-                        <td><a href="{% url 'ietf.doc.views_doc.document_main' name=name %}">{{ name|prettystdname }}</a></td>
-                        <td>
+                        <td class="document"><a href="{% url 'ietf.doc.views_doc.document_main' name=name %}">{{ name|prettystdname }}</a></td>
+                        <td class="title">
                             <b>{{ref.target.document.title}}</b><br>
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.document_references' name %}" rel="nofollow"><span class="bi bi-arrow-left"></span> References</a>
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.doc.views_doc.document_referenced_by' name %}" rel="nofollow"><span class="bi bi-arrow-right"></span> Referenced by</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.document_references' name %}" rel="nofollow"><span class="bi bi-arrow-left"></span> References</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.doc.views_doc.document_referenced_by' name %}" rel="nofollow"><span class="bi bi-arrow-right"></span> Referenced by</a>
                         </td>
-                        <td>
+                        <td class="status">
                             {% ifequal ref.target.document.get_state.slug 'rfc' %}
                                 {% with ref.target.document.std_level as lvl %}{% if lvl %}{{lvl}}{% endif %}{%endwith%}
                             {% else %}
                                 {% with ref.target.document.intended_std_level as lvl %}{% if lvl %}{{lvl}}{% endif %}{%endwith%}
                             {% endifequal %}
                         </td>
-                        <td>{{ref.relationship.name}}</td>
-                        <td>{{ref.is_downref|default:''}}</td>
+                        <td class="type">{{ref.relationship.name}}</td>
+                        <td class="downref">{{ref.is_downref|default:''}}</td>
                     </tr>
                 {% endwith %}
             {% endfor %}
@@ -58,5 +58,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/document_status_change.html

@@ -36,7 +36,7 @@
                 </th>
                 <td class="edit">
                     {% if not snapshot and user|has_role:"Area Director,Secretariat" and doc.get_state_slug not in approved_states %}
-                        <a class="btn btn-primary btn-xs float-end" href="{% url 'ietf.doc.views_status_change.edit_title' name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm float-end" href="{% url 'ietf.doc.views_status_change.edit_title' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -70,7 +70,7 @@
                 <th><a href="{% url 'ietf.doc.views_help.state_help' type="status-change" %}">State</a></th>
                 <td class="edit">
                     {% if not snapshot and user|has_role:"Area Director,Secretariat" %}
-                        <a class="btn btn-primary btn-xs float-end" href="{% url "ietf.doc.views_status_change.change_state" name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm float-end" href="{% url "ietf.doc.views_status_change.change_state" name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -85,7 +85,7 @@
                 <th>Telechat date</th>
                 <td class="edit">
                     {% if not snapshot and user|has_role:"Area Director,Secretariat" and doc.get_state_slug not in approved_states %}
-                        <a class="btn btn-primary btn-xs float-end" href="{% url 'ietf.doc.views_doc.telechat_date;status-change' name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm float-end" href="{% url 'ietf.doc.views_doc.telechat_date;status-change' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -107,7 +107,7 @@
                 <th>Shepherding AD</th>
                 <td class="edit">
                     {% if not snapshot and user|has_role:"Area Director,Secretariat" and doc.get_state_slug not in approved_states %}
-                        <a class="btn btn-primary btn-xs float-end" href="{% url 'ietf.doc.views_status_change.edit_ad' name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm float-end" href="{% url 'ietf.doc.views_status_change.edit_ad' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -120,7 +120,7 @@
                 <th>Send notices to</th>
                 <td class="edit">
                     {% if not snapshot and user|has_role:"Area Director,Secretariat" and doc.get_state_slug not in approved_states %}
-                        <a class="btn btn-primary btn-xs float-end" href="{% url 'ietf.doc.views_doc.edit_notify;status-change' name=doc.name %}">Edit</a>
+                        <a class="btn btn-primary btn-sm float-end" href="{% url 'ietf.doc.views_doc.edit_notify;status-change' name=doc.name %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>

ietf/templates/doc/document_top.html

@@ -1,11 +1,11 @@
 {# Copyright The IETF Trust 2015, All Rights Reserved #}{% load origin %}{% origin %}
 {% load ietf_filters %}
-<h2>{{ doc.title }}<br><small>{{ name }}</small></h2>
+<h2>{{ doc.title }}<br><small class="text-muted">{{ name }}</small></h2>
 
-<ul class="nav nav-tabs">
+<ul class="nav nav-tabs mb-3">
     {% for name, t, url, active, tooltip in tabs %}
         <li {% if tooltip %}title="{{tooltip}}"{% endif %} class="nav-item">
             <a class="nav-link {% if t == selected %}active {% endif %}{% if not active %}disabled {% endif %}" {% if active %}href="{{ url }}"{% endif %}>{{ name|capfirst_allcaps }}</a>
         </li>
     {% endfor %}
-</ul>
+</ul>

ietf/templates/doc/downref.html

@@ -6,7 +6,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}{{ title }}{% endblock %}
@@ -16,30 +16,25 @@
     <h1>{{ title }}</h1>
 
     {% if add_button %}
-
-
-        <p>
-            <a class="btn btn-warning" href="{% url "ietf.doc.views_downref.downref_registry_add" %}">Add downref</a>
-        </p>
-
+            <a class="btn btn-warning my-3" href="{% url "ietf.doc.views_downref.downref_registry_add" %}">Add downref</a>
 
     {% endif %}
 
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>Referenced RFC</th>
-                <th>Internet-Draft making the reference</th>
+                <th data-sort="ref">Referenced RFC</th>
+                <th data-sort="id">Internet-Draft making the reference</th>
             </tr>
         </thead>
         <tbody>
             {% for target_doc, source_doc in doc_pairs %}
                 <tr>
-                    <td>
+                    <td class="ref">
                         <a href="{% url "ietf.doc.views_doc.document_main" target_doc.name %}">RFC {{ target_doc.rfc_number }}</a>
                         <br><b>{{ target_doc.title }}</b>
                     </td>
-                    <td>
+                    <td class="id">
                         <a href="{% url "ietf.doc.views_doc.document_main" source_doc.name %}">{{ source_doc.name }}</a>
                         <br><b>{{ source_doc.title }}</b>
                     </td>
@@ -50,5 +45,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/drafts_for_ad.html

@@ -4,7 +4,7 @@
 {% load ietf_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Documents for {{ ad_name }}{% endblock %}
@@ -16,20 +16,20 @@
         <table class="table table-sm table-striped tablesorter">
             <thead>
                 <tr>
-                    <th>Document</th>
-                    <th>Status</th>
-                    <th>Responsible AD</th>
-                    <th>Discusses</th>
+                    <th data-sort="document">Document</th>
+                    <th data-sort="status">Status</th>
+                    <th data-sort="responsible">Responsible AD</th>
+                    <th data-sort="discusses">Discusses</th>
                 </tr>
             </thead>
 
             <tbody>
                 {% for doc in blocked_docs %}
                     <tr>
-                        <td>{{ doc.displayname_with_link }}</td>
+                        <td class="document">{{ doc.displayname_with_link }}</td>
                         {% include "doc/search/status_columns.html" %}
-                        <td>{{ doc.ad|default:"" }}</td>
-                        <td>
+                        <td class="responsible">{{ doc.ad|default:"" }}</td>
+                        <td class="discusses">
                             {% for p in doc.blocking_positions %}
                                 {{ p.balloter }}
                                 ({% if p.discuss_time %}{{ p.discuss_time|timesince_days }}{% endif %}
@@ -47,7 +47,7 @@
     {% endif %}
 
     <h1>Documents for {{ ad_name }}</h1>
-    {% include "doc/search/search_results.html" %}
+    {% include "doc/search/search_results.html" with start_table=True end_table=True %}
 {% endblock %}
 
 {% block morecss %}
@@ -55,5 +55,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/drafts_in_iesg_process.html

@@ -5,7 +5,7 @@
 {% load textfilters person_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}{{ title }}{% endblock %}
@@ -17,22 +17,22 @@
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th class="text-nowrap">Area</th>
-                <th class="text-nowrap">{% if state.slug == "lc" %}Expires at{% else %}Date{% endif %}</th>
-                <th>Document</th>
-                <th>Intended level</th>
-                <th>AD</th>
+                <th data-sort="area" class="text-nowrap">Area</th>
+                <th data-sort="date" class="text-nowrap">{% if state.slug == "lc" %}Expires at{% else %}Date{% endif %}</th>
+                <th data-sort="doc">Document</th>
+                <th data-sort="level">Intended level</th>
+                <th data-sort="ad">AD</th>
             </tr>
         </thead>
         {% for state, docs in grouped_docs %}
-            <tbody>
+            <thead>
                 <tr class="table-info"><th colspan="5">{{ state.name }}</th></tr>
-            </tbody>
+            </thead>
             <tbody>
                 {% for doc in docs %}
                     <tr>
-                        <td class="text-nowrap">{% if doc.area_acronym %}{{ doc.area_acronym }}{% endif %}</td>
-                        <td class="text-nowrap">
+                        <td class="area text-nowrap">{% if doc.area_acronym %}{{ doc.area_acronym }}{% endif %}</td>
+                        <td class="date text-nowrap">
                             {% if state.slug == "lc" %}
                                 {% if doc.lc_expires %}{{ doc.lc_expires|date:"Y-m-d" }}{% endif %}
                             {% else %}
@@ -40,7 +40,7 @@
                             {% endif %}
                         </td>
 
-                        <td>
+                        <td class="doc">
                             <a href="{% url "ietf.doc.views_doc.document_main" doc.name %}">{{ doc.name }}</a>
                             <br><b>{{ doc.title }}</b>
                             {% if doc.action_holders_enabled and doc.action_holders.exists %}
@@ -53,8 +53,8 @@
                                 <br><i>Note: {{ doc.note|linkify|linebreaksbr }}</i>
                             {% endif %}
                         </td>
-                        <td>{{ doc.intended_std_level.name }}</td>
-                        <td><a href="mailto:{{ doc.ad.email_address|urlencode }}">{{ doc.ad.plain_name }}</a></td>
+                        <td class="level">{{ doc.intended_std_level.name }}</td>
+                        <td class="ad">{% person_link doc.ad %}</td>
                     </tr>
                 {% endfor %}
             </tbody>
@@ -64,5 +64,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/drafts_in_last_call.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Internet-Drafts in IETF last call{% endblock %}
@@ -13,14 +13,15 @@
     <h1>
         Internet-Drafts in IETF last call
         {% if pages %}
-            <small class="padded-left">{{ pages }} pages</small>
+            <br>
+            <small class="text-muted">{{ pages }} pages</small>
         {% endif %}
     </h1>
 
-    {% include "doc/search/search_results.html" %}
+    {% include "doc/search/search_results.html" with start_table=True end_table=True%}
 
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/index_active_drafts.html

@@ -20,7 +20,7 @@
 
         <p class="buttonlist">
             {% for group in groups %}
-                <a class="btn btn-primary btn-xs" href="#{{ group.acronym }}">{{ group.acronym }}</a>
+                <a class="btn btn-primary btn-sm" href="#{{ group.acronym }}">{{ group.acronym }}</a>
             {% endfor %}
         </p>
 
@@ -38,4 +38,4 @@
             {% endfor %}
         {% endfor %}
     {% endcache %}
-{% endblock %}
+{% endblock %}

ietf/templates/doc/irsg_ballot_status.html

@@ -6,7 +6,7 @@
 {% load ietf_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}IRSG ballot status{% endblock %}
@@ -18,15 +18,15 @@
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>Document</th>
-                <th>Status</th>
+                <th data-sort="doc">Document</th>
+                <th data-sort="status">Status</th>
             </tr>
         </thead>
 
         <tbody>
             {% for doc in docs %}
                 <tr>
-                    <td>
+                    <td class="doc">
                         {{ doc.displayname_with_link }}
                     </td>
                     {% include "doc/search/status_columns.html" %}
@@ -37,6 +37,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
-
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/material/all_presentations.html

@@ -1,50 +1,46 @@
 {% extends "base.html" %}
 {# Copyright The IETF Trust 2015, All Rights Reserved #}
-{% load origin ietf_filters %}
+{% load origin ietf_filters static %}
 
 {% block title %}Sessions linked to {{doc.name}}{% endblock %}
 
+{% block pagehead %}
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
+{% endblock %}
+
 {% block content %}
     {% origin %}
-    <h1>Sessions linked to <a href="{% url 'ietf.doc.views_doc.document_main' name=doc.name %}">{{doc.name}}</a>{% if doc.title %}<br><small>{{doc.title}}</small>{% endif %}</h1>
+    <h1>Sessions linked to <a href="{% url 'ietf.doc.views_doc.document_main' name=doc.name %}">{{doc.name}}</a>{% if doc.title %}<br><small class="text-muted">{{doc.title}}</small>{% endif %}</h1>
 
-    <div class="buttonlist" >
         {% if user|has_role:"Secretariat,Area Director,WG Chair,WG Secretary,RG Chair,RG Secretary,IRTF Chair,Team Chair" %}
+    <div class="buttonlist" >
             <a class="btn btn-primary" id="addsessionsbutton" href="{% url 'ietf.doc.views_doc.add_sessionpresentation' name=doc.name %}">Link to more sessions</a>
-        {% endif %}
     </div>
+        {% endif %}
 
     {% if in_progress %}
-        <div class="panel " id="inprogressmeets">
-            <div class="card-header">Meetings in progress</div>
-            <div class="card-body">
-                {% with sessions=in_progress %}
-                    {% include "doc/material/presentations-row.html" %}
-                {% endwith %}
-            </div>
-        </div>
+        <h2 class="mt-3">Meetings in progress</h2>
+        {% with sessions=in_progress %}
+            {% include "doc/material/presentations-row.html" %}
+        {% endwith %}
     {% endif %}
 
     {% if future %}
-        <div class="panel " id="futuremeets">
-            <div class="card-header">Future meetings</div>
-            <div class="card-body">
-                {% with sessions=future %}
-                    {% include "doc/material/presentations-row.html" %}
-                {% endwith %}
-            </div>
-        </div>
+        <h2 class="mt-3">Future meetings</h2>
+        {% with sessions=future %}
+            {% include "doc/material/presentations-row.html" %}
+        {% endwith %}
     {% endif %}
 
     {% if past %}
-        <div class="panel " id="pastmeets">
-            <div class="card-header">Past meetings</div>
-            <div class="card-body">
-                {% with sessions=past %}
-                    {% include "doc/material/presentations-row.html" %}
-                {% endwith %}
-            </div>
-        </div>
+        <h2 class="mt-3">Past meetings</h2>
+        {% with sessions=past %}
+            {% include "doc/material/presentations-row.html" %}
+        {% endwith %}
     {% endif %}
 
 {% endblock content %}
+
+{% block js %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/material/presentations-row.html

@@ -2,24 +2,23 @@
 {% load ietf_filters session_filters %}
 
 {% origin %}
-<table class="table table-sm table-striped">
+<table class="table table-sm table-striped tablesorter">
     <thead>
         <tr>
-            <th class="col-md-1">Revision</th>
-            <th class="col-md-2">Meeting</th>
-            <th class="col-md-2">Session</th>
-            <th class="col-md-1">{% comment %}Agenda{% endcomment %}</th>
-            <th class="col-md-1">{% comment %}Minutes{% endcomment %}</th>
-            <th class="col-md-1">{% comment %}Materials{% endcomment %}</th>
-            <th class="col-md-4">{% comment %}Buttons{% endcomment %}</th>
+            <th data-sort="revision">Revision</th>
+            <th data-sort="meeting">Meeting</th>
+            <th data-sort="session">Session</th>
+            <th>{% comment %}Agenda{% endcomment %}</th>
+            <th>{% comment %}Minutes{% endcomment %}</th>
+            <th>{% comment %}Buttons{% endcomment %}</th>
         </tr>
     </thead>
     <tbody>
         {% for s in sessions %}
             <tr>
-                <td>{{s|presented_versions:doc}}</td>
-                <td>{% ifchanged s.meeting %}{% if s.meeting.type.slug == 'ietf' %}IETF{% endif %}{{s.meeting.number}}{% endifchanged %}</td>
-                <td>
+                <td class="revision">{{s|presented_versions:doc}}</td>
+                <td class="meeting">{% ifchanged s.meeting %}{% if s.meeting.type.slug == 'ietf' %}IETF{% endif %}{{s.meeting.number}}{% endifchanged %}</td>
+                <td class="session">
                     {% if s.name %}{{ s.name }}<br>{% else %}{{ s.group.acronym }} - {% endif %}
                     {% if s.current_status == "sched" %}
                         {% if s.meeting.type.slug == 'ietf' %}{{s.time|date:"D M d, Y Hi"}}{% else %}{{s.time|date:"D M d, Y"}}{% endif %}
@@ -29,13 +28,12 @@
                 </td>
                 <td>{% if s.agenda %}<a href="{{ s.agenda.get_absolute_url }}">Agenda</a>{% endif %}</td>
                 <td>{% if s.minutes %}<a href="{{ s.minutes.get_absolute_url }}">Minutes</a>{% endif %}</td>
-                <td><a href="{% url 'ietf.meeting.views.session_details' num=s.meeting.number acronym=s.group.acronym %}">Materials</a></td>
-                <td>
+                <td><a href="{% url 'ietf.meeting.views.session_details' num=s.meeting.number acronym=s.group.acronym %}" class="btn btn-sm btn-primary">Materials</a>
                     {% if user|has_role:"Secretariat" or s|can_manage_materials:user and not s.is_material_submission_cutoff %}
-                        <a class="btn btn-{% if s.is_material_submission_cutoff %}warning{% else %}default{% endif %} btn-xs" href="{% url 'ietf.doc.views_doc.remove_sessionpresentation' name=doc.name session_id=s.pk %}">Remove document from session</a>
-                        <a class="btn btn-{% if s.is_material_submission_cutoff %}warning{% else %}default{% endif %} btn-xs" href="{% url 'ietf.doc.views_doc.edit_sessionpresentation' name=doc.name session_id=s.pk %}">Change revision</a>
+                        <a class="btn btn-{% if s.is_material_submission_cutoff %}warning{% else %}primary{% endif %} btn-sm" href="{% url 'ietf.doc.views_doc.remove_sessionpresentation' name=doc.name session_id=s.pk %}">Remove document from session</a>
+                        <a class="btn btn-{% if s.is_material_submission_cutoff %}warning{% else %}primary{% endif %} btn-sm" href="{% url 'ietf.doc.views_doc.edit_sessionpresentation' name=doc.name session_id=s.pk %}">Change revision</a>
                     {% endif %}
                 </td>
         {% endfor %}
     </tbody>
-</table>
+</table>

ietf/templates/doc/recent_drafts.html

@@ -4,7 +4,7 @@
 {% load cache %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Internet-Drafts submitted during the last {{days|default:7}} days{% endblock %}
@@ -15,14 +15,14 @@
         <h1>
             Internet-Drafts submitted during the last {{days|default:7}} days
             {% if pages %}
-                <small class="padded-left">{{ pages }} pages</small>
+                <small class="text-muted">{{ pages }} pages</small>
             {% endif %}
         </h1>
 
-        {% include "doc/search/search_results.html" %}
+        {% include "doc/search/search_results.html" with start_table=True end_table=True%}
     {% endcache %}
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/relationship_help.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Document relationships{% endblock %}
@@ -15,9 +15,9 @@
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>Relationship</th>
-                <th>Description</th>
-                <th>Inverse relationship</th>
+                <th data-sort="name">Relationship</th>
+                <th data-sort="desc">Description</th>
+                <th data-sort="revname">Inverse relationship</th>
             </tr>
         </thead>
         <tbody>
@@ -34,5 +34,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/doc/review/request_info.html

@@ -50,7 +50,7 @@
             <th>Deadline</th>
             <td>{{ review_req.deadline|date:"Y-m-d" }}
                 {% if can_edit_deadline %}
-                    <a class="btn btn-primary btn-xs" href="{% url "ietf.doc.views_review.edit_deadline" name=doc.name request_id=review_req.pk %}"><span class="bi bi-pencil"></span> Edit</a>
+                    <a class="btn btn-primary btn-sm" href="{% url "ietf.doc.views_review.edit_deadline" name=doc.name request_id=review_req.pk %}"><span class="bi bi-pencil"></span> Edit</a>
                 {% endif %}
             </td>
         </tr>
@@ -123,7 +123,7 @@
                 <th>Comments</th>
                 <td><pre class="pasted">{{review_req.comment}}</pre>
                     {% if can_edit_comment %}
-                        <a class="btn btn-primary btn-xs" href="{% url "ietf.doc.views_review.edit_comment" name=doc.name request_id=review_req.pk %}"><span class="bi bi-pencil"></span> Edit comment</a>
+                        <a class="btn btn-primary btn-sm" href="{% url "ietf.doc.views_review.edit_comment" name=doc.name request_id=review_req.pk %}"><span class="bi bi-pencil"></span> Edit comment</a>
                     {% endif %}
                 </td>
             </tr>
@@ -146,10 +146,10 @@
                                 <em>Assignment accepted:</em>
                             {% endif %}
                             {% if assignment.can_reject_reviewer_assignment %}
-                                <a class="btn btn-danger btn-xs" href="{% url "ietf.doc.views_review.reject_reviewer_assignment" name=doc.name assignment_id=assignment.pk %}"><span class="bi bi-slash-circle"></span> Reject</a>
+                                <a class="btn btn-danger btn-sm" href="{% url "ietf.doc.views_review.reject_reviewer_assignment" name=doc.name assignment_id=assignment.pk %}"><span class="bi bi-slash-circle"></span> Reject</a>
                             {% endif %}
                             {% if assignment.can_accept_reviewer_assignment %}
-                                <form style="display:inline" method="post" action="{% url "ietf.doc.views_review.review_request" name=doc.name request_id=review_req.pk %}">{% csrf_token %}<button class="btn btn-success btn-xs" type="submit" name="action" value="accept"><span class="bi bi-check"></span> Accept</button></form>
+                                <form style="display:inline" method="post" action="{% url "ietf.doc.views_review.review_request" name=doc.name request_id=review_req.pk %}">{% csrf_token %}<button class="btn btn-success btn-sm" type="submit" name="action" value="accept"><span class="bi bi-check"></span> Accept</button></form>
                             {% endif %}
                         </div>
                     {% endif %}
@@ -180,13 +180,13 @@
                         {% endif %}
 
                         {% if assignment.can_complete_review %}
-                            <a class="btn btn-primary btn-xs" href="{% url "ietf.doc.views_review.complete_review" name=doc.name assignment_id=assignment.pk %}"><span class="bi bi-pencil-square-o"></span> {% if assignment.state_id == "assigned" or assignment.state_id == "accepted" %}Complete review{% else %}Correct review{% endif %}</a>
+                            <a class="btn btn-primary btn-sm" href="{% url "ietf.doc.views_review.complete_review" name=doc.name assignment_id=assignment.pk %}"><span class="bi bi-pencil-square-o"></span> {% if assignment.state_id == "assigned" or assignment.state_id == "accepted" %}Complete review{% else %}Correct review{% endif %}</a>
                         {% endif %}
 
                         {% if assignment.state_id == "assigned" or assignment.state_id == "accepted" %}
                             {% if can_assign_reviewer %}
-                                <a class="btn btn-danger btn-xs" href="{% url "ietf.doc.views_review.mark_reviewer_assignment_no_response" name=doc.name assignment_id=assignment.pk %}"><span class="bi bi-slash-circle"></span> No response</a>
-                                <a class="btn btn-danger btn-xs" href="{% url "ietf.doc.views_review.withdraw_reviewer_assignment" name=doc.name assignment_id=assignment.pk %}"><span class="bi bi-slash-circle"></span> Withdraw</a>
+                                <a class="btn btn-danger btn-sm" href="{% url "ietf.doc.views_review.mark_reviewer_assignment_no_response" name=doc.name assignment_id=assignment.pk %}"><span class="bi bi-slash-circle"></span> No response</a>
+                                <a class="btn btn-danger btn-sm" href="{% url "ietf.doc.views_review.withdraw_reviewer_assignment" name=doc.name assignment_id=assignment.pk %}"><span class="bi bi-slash-circle"></span> Withdraw</a>
                             {% endif %}
                         {% endif %}
                     </td>
@@ -235,7 +235,7 @@
 
 {% if can_assign_reviewer %}
     <p>
-        <a class="btn btn-primary btn-xs" href="{% url "ietf.doc.views_review.assign_reviewer" name=doc.name request_id=review_req.pk %}"><span class="bi bi-person"></span> Assign reviewer</a>
+        <a class="btn btn-primary btn-sm" href="{% url "ietf.doc.views_review.assign_reviewer" name=doc.name request_id=review_req.pk %}"><span class="bi bi-person"></span> Assign reviewer</a>
     </p>
 {% endif %}
 

ietf/templates/doc/review/review_request.html

@@ -12,7 +12,7 @@
 
     <div>
         {% if can_close_request %}
-            <a class="btn btn-danger btn-xs" href="{% url "ietf.doc.views_review.close_request" name=doc.name request_id=review_req.pk %}"><span class="bi bi-slash-circle"></span> Close request</a>
+            <a class="btn btn-danger btn-sm" href="{% url "ietf.doc.views_review.close_request" name=doc.name request_id=review_req.pk %}"><span class="bi bi-slash-circle"></span> Close request</a>
         {% endif %}
     </div>
 

ietf/templates/doc/search/search.html

@@ -5,7 +5,7 @@
 {% block title %}Document Search{% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block content %}
@@ -22,5 +22,5 @@
 {% endblock content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/doc/state_help.html

@@ -5,7 +5,7 @@
 {% block title %}{{ title }}{% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block content %}
@@ -66,5 +66,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/doc/status_change/status_changes.html

@@ -4,7 +4,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}RFC status changes{% endblock %}
@@ -21,21 +21,21 @@
     <table class="table table-striped table-sm tablesorter">
         <thead>
             <tr>
-                <th>Document</th>
-                <th>Title</th>
+                <th data-sort="document">Document</th>
+                <th data-sort="title">Title</th>
             </tr>
         </thead>
 
         {% for state in state_groups %}
-            <tbody>
+            <thead>
                 <tr class="table-info"><th colspan="2">{{state.grouper}}</th></tr>
-            </tbody>
+            </thead>
 
             <tbody>
                 {% for doc in state.list %}
                     <tr>
-                        <td>{{ doc.displayname_with_link|safe }}</td>
-                        <td><b>{{ doc.title }}</b></td>
+                        <td class="document">{{ doc.displayname_with_link|safe }}</td>
+                        <td class="title"><b>{{ doc.title }}</b></td>
                     </tr>
                 {% endfor %}
             </tbody>
@@ -44,5 +44,5 @@
 {% endblock content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/group/active_adm.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active administrative groups{% endblock %}
@@ -35,5 +35,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_ags.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active area groups{% endblock %}
@@ -51,5 +51,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_dirs.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active directorates{% endblock %}
@@ -60,5 +60,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_groups.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active groups{% endblock %}
@@ -32,5 +32,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_iabgroups.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active IAB groups{% endblock %}
@@ -41,5 +41,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_rags.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active research area groups{% endblock %}
@@ -44,5 +44,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_review_dirs.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active review directorates{% endblock %}
@@ -54,5 +54,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_rgs.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active IRTF research groups{% endblock %}
@@ -48,5 +48,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_teams.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active teams{% endblock %}
@@ -39,5 +39,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/active_wgs.html

@@ -3,7 +3,7 @@
 {% load origin static group_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Active IETF working groups{% endblock %}
@@ -96,5 +96,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/bofs.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}BOFs{% endblock %}
@@ -46,5 +46,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/chartering_groups.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Chartering or re-chartering groups{% endblock %}
@@ -75,5 +75,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/concluded_groups.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block morecss %}
@@ -114,5 +114,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/email.html

@@ -5,7 +5,7 @@
 {% load static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block group_content %}
@@ -59,5 +59,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/group_about.html

@@ -19,7 +19,7 @@
                 <th>Name</th>
                 <td class="edit">
                     {% if can_edit_group %}
-                        <a class="btn btn-primary btn-xs" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='name' %}">Edit</a>
+                        <a class="btn btn-primary btn-sm" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='name' %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>{{ group.name }}</td>
@@ -50,7 +50,7 @@
                 <th>State</th>
                 <td class="edit">
                     {% if can_edit_group %}
-                        <a class="btn btn-primary btn-xs" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='state' %}">Edit</a>
+                        <a class="btn btn-primary btn-sm" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='state' %}">Edit</a>
                     {% endif %}
                 </td>
                 <td>
@@ -73,7 +73,7 @@
                         {% else %}
                             (None)
                             {% if user|has_role:"Area Director,Secretariat" %}
-                                <a class="btn btn-warning btn-xs" href="{{ charter_submit_url }}">Submit charter</a>
+                                <a class="btn btn-warning btn-sm" href="{{ charter_submit_url }}">Submit charter</a>
                             {% endif %}
                         {% endif %}
                     </td>
@@ -86,7 +86,7 @@
                     <th>Status Update</th>
                     <td class="edit">
                         {% if can_provide_status_update %}
-                            <a class="btn btn-primary btn-xs" href="{% url "ietf.group.views.group_about_status_edit" acronym=group.acronym %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url "ietf.group.views.group_about_status_edit" acronym=group.acronym %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -121,7 +121,7 @@
                         <th>Additional Resources</th>
                         <td class="edit">
                             {% if can_edit_group %}
-                                <a class="btn btn-primary btn-xs" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='resources' %}">Edit</a>
+                                <a class="btn btn-primary btn-sm" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='resources' %}">Edit</a>
                             {% endif %}
                         </td>
                         <td>
@@ -156,7 +156,7 @@
                     <th>{{ label }}</th>
                     <td class="edit">
                         {% if can_edit_group and slug in editable_roles %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.group.views.edit' acronym=group.acronym field=slug %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.group.views.edit' acronym=group.acronym field=slug %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>
@@ -176,7 +176,7 @@
                     <th>Address</th>
                     <td class="edit">
                         {% if can_edit_group %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='list_email' %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='list_email' %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>{{ group.list_email|linkify }}</td>
@@ -186,7 +186,7 @@
                     <th>To subscribe</th>
                     <td class="edit">
                         {% if can_edit_group %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='list_subscribe' %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='list_subscribe' %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>{{ group.list_subscribe|linkify }}</td>
@@ -196,7 +196,7 @@
                     <th>Archive</th>
                     <td class="edit">
                         {% if can_edit_group %}
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='list_archive' %}">Edit</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='list_archive' %}">Edit</a>
                         {% endif %}
                     </td>
                     <td>{{ group.list_archive|linkify }}</td>
@@ -225,7 +225,7 @@
 
     {% if requested_close or group.state_id == "conclude" %}
         {% if user|has_role:"Secretariat" %}
-            <a class="btn btn-primary btn-xs" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='closing_note' %}">Edit</a>&nbsp;
+            <a class="btn btn-primary btn-sm" href="{% url 'ietf.group.views.edit' acronym=group.acronym field='closing_note' %}">Edit</a>&nbsp;
             <label>Closing note for {{ group.type.desc.title|default:group.acronym }}:</label>
 
             {% if closing_note and closing_note.desc != "(Closing note deleted)" %}

ietf/templates/group/history.html

@@ -5,7 +5,7 @@
 {% load static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block group_content %}
@@ -17,26 +17,23 @@
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>Date</th>
-                <th>By</th>
-                <th>Action</th>
+                <th data-sort="date">Date</th>
+                <th data-sort="by">By</th>
+                <th data-sort="action">Action</th>
             </tr>
         </thead>
         <tbody>
             {% for e in events %}
                 <tr>
-                    <td class="text-nowrap">{{ e.time|date:"Y-m-d"}}</td>
-                    <td>
-                        {{ e.by.plain_name }}
-                    </td>
-                    <td>{{ e.desc|format_history_text }}</td>
+                    <td class="date text-nowrap">{{ e.time|date:"Y-m-d" }}</td>
+                    <td class="by text-nowrap">{{ e.by.plain_name }}</td>
+                    <td class="action">{{ e.desc|format_history_text }}</td>
                 </tr>
             {% endfor %}
         </tbody>
     </table>
-
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/group/index.html

@@ -5,7 +5,7 @@
 {% load ietf_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Other RFC streams{% endblock %}
@@ -39,5 +39,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/manage_review_requests.html

@@ -7,7 +7,7 @@
 {% block title %}Manage open review requests for {{ group.acronym }}{% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block content %}
@@ -189,6 +189,6 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
     <script src="{% static "ietf/js/manage-review-requests.js" %}"></script>
 {% endblock %}

ietf/templates/group/materials.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block group_subtitle %}Materials{% endblock %}
@@ -80,5 +80,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/meetings-row.html

@@ -21,7 +21,7 @@
                     {% if show_request and s.meeting.type_id == 'ietf' %}
                         {% if can_edit %}
                             <br>
-                            <a class="btn btn-primary btn-xs" href="{% url 'ietf.secr.sreq.views.view' num=s.meeting.number acronym=s.group.acronym %}">Edit Session Request</a>
+                            <a class="btn btn-primary btn-sm" href="{% url 'ietf.secr.sreq.views.view' num=s.meeting.number acronym=s.group.acronym %}">Edit Session Request</a>
                         {% endif %}
                     {% endif %}
                 </td>

ietf/templates/group/review_requests.html

@@ -2,62 +2,60 @@
 {# Copyright The IETF Trust 2015, All Rights Reserved #}
 {% load origin %}{% origin %}
 
-{% load ietf_filters static django_bootstrap5 %}
+{% load ietf_filters static person_filters %}
 
 {% block group_subtitle %}Review requests{% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block group_content %}
     {% origin %}
 
     {% if can_access_stats %}
-        <h1 class="float-end"><a href="{% url "ietf.stats.views.review_stats" %}" class="icon-link">&nbsp;<span class="small bi bi-bar-chart-line">&nbsp;</span></a></h1>
+        <h1 class="float-end"><a href="{% url "ietf.stats.views.review_stats" %}" class="icon-link"><span class="small bi bi-bar-chart-line"></span></a></h1>
     {% endif %}
 
     {% if unassigned_review_requests %}
 
-        <h2 id="unassigned-review-requests">Unassigned review requests</h2>
+        <h2 class="mt-3" id="unassigned-review-requests">Unassigned review requests</h2>
 
         <table class="table table-sm table-striped tablesorter">
             <thead>
                 <tr>
-                    <th class="col-md-4">Request</th>
-                    <th class="col-md-1">Type</th>
-                    <th class="col-md-2">Requested</th>
-                    <th class="col-md-1">Deadline</th>
+                    <th data-sort="request">Request</th>
+                    <th data-sort="type">Type</th>
+                    <th data-sort="requested">Requested</th>
+                    <th data-sort="deadline">Deadline</th>
                     {% if review_requests.0.reviewer %}
-                        <th class="col-md-2">Reviewer</th>
-                        <th class="col-md-1">Document state</th>
-                    {% else %}
-                        <th clas="col-md-3">Document state</th>
+                        <th data-sort="reviewer">Reviewer</th>
                     {% endif %}
-                    <th class="col-md-1">IESG Telechat</th>
+                    <th data-sort="state">Document state</th>
+                    <th data-sort="telechat">IESG Telechat</th>
                 </tr>
             </thead>
             <tbody>
                 {% for r in unassigned_review_requests %}
                     <tr>
-                        <td>{% if r.pk != None %}<a href="{% url "ietf.doc.views_review.review_request" name=r.doc.name request_id=r.pk %}">{% endif %}{{ r.doc.name }}-{% if r.requested_rev %}{{ r.requested_rev }}{% else %}{{ r.doc.rev }}{% endif %}{% if r.pk != None %}</a>{% endif %}</td>
-                        <td>{{ r.type.name }}</td>
-                        <td><span style="display:none">X</span>{% if r.pk %}{{ r.time|date:"Y-m-d" }} by {{r.requested_by.plain_name}}{% else %}<em>auto-suggested</em>{% endif %}</td>
-                        <td><span style="display:none">X</span>
+                        <td class="request">{% if r.pk != None %}<a href="{% url "ietf.doc.views_review.review_request" name=r.doc.name request_id=r.pk %}">{% endif %}{{ r.doc.name }}-{% if r.requested_rev %}{{ r.requested_rev }}{% else %}{{ r.doc.rev }}{% endif %}{% if r.pk != None %}</a>{% endif %}</td>
+                        <td class="type text-nowrap">{{ r.type.name }}</td>
+                        <td class="requested text-end">{% if r.pk %}{{ r.time|date:"Y-m-d" }} by {{r.requested_by.plain_name}}{% else %}<em>auto-suggested</em>{% endif %}</td>
+                        <td class="deadline text-end">
                             {{ r.deadline|date:"Y-m-d" }}
-                            {% if r.due %}<span class="badge bg-warning" title="{{ r.due }} day{{ r.due|pluralize }} past deadline">{{ r.due }} day{{ r.due|pluralize }}</span>{% endif %}
+                            {% if r.due %}<br><span class="badge xxx bg-warning" title="{{ r.due }} day{{ r.due|pluralize }} past deadline">{{ r.due }} day{{ r.due|pluralize }}</span>{% endif %}
                         </td>
                         {% if r.reviewer %}
-                            <td>
+                            <td class="reviewer">
                                 {{ r.reviewer.person }}
-                                {% if r.state_id == "accepted" %}<span class="badge bg-secondary">Accepted</span>{% endif %}
-                                {% if r.reviewer_unavailable %}<span class="badge bg-danger">Unavailable</span>{% endif %}
+                                {% if r.state_id == "accepted" %}<br><span class="badge bg-secondary">Accepted</span>{% endif %}
+                                {% if r.reviewer_unavailable %}<br><span class="badge bg-danger">Unavailable</span>{% endif %}
                             </td>
                         {% endif %}
-                        <td>
+                        <td class="state">
                             {{ r.doc.friendly_state }}
                         </td>
-                        <td>
+                        <td class="telechat">
                             {% if r.doc.telechat_date %}
                                 {{ r.doc.telechat_date }}
                             {% endif %}
@@ -70,39 +68,39 @@
     {% endif %}
 
     {% if open_review_assignments %}
-        <h2 id="open_review_assignments">Open review assignments</h2>
+        <h2 class="mt-3" id="open_review_assignments">Open review assignments</h2>
 
         <table class="table table-sm table-striped tablesorter">
             <thead>
                 <tr>
-                    <th class="col-md-4">Request</th>
-                    <th class="col-md-1">Type</th>
-                    <th class="col-md-2">Assigned</th>
-                    <th class="col-md-1">Deadline</th>
-                    <th class="col-md-2">Reviewer</th>
-                    <th class="col-md-1">Document state</th>
-                    <th class="col-md-1">IESG Telechat</th>
+                    <th data-sort="request">Request</th>
+                    <th data-sort="type">Type</th>
+                    <th data-sort="assigned">Assigned</th>
+                    <th data-sort="deadline">Deadline</th>
+                    <th data-sort="reviewer">Reviewer</th>
+                    <th data-sort="state">Document state</th>
+                    <th data-sort="telechat">IESG Telechat</th>
                 </tr>
             </thead>
             <tbody>
                 {% for a in open_review_assignments %}
                     <tr>
-                        <td><a href="{% url "ietf.doc.views_review.review_request" name=a.review_request.doc.name request_id=a.review_request.pk %}">{{ a.review_request.doc.name }}-{% if a.review_request.requested_rev %}{{ a.review_requests.requested_rev }}{% else %}{{ a.review_request.doc.rev }}{% endif %}</a></td>
-                        <td>{{ a.review_request.type.name }}</td>
-                        <td><span style="display:none">X</span>{{ a.assigned_on|date:"Y-m-d" }}</td>
-                        <td><span style="display:none">X</span>
+                        <td class="request"><a href="{% url "ietf.doc.views_review.review_request" name=a.review_request.doc.name request_id=a.review_request.pk %}">{{ a.review_request.doc.name }}-{% if a.review_request.requested_rev %}{{ a.review_requests.requested_rev }}{% else %}{{ a.review_request.doc.rev }}{% endif %}</a></td>
+                        <td class="type text-nowrap">{{ a.review_request.type.name }}</td>
+                        <td class="assigned text-end">{{ a.assigned_on|date:"Y-m-d" }}</td>
+                        <td class="deadline text-end">
                             {{ a.review_request.deadline|date:"Y-m-d" }}
-                            {% if a.due %}<span class="badge bg-warning" title="{{ a.due }} day{{ a.due|pluralize }} past deadline">{{ a.due }} day{{ a.due|pluralize }}</span>{% endif %}
+                            {% if a.due %}<br><span class="badge bg-warning" title="{{ a.due }} day{{ a.due|pluralize }} past deadline">{{ a.due }} day{{ a.due|pluralize }}</span>{% endif %}
                         </td>
-                        <td>
-                            {{ a.reviewer.person }}
-                            {% if a.state_id == "accepted" %}<span class="badge bg-secondary">Accepted</span>{% endif %}
-                            {% if a.reviewer_unavailable %}<span class="badge bg-danger">Unavailable</span>{% endif %}
+                        <td class="reviewer">
+                            {% person_link a.reviewer.person %}
+                            {% if a.state_id == "accepted" %}<br><span class="badge bg-secondary">Accepted</span>{% endif %}
+                            {% if a.reviewer_unavailable %}<br><span class="badge bg-danger">Unavailable</span>{% endif %}
                         </td>
-                        <td>
+                        <td class="state">
                             {{ a.review_request.doc.friendly_state }}
                         </td>
-                        <td>
+                        <td class="telechat">
                             {% if a.review_request.doc.telechat_date %}
                                 {{ a.review_request.doc.telechat_date }}
                             {% endif %}
@@ -113,39 +111,39 @@
         </table>
     {% endif %}
 
-    <h2 id="closed-review-requests">Closed review requests and assignments</h2>
+    <h2 class="mt-3" id="closed-review-requests">Closed review requests and assignments</h2>
 
     <form class="closed-review-filter" action="#closed-review-requests">
         Past:
-        <div class="btn-group" role="group">
+        <div class="btn-group btn-group-sm" role="group">
             {% for key, label in since_choices %}
-                <button class="btn btn-primary {% if since == key %}active{% endif %}" {% if key %}name="since" value="{{ key }}"{% endif %} type="submit">{{ label }}</button>
+                <button class="btn btn-outline-primary {% if since == key %}active{% endif %}" {% if key %}name="since" value="{{ key }}"{% endif %} type="submit">{{ label }}</button>
             {% endfor %}
         </div>
     </form>
 
     {% if closed_review_requests %}
-        <h3>Closed review requests</h3>
+        <h3 class="mt-3">Closed review requests</h3>
         <table class="table table-sm table-striped tablesorter">
             <thead>
                 <tr>
-                    <th>Request</th>
-                    <th>Type</th>
-                    <th>Requested</th>
-                    <th>Deadline</th>
-                    <th>Closed</th>
-                    <th>State</th>
+                    <th data-sort="request">Request</th>
+                    <th data-sort="type">Type</th>
+                    <th data-sort="requested">Requested</th>
+                    <th data-sort="deadline">Deadline</th>
+                    <th data-sort="closed">Closed</th>
+                    <th data-sort="state">State</th>
                 </tr>
             </thead>
             <tbody>
                 {% for r in closed_review_requests %}
                     <tr>
-                        <td><a href="{% url "ietf.doc.views_review.review_request" name=r.doc.name request_id=r.pk %}">{{ r.doc.name }}{% if r.requested_rev %}-{{ r.requested_rev }}{% endif %}</a></td>
-                        <td>{{ r.type }}</td>
-                        <td><span style="display:none">X</span>{{ r.time|date:"Y-m-d" }} by {{ r.requested_by.plain_name }}</td>
-                        <td>{{ r.deadline|date:"Y-m-d" }}</td>
-                        <td>{{ r.request_closed_time|date:"Y-m-d" }}</td>
-                        <td>{{ r.state.name }}</td>
+                        <td class="request"><a href="{% url "ietf.doc.views_review.review_request" name=r.doc.name request_id=r.pk %}">{{ r.doc.name }}{% if r.requested_rev %}-{{ r.requested_rev }}{% endif %}</a></td>
+                        <td class="type text-nowrap">{{ r.type }}</td>
+                        <td class="requested text-end">{{ r.time|date:"Y-m-d" }} by {{ r.requested_by.plain_name }}</td>
+                        <td class="deadline text-end">{{ r.deadline|date:"Y-m-d" }}</td>
+                        <td class="closed text-end">{{ r.request_closed_time|date:"Y-m-d" }}</td>
+                        <td class="state">{{ r.state.name }}</td>
                     </tr>
                 {% endfor %}
             </tbody>
@@ -153,31 +151,31 @@
     {% endif %}
 
     {% if closed_review_assignments %}
-        <h3>Closed review assignments</h3>
+        <h3 class="mt-3">Closed review assignments</h3>
         <table class="table table-sm table-striped tablesorter">
             <thead>
                 <tr>
-                    <th>Request</th>
-                    <th>Type</th>
-                    <th>Assigned</th>
-                    <th>Deadline</th>
-                    <th>Closed</th>
-                    <th>Reviewer</th>
-                    <th>State</th>
-                    <th>Result</th>
+                    <th data-sort="request">Request</th>
+                    <th data-sort="type">Type</th>
+                    <th data-sort="assigned">Assigned</th>
+                    <th data-sort="deadline">Deadline</th>
+                    <th data-sort="closed">Closed</th>
+                    <th data-sort="reviewer">Reviewer</th>
+                    <th data-sort="state">State</th>
+                    <th data-sort="result">Result</th>
                 </tr>
             </thead>
             <tbody>
                 {% for a in closed_review_assignments %}
                     <tr>
-                        <td><a href="{% url "ietf.doc.views_review.review_request" name=a.review_request.doc.name request_id=a.review_request.pk %}">{{ a.review_request.doc.name }}{% if a.review_request.requested_rev %}-{{ a.review_request.requested_rev }}{% endif %}</a></td>
-                        <td>{{ a.review_request.type }}</td>
-                        <td>{{ a.assigned_on|date:"Y-m-d" }}</td>
-                        <td>{{ a.review_request.deadline|date:"Y-m-d" }}</td>
-                        <td>{{ a.completed_on|date:"Y-m-d" }}</td>
-                        <td>{{ a.reviewer.person }}</td>
-                        <td>{{ a.state }}</td>
-                        <td>{% if a.result %}{{ a.result }}{% endif %}</td>
+                        <td class="request"><a href="{% url "ietf.doc.views_review.review_request" name=a.review_request.doc.name request_id=a.review_request.pk %}">{{ a.review_request.doc.name }}{% if a.review_request.requested_rev %}-{{ a.review_request.requested_rev }}{% endif %}</a></td>
+                        <td class="type text-nowrap">{{ a.review_request.type }}</td>
+                        <td class="assigned text-end">{{ a.assigned_on|date:"Y-m-d" }}</td>
+                        <td class="deadline text-end">{{ a.review_request.deadline|date:"Y-m-d" }}</td>
+                        <td class="closed text-end">{{ a.completed_on|date:"Y-m-d" }}</td>
+                        <td class="reviewer">{% person_link a.reviewer.person %}</td>
+                        <td class="state">{{ a.state }}</td>
+                        <td class="result">{% if a.result %}{{ a.result }}{% endif %}</td>
                     </tr>
                 {% endfor %}
             </tbody>
@@ -186,11 +184,11 @@
     {% endif %}
 
     {% if not closed_review_requests and not closed_review_assignments %}
-        <div>None found</div>
+        <p class="mt-3">None found</p>
     {% endif %}
 
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/group/reviewer_overview.html

@@ -10,7 +10,7 @@
     {% origin %}
 
     {% block pagehead %}
-        <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+        <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
     {% endblock %}
 
     {% if can_access_stats %}
@@ -99,5 +99,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/group/stream_documents.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}{{ stream }} stream documents{% endblock %}
@@ -24,5 +24,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/help/state_index.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %} Document state index{% endblock %}
@@ -44,5 +44,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/help/states.html

@@ -3,7 +3,7 @@
 {% load origin static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %} {{type.label|cut:"state"|cut:"state"}} states{% endblock %}
@@ -13,31 +13,28 @@
 
     <h1>{{type.label|cut:"state"|cut:"State"}} states</h1>
 
-
     <table class="table table-sm table-striped tablesorter">
         <thead>
             <tr>
-                <th>State</th>
-                <th>Description</th>
-                <th>Next states</th>
+                <th data-sort="state">State</th>
+                <th data-sort="desc">Description</th>
+                <th data-sort="next">Next states</th>
             </tr>
         </thead>
 
         <tbody>
             {% for state in states %}
                 <tr>
-                    <th>{{ state.name }}</th>
-                    <td>{{ state.desc|safe }}</td>
-                    <td><ul>{% for s in state.next_states.all %}<li>{{ s.name }}</li>{%endfor%}</ul></td>
+                    <th class="state">{{ state.name }}</th>
+                    <td class="desc">{{ state.desc|safe }}</td>
+                    <td class="next"><ul>{% for s in state.next_states.all %}<li>{{ s.name }}</li>{%endfor%}</ul></td>
                 </tr>
             {% endfor %}
 
         </tbody>
     </table>
-
-
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/iesg/agenda_documents.html

@@ -7,7 +7,7 @@
 
 {% block pagehead %}
     <link rel="alternate" type="application/atom+xml" href="/feed/iesg-agenda/">
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Documents on future IESG telechat agendas{% endblock %}
@@ -85,5 +85,5 @@
 {% endblock content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/iesg/discusses.html

@@ -6,7 +6,7 @@
 {% load ietf_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}IESG discuss positions{% endblock %}
@@ -78,7 +78,7 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
     <script>
         $(".discuss").click(function () {
             var x = $(this).find("input").val();

ietf/templates/iesg/past_documents.html

@@ -6,7 +6,7 @@
 {% load ietf_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Documents on recent agendas{% endblock %}
@@ -85,7 +85,7 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
     <script>
         $(".discuss").click(function () {
             var x = $(this).find("input").val();

ietf/templates/ietfauth/apikeys.html

@@ -33,7 +33,7 @@
                             <td style="border-top: 0" colspan="4"><code>{{ key.hash }}</code></td>
                             <td style="border-top: 0">
                                 {% if key.valid %}
-                                    <a href="{%url 'ietf.ietfauth.views.apikey_disable' %}?hash={{key.hash}}" class="btn btn-warning btn-xs del-apikey">Disable</a>
+                                    <a href="{%url 'ietf.ietfauth.views.apikey_disable' %}?hash={{key.hash}}" class="btn btn-warning btn-sm del-apikey">Disable</a>
                                 {% endif %}
                             </td>
                         </tr>

ietf/templates/ipr/admin_list.html

@@ -2,10 +2,14 @@
 {# Copyright The IETF Trust 2015, All Rights Reserved #}
 {% load origin %}
 
-{% load ietf_filters %}
+{% load ietf_filters static %}
 
 {% block title %}IPR Admin - {% for s in states %}{{ s.name }}{% if not forloop.last %}/{% endif %}{% endfor %} Disclosures{% endblock %}
 
+{% block pagehead %}
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
+{% endblock %}
+
 {% block content %}
     {% origin %}
     <h1>IPR Admin - {% for s in states %}{{ s.name }}{% if not forloop.last %}/{% endif %}{% endfor %} Disclosures</h1>
@@ -25,3 +29,7 @@
     {% include "ipr/ipr_table.html" %}
 
 {% endblock %}
+
+{% block js %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/ipr/details_history.html

@@ -5,7 +5,7 @@
 {% load ietf_filters ipr_filters static %}
 
 {% block morecss %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}History for IPR - {{ ipr.title }}{% endblock %}
@@ -59,5 +59,5 @@
 {% endblock content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/ipr/ipr_table.html

@@ -1,24 +1,24 @@
 {# Copyright The IETF Trust 2015, All Rights Reserved #}
 {% load origin %}{% origin %}
 {% load ietf_filters %}
-<table class="table table-sm table-striped ipr-table tablesorter">
+<table class="table table-sm table-striped tablesorter">
     <thead>
         <tr>
-            <th>Date</th>
-            <th>ID</th>
-            <th>Title</th>
+            <th data-sort="date">Date</th>
+            <th data-sort="id">ID</th>
+            <th data-sort="title">Title</th>
             {% if administrative_list == 'pending' %}
-                <th>Query</th>
-                <th>Response Due</th>
+                <th data-sort="query">Query</th>
+                <th data-sort="due">Response Due</th>
             {% endif %}
         </tr>
     </thead>
     <tbody>
         {% for ipr in iprs %}
             <tr>
-                <td class="text-nowrap">{{ ipr.time|date:"Y-m-d" }}</td>
-                <td>{{ ipr.id }}</td>
-                <td>
+                <td class="date text-nowrap text-end">{{ ipr.time|date:"Y-m-d" }}</td>
+                <td class="id text-end">{{ ipr.id }}</td>
+                <td class="title">
                     {% if ipr.state_id == 'posted' or administrative_list %}
                         <div><a href="{% url "ietf.ipr.views.show" ipr.id %}">{{ ipr.title }}</a></div>
 
@@ -42,8 +42,8 @@
 
                 {% if administrative_list == 'pending' %}
                     {% with ipr.get_latest_event_msgout as latest_msgout %}
-                        <td class="column-four">{% if latest_msgout %}{{ latest_msgout.time|date:"Y-m-d" }}{% endif %}</td>
-                        <td class="text-nowrap">
+                        <td class="query">{% if latest_msgout %}{{ latest_msgout.time|date:"Y-m-d" }}{% endif %}</td>
+                        <td class="due text-nowrap">
                             {% if latest_msgout and latest_msgout.response_due %}
                                 {{ latest_msgout.response_due|date:"Y-m-d" }}
                                 {% if latest_msgout.response_past_due %}
@@ -56,4 +56,4 @@
             </tr>
         {% endfor %}
     </tbody>
-</table>
+</table>

ietf/templates/ipr/list.html

@@ -9,7 +9,7 @@
 {% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block content %}
@@ -58,5 +58,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
-{% endblock %}
+    <script src="{% static "ietf/js/list.js" %}"></script>
+{% endblock %}

ietf/templates/ipr/search_doc_result.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block search_header %}Document IPR search results <small>for {{doc}}</small>{% endblock %}
@@ -121,5 +121,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/ipr/search_doctitle_result.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block search_header %}Search result on {{ q }}{% endblock %}
@@ -60,5 +60,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/ipr/search_result.html

@@ -6,7 +6,7 @@
 {% load static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}IPR disclosures{% endblock %}
@@ -87,6 +87,6 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
     <script type="text/javascript" src="{% static 'ietf/js/ipr-search.js' %}"></script>
 {% endblock %}

ietf/templates/ipr/search_wg_result.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block search_header %}Working Group search results{% endblock %}
@@ -64,5 +64,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/liaisons/detail.html

@@ -96,7 +96,7 @@
                     {% if can_take_care %}
                         <form method="post" class="float-end">
                             {% csrf_token %}
-                            <input class="btn btn-warning btn-xs" type="submit" value="Mark as action taken" name='do_action_taken'>
+                            <input class="btn btn-warning btn-sm" type="submit" value="Mark as action taken" name='do_action_taken'>
                         </form>
                     {% endif %}
                 </td>

ietf/templates/liaisons/detail_history.html

@@ -3,7 +3,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}History for Liaison Statement - {{ liaison.title }}{% endblock %}
@@ -47,5 +47,5 @@
 {% endblock content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/liaisons/field_help.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Liaison statement field help{% endblock %}
@@ -181,5 +181,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/liaisons/guide_from_ietf.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Liaison statements from the IETF - guidelines for completing the "Cc:" field{% endblock %}
@@ -83,5 +83,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/liaisons/guide_to_ietf.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Liaison statements to the IETF - guidelines for completing the "To:" and "Cc:" fields{% endblock %}
@@ -71,5 +71,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/liaisons/liaison_base.html

@@ -6,7 +6,7 @@
 
 {% block pagehead %}
     <link rel="stylesheet" href="{% static 'bootstrap-datepicker/css/bootstrap-datepicker3.min.css' %}">
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}Liaison Statements - {{ selected_menu_entry|capfirst }}{% endblock %}
@@ -53,7 +53,7 @@
 {% endblock content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
     <script src="{% static 'bootstrap-datepicker/js/bootstrap-datepicker.min.js' %}"></script>
     <script src="{% static 'ietf/js/liaisons.js' %}"></script>
 {% endblock %}

ietf/templates/meeting/agenda.html

@@ -16,6 +16,10 @@
     {% endif %}
 {% endblock %}
 
+{% block pagehead %}
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
+{% endblock %}
+
 {% block morecss %}
     #weekview iframe { height: 25em; }
 {% endblock %}

ietf/templates/meeting/create_timeslot.html

@@ -17,7 +17,7 @@
     {% bootstrap_form form %}
     {% buttons %}
       <button type="submit" class="btn btn-primary">Save</button>
-      <a class="btn btn-default" href="{% url 'ietf.meeting.views.edit_timeslots' num=meeting.number %}">Cancel</a>
+      <a class="btn btn-primary" href="{% url 'ietf.meeting.views.edit_timeslots' num=meeting.number %}">Cancel</a>
     {% endbuttons %}
   </form>
 {% endblock %}

ietf/templates/meeting/edit_meeting_schedule.html

@@ -194,9 +194,9 @@
                     </span>
 
                     {% if session_purposes|length > 1 %}
-                        <button id="session-toggle-modal-open" class="btn btn-default" data-bs-toggle="modal" data-bs-target="#session-toggles-modal"><input type="checkbox" checked="checked" disabled> Sessions</button>
+                        <button id="session-toggle-modal-open" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#session-toggles-modal"><input type="checkbox" checked="checked" disabled> Sessions</button>
                     {% endif %}
-                    <button id="timeslot-toggle-modal-open" class="btn btn-default" data-bs-toggle="modal" data-bs-target="#timeslot-group-toggles-modal"><input type="checkbox" checked="checked" disabled> Timeslots</button>
+                    <button id="timeslot-toggle-modal-open" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#timeslot-group-toggles-modal"><input type="checkbox" checked="checked" disabled> Timeslots</button>
                 </div>
             </div>
 
@@ -216,8 +216,8 @@
 
                     <div class="modal-body">
                         <div class="timeslot-group-buttons">
-                            <button type="button" class="btn btn-default select-all">Select all times</button>
-                            <button type="button" class="btn btn-default clear-all">Clear times</button>
+                            <button type="button" class="btn btn-primary select-all">Select all times</button>
+                            <button type="button" class="btn btn-primary clear-all">Clear times</button>
                         </div>
                         <div class="individual-timeslots">
 
@@ -235,8 +235,8 @@
                             {% for type in timeslot_types %}
                                 <label class="timeslot-type-{{ type.slug }}"><input type="checkbox" checked value="{{ type.slug }}"> {{ type }}</label>
                             {% endfor %}
-                            <button type="button" class="btn btn-default select-all">Select all types</button>
-                            <button type="button" class="btn btn-default clear-all">Clear types</button>
+                            <button type="button" class="btn btn-primary select-all">Select all types</button>
+                            <button type="button" class="btn btn-primary clear-all">Clear types</button>
                         </div>
                     </div>
 
@@ -265,8 +265,8 @@
                                     <label class="purpose-{{ purpose.slug }}"><input type="checkbox" checked value="{% firstof purpose.slug 'none' %}"> {{ purpose }}</label>
                                 </div>
                             {% endfor %}
-                            <button type="button" class="btn btn-default select-all">Select all</button>
-                            <button type="button" class="btn btn-default clear-all">Clear all</button>
+                            <button type="button" class="btn btn-primary select-all">Select all</button>
+                            <button type="button" class="btn btn-primary clear-all">Clear all</button>
                         </div>
                     </div>
 

ietf/templates/meeting/edit_session.html

@@ -17,7 +17,7 @@
     {% bootstrap_form form %}
     {% buttons %}
       <button type="submit" class="btn btn-primary">Save</button>
-      <a class="btn btn-default" href="{% url 'ietf.meeting.views.edit_meeting_schedule' num=session.meeting.number %}">Cancel</a>
+      <a class="btn btn-primary" href="{% url 'ietf.meeting.views.edit_meeting_schedule' num=session.meeting.number %}">Cancel</a>
     {% endbuttons %}
   </form>
 {% endblock %}

ietf/templates/meeting/edit_timeslot.html

@@ -25,7 +25,7 @@
     {% bootstrap_form form %}
     {% buttons %}
       <button type="submit" class="btn btn-primary">Save</button>
-      <a class="btn btn-default" href="{% url 'ietf.meeting.views.edit_timeslots' num=timeslot.meeting.number %}">Cancel</a>
+      <a class="btn btn-primary" href="{% url 'ietf.meeting.views.edit_timeslots' num=timeslot.meeting.number %}">Cancel</a>
     {% endbuttons %}
   </form>
 {% endblock %}

ietf/templates/meeting/materials.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static managed_groups %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
@@ -285,5 +285,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/meeting/past.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
@@ -70,5 +70,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/meeting/proceedings.html

@@ -44,7 +44,7 @@
 {% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
@@ -252,5 +252,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/meeting/requests.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
@@ -141,5 +141,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/meeting/timeslot_edit.html

@@ -176,7 +176,7 @@
                     </div>
 
                     <div class="modal-footer">
-                        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cancel</button>
+                        <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Cancel</button>
                         <button type="button" id="confirm-delete-button" class="btn btn-primary">Delete</button>
                     </div>
                 </div>

ietf/templates/meeting/upcoming.html

@@ -5,7 +5,7 @@
 {% load ietf_filters static classname %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
     <link rel="stylesheet" href="{% static "fullcalendar/core/main.css" %}">
     <link rel="stylesheet" href="{% static "fullcalendar/daygrid/main.css" %}">
 
@@ -175,7 +175,7 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
     <script src="{% static 'fullcalendar/core/main.js' %}"></script>
     <script src="{% static 'fullcalendar/daygrid/main.js' %}"></script>
     <script src="{% static 'ietf/js/moment.js' %}"></script>

ietf/templates/nomcom/announcements.html

@@ -4,7 +4,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
@@ -82,5 +82,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/nomcom/eligible.html

@@ -7,7 +7,7 @@
 {% block subtitle %} - Eligible People{% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block nomcom_content %}
@@ -32,5 +32,5 @@
 {% endblock nomcom_content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/nomcom/feedback.html

@@ -50,7 +50,7 @@
                         <h4>{{ p.name }}</h4>
                         <div class="btn-group-vertical form-group">
                             {% for np in p.nomineeposition_set.accepted.not_duplicated %}
-                                <a class="btn btn-primary btn-xs" {% if nomcom.group.state_id != 'conclude' %}href="?nominee={{np.nominee.id}}&position={{ np.position.id}}"{% endif %}>
+                                <a class="btn btn-primary btn-sm" {% if nomcom.group.state_id != 'conclude' %}href="?nominee={{np.nominee.id}}&position={{ np.position.id}}"{% endif %}>
                                     {{ np.nominee.name }}
                                     {% with count=counts|lookup:np.position.id|lookup:np.nominee.id %}
                                         <span class="badge"
@@ -75,7 +75,7 @@
                 <h3>Topics</h3>
                 <div class="btn-group-vertical form-group">
                     {% for t in topics %}
-                        <a class="btn btn-primary btn-xs" {% if nomcom.group.state_id != 'conclude' %}href="?topic={{t.id}}"{% endif %}>
+                        <a class="btn btn-primary btn-sm" {% if nomcom.group.state_id != 'conclude' %}href="?topic={{t.id}}"{% endif %}>
                             {{t.subject}}
                             {% with count=topic_counts|lookup:t.id %}
                                 <span class="badge"

ietf/templates/nomcom/history.html

@@ -5,7 +5,7 @@
 {% load group_filters %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
@@ -807,5 +807,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/nomcom/index.html

@@ -4,7 +4,7 @@
 {% load ietf_filters static %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block title %}NomComs{% endblock %}
@@ -48,5 +48,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/nomcom/private_index.html

@@ -5,7 +5,7 @@
 {% block subtitle %} - Administration {% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block nomcom_content %}
@@ -132,7 +132,7 @@
                     <tr>
                         {% if is_chair and nomcom.group.state_id == 'active' %}
                             <td><input class="batch-select" type="checkbox" value="{{ np.id }}" name="selected"></td>
-                            <td class="edit"><a class="btn btn-primary btn-xs" href="{% url 'ietf.nomcom.views.edit_nominee' year np.nominee.id %}">Edit</a></td>
+                            <td class="edit"><a class="btn btn-primary btn-sm" href="{% url 'ietf.nomcom.views.edit_nominee' year np.nominee.id %}">Edit</a></td>
                         {% endif %}
 
                         <td>
@@ -172,5 +172,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/nomcom/view_feedback.html

@@ -9,7 +9,7 @@
 {% block bodyAttrs %}data-bs-spy="scroll" data-bs-target="#affix"{% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block nomcom_content %}
@@ -139,5 +139,5 @@
 {% endblock %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/nomcom/view_feedback_pending.html

@@ -116,7 +116,7 @@
                                 <td>{{ form.instance.subject }}</td>
 
                                 <td>
-                                    <button type="button" class="btn btn-primary btn-xs" data-bs-toggle="modal" data-bs-target="#modal{{ form.instance.id }}">View</button>
+                                    <button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#modal{{ form.instance.id }}">View</button>
                                 </td>
                             </tr>
 

ietf/templates/nomcom/volunteers.html

@@ -7,7 +7,7 @@
 {% block subtitle %} - Volunteers{% endblock %}
 
 {% block pagehead %}
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block nomcom_content %}
@@ -47,5 +47,5 @@
 {% endblock nomcom_content %}
 
 {% block js %}
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}

ietf/templates/person/person_link.html

@@ -1,15 +1,17 @@
 {# Copyright The IETF Trust 2020, All Rights Reserved #}{% spaceless %}
-    {% if email %}
-        <a {% if title %}title="{{ title }}"{% endif %} href="{% url 'ietf.person.views.profile' email_or_name=email %}">
+    <span class="text-nowrap">
+        {% if email %}
+            <a {% if title %}title="{{ title }}"{% endif %} href="{% url 'ietf.person.views.profile' email_or_name=email %}">
+                <span class="{{class}}">{{ plain_name }}</span>
+            </a>&nbsp;<a href="mailto:{{ email|urlencode }}">
+                <span class="bi bi-envelope tiny"></span>
+            </a>
+        {% elif name %}
+            <a {% if title %}title="{{ title }}"{% endif %} href="{% url 'ietf.person.views.profile' email_or_name=name %}">
+                <span class="{{class}}">{{ plain_name }}</span>
+            </a>
+        {% else %}
             <span class="{{class}}">{{ plain_name }}</span>
-        </a>&nbsp;<a href="mailto:{{ email|urlencode }}">
-            <span class="bi bi-envelope tiny"></span>
-        </a>
-    {% elif name %}
-        <a {% if title %}title="{{ title }}"{% endif %} href="{% url 'ietf.person.views.profile' email_or_name=name %}">
-            <span class="{{class}}">{{ plain_name }}</span>
-        </a>
-    {% else %}
-        <span class="{{class}}">{{ plain_name }}</span>
-    {% endif %}
-{% endspaceless %}
+        {% endif %}
+    </span>
+{% endspaceless %}

ietf/templates/stats/document_stats.html

@@ -8,7 +8,7 @@
 
 {% block pagehead %}
     <link rel="stylesheet" href="{% static 'bootstrap-datepicker/css/bootstrap-datepicker3.min.css' %}">
-    <link rel="stylesheet" href="{% static "ietf/css/datatables.css" %}">
+    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
 {% endblock %}
 
 {% block content %}
@@ -101,5 +101,5 @@
     <script src="{% static 'highcharts/modules/exporting.js' %}"></script>
     <script src="{% static 'highcharts/modules/offline-exporting.js' %}"></script>
     <script src="{% static 'ietf/js/stats.js' %}"></script>
-    <script src="{% static "ietf/js/datatables.js" %}"></script>
+    <script src="{% static "ietf/js/list.js" %}"></script>
 {% endblock %}