From 0f99e5fcaa0d549b4d1dc57fe62833aba5c61277 Mon Sep 17 00:00:00 2001
From: jeremystretch <jstretch@ns1.com>
Date: Sat, 10 Jul 2021 22:06:28 -0400
Subject: [PATCH] Clean up object list view

---
 netbox/templates/base/layout.html         |   2 +-
 netbox/templates/generic/object_list.html | 164 +++++++++++-----------
 netbox/templates/inc/advanced_search.html | 124 ++++++++--------
 netbox/templates/inc/paginator.html       |   2 +-
 netbox/templates/inc/table.html           |   1 -
 5 files changed, 146 insertions(+), 147 deletions(-)

diff --git a/netbox/templates/base/layout.html b/netbox/templates/base/layout.html
index efe82548f..c2d7eeb2a 100644
--- a/netbox/templates/base/layout.html
+++ b/netbox/templates/base/layout.html
@@ -95,7 +95,7 @@
 
         {# Page header #}
         {% block header %}
-          <div class="title-container px-3 py-3">
+          <div class="title-container px-3 pb-3">
 
             {# Title #}
             <div id="content-title">
diff --git a/netbox/templates/generic/object_list.html b/netbox/templates/generic/object_list.html
index 8c680cd95..5f73eb0cd 100644
--- a/netbox/templates/generic/object_list.html
+++ b/netbox/templates/generic/object_list.html
@@ -25,98 +25,96 @@
 
 {% block content %}
 {% if filter_form %}
-    <div class="col col-md-12 noprint">
-        {% include 'inc/advanced_search.html' %}
-    </div>
+  {% include 'inc/advanced_search.html' %}
 {% endif %}
 {% if table.paginator.num_pages > 1 %}
 {% with bulk_edit_url=content_type.model_class|validated_viewname:"bulk_edit" bulk_delete_url=content_type.model_class|validated_viewname:"bulk_delete" %}
-<div class="row mb-3">
-    <form method="post" class="form col-md-12">
+  <div id="select-all-box" class="d-none card noprint">
+    <div class="row mb-3">
+      <form method="post" class="form col-md-12">
         {% csrf_token %}
-        <div id="select-all-box" class="d-none card noprint">
-            <div class="card-body d-inline-flex justify-content-between align-items-center">
-                <div class="form-check">
-                    <input type="checkbox" id="select-all" name="_all" class="form-check-input" />
-                    <label for="select-all" class="form-check-label">
-                        Select <strong>all {{ table.rows|length }} {{ table.data.verbose_name_plural }}</strong> Matching Query
-                    </label>
-                </div>
-                <div class="float-end">
-                    {% if bulk_edit_url and permissions.change %}
-                        <button type="submit" name="_edit" formaction="{% url bulk_edit_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-warning btn-sm" disabled>
-                            <span class="mdi mdi-pencil" aria-hidden="true"></span> Edit All
-                        </button>
-                    {% endif %}
-                    {% if bulk_delete_url and permissions.delete %}
-                        <button type="submit" name="_delete" formaction="{% url bulk_delete_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-danger btn-sm" disabled>
-                            <span class="mdi mdi-trash-can-outline" aria-hidden="true"></span> Delete All
-                        </button>
-                    {% endif %}
-                </div>
-            </div>
+        <div class="card-body d-inline-flex justify-content-between align-items-center">
+          <div class="form-check">
+            <input type="checkbox" id="select-all" name="_all" class="form-check-input" />
+            <label for="select-all" class="form-check-label">
+              Select <strong>all {{ table.rows|length }} {{ table.data.verbose_name_plural }}</strong> Matching Query
+            </label>
+          </div>
+          <div class="float-end">
+            {% if bulk_edit_url and permissions.change %}
+              <button type="submit" name="_edit" formaction="{% url bulk_edit_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-warning btn-sm" disabled>
+                <span class="mdi mdi-pencil" aria-hidden="true"></span> Edit All
+              </button>
+            {% endif %}
+            {% if bulk_delete_url and permissions.delete %}
+              <button type="submit" name="_delete" formaction="{% url bulk_delete_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-danger btn-sm" disabled>
+                <span class="mdi mdi-trash-can-outline" aria-hidden="true"></span> Delete All
+              </button>
+            {% endif %}
+          </div>
         </div>
-    </form>
-</div>
+      </form>
+    </div>
+  </div>
 {% endwith %}
 {% endif %}
+
+{# Object list filter, table config #}
 <div class="row mb-3">
-    <div class="col col-md-12">
-        <div class="card">
-            <div class="card-header">
-                <div class="row">
-                    <div class="col col-md-4 offset-md-8 d-flex noprint table-controls">
-                        <div class="input-group input-group-sm">
-                            <input type="text" class="form-control object-filter" placeholder="Filter" title="Filter text (regular expressions supported)" />
-                            {% if request.user.is_authenticated and table_config_form %}
-                                <button type="button" class="btn btn-outline-dark btn-sm" data-bs-toggle="modal" data-bs-target="#ObjectTable_config" title="Configure Table">
-                                    <i class="mdi mdi-table-eye"></i>
-                                </button>
-                            {% endif %}
-                            {% if filter_form %}
-                            <button
-                                type="button"
-                                class="btn btn-sm btn-outline-dark"
-                                data-bs-toggle="collapse"
-                                data-bs-target="#advanced-search-content">
-                                Advanced Search
-                            </button>
-                        {% endif %}
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="card-body">
-                {% with bulk_edit_url=content_type.model_class|validated_viewname:"bulk_edit" bulk_delete_url=content_type.model_class|validated_viewname:"bulk_delete" %}
-                {% if permissions.change or permissions.delete %}
-                <form method="post" class="form form-horizontal">
-                    {% csrf_token %}
-                    <input type="hidden" name="return_url" value="{% if return_url %}{{ return_url }}{% else %}{{ request.path }}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}{% endif %}" />
-                    {% include table_template|default:'inc/responsive_table.html' %}
-                    <div class="float-start noprint bulk-buttons">
-                        {% block bulk_buttons %}{% endblock %}
-                        {% if bulk_edit_url and permissions.change %}
-                        <button type="submit" name="_edit" formaction="{% url bulk_edit_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-warning btn-sm">
-                            <i class="mdi mdi-pencil" aria-hidden="true"></i> Edit Selected
-                        </button>
-                        {% endif %}
-                        {% if bulk_delete_url and permissions.delete %}
-                        <button type="submit" name="_delete" formaction="{% url bulk_delete_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-danger btn-sm">
-                            <i class="mdi mdi-trash-can-outline" aria-hidden="true"></i> Delete Selected
-                        </button>
-                        {% endif %}
-                    </div>
-                </form>
-                {% else %}
-                    <div class="table-responsive">
-                        {% render_table table 'inc/table.html' %}
-                    </div>
-                {% endif %}
-                {% endwith %}
-                {% include 'inc/paginator.html' with paginator=table.paginator page=table.page %}
-            </div>
-        </div>
+  <div class="col col-md-4 offset-md-8 d-flex noprint table-controls">
+    <div class="input-group input-group-sm">
+      <input type="text" class="form-control object-filter" placeholder="Filter" title="Filter text (regular expressions supported)" />
+      {% if request.user.is_authenticated and table_config_form %}
+        <button type="button" class="btn btn-outline-dark btn-sm" data-bs-toggle="modal" data-bs-target="#ObjectTable_config" title="Configure Table">
+          <i class="mdi mdi-table-eye"></i>
+        </button>
+      {% endif %}
+      {% if filter_form %}
+      <button
+        type="button"
+        class="btn btn-sm btn-outline-dark"
+        data-bs-toggle="collapse"
+        data-bs-target="#advanced-search-content">
+        Advanced Search
+      </button>
+    {% endif %}
     </div>
+  </div>
+</div>
+
+{# Object table #}
+<div class="row">
+  <div class="col col-md-12">
+    {% with bulk_edit_url=content_type.model_class|validated_viewname:"bulk_edit" bulk_delete_url=content_type.model_class|validated_viewname:"bulk_delete" %}
+      {% if permissions.change or permissions.delete %}
+        <form method="post" class="form form-horizontal">
+          {% csrf_token %}
+          <input type="hidden" name="return_url" value="{% if return_url %}{{ return_url }}{% else %}{{ request.path }}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}{% endif %}" />
+          <div class="table-responsive">
+            {% render_table table 'inc/table.html' %}
+          </div>
+          <div class="float-start noprint bulk-buttons">
+            {% block bulk_buttons %}{% endblock %}
+            {% if bulk_edit_url and permissions.change %}
+            <button type="submit" name="_edit" formaction="{% url bulk_edit_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-warning btn-sm">
+              <i class="mdi mdi-pencil" aria-hidden="true"></i> Edit Selected
+            </button>
+            {% endif %}
+            {% if bulk_delete_url and permissions.delete %}
+            <button type="submit" name="_delete" formaction="{% url bulk_delete_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-danger btn-sm">
+              <i class="mdi mdi-trash-can-outline" aria-hidden="true"></i> Delete Selected
+            </button>
+            {% endif %}
+          </div>
+        </form>
+      {% else %}
+        <div class="table-responsive">
+          {% render_table table 'inc/table.html' %}
+        </div>
+      {% endif %}
+    {% endwith %}
+    {% include 'inc/paginator.html' with paginator=table.paginator page=table.page %}
+  </div>
 </div>
 {% table_config_form table table_name="ObjectTable" %}
 {% endblock content %}
diff --git a/netbox/templates/inc/advanced_search.html b/netbox/templates/inc/advanced_search.html
index 43ea21e32..d8f99b429 100644
--- a/netbox/templates/inc/advanced_search.html
+++ b/netbox/templates/inc/advanced_search.html
@@ -1,65 +1,67 @@
 {% load form_helpers %}
 {% load helpers %}
 
-<div class="collapse" id="advanced-search-content">
-    <form action="." method="get">
-        <div class="card">
-            <h5 class="card-header">
-                Advanced Search
-            </h5>
-            <div class="card-body overflow-visible d-flex flex-wrap justify-content-between py-3">
-                    {% for field in filter_form.hidden_fields %}
-                        {{ field }}
-                    {% endfor %}
-                    {% if filter_form.field_groups %}
-                        {% for group in filter_form.field_groups %}
-                            <div class="col">
-                                {% for name in group %}
-                                    {% with field=filter_form|get_item:name %}
-                                        {% if field|widget_type == 'checkboxinput' %}
-                                            <div class="form-check mb-3">
-                                                <label class="form-check-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
-                                                {{ field }}
-                                            </div>
-                                        {% else %}
-                                            <div class="form-floating mb-3 mx-3">
-                                                {{ field }}
-                                                {{ field.label_tag }}
-                                            </div>
-                                        {% endif %}
-                                    {% endwith %}
-                                {% endfor %}
-                            </div>
-                        {% endfor %}
-                    {% else %}
-                        {% for field in filter_form.visible_fields %}
-                            <div class="col">
-                                {% if field|widget_type == 'checkboxinput' %}
-                                    <div class="form-check mb-3">
-                                        <label class="form-check-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
-                                        {{ field }}
-                                    </div>
-                                {% else %}
-                                    <div class="form-floating mb-3">
-                                        {{ field }}
-                                        {{ field.label_tag }}
-                                    </div>
-                                {% endif %}
-                            </div>
-                        {% endfor %}
-                    {% endif %}
-            </div>
-            <div class="card-footer text-end noprint border-0">
-                <button type="button" class="btn btn-sm btn-outline-dark m-1" data-bs-toggle="collapse" data-bs-target="#advanced-search-content">
-                    <i class="mdi mdi-close"></i> Close
-                </button>
-                <button type="button" class="btn btn-sm btn-outline-danger m-1" data-reset-select>
-                    <i class="mdi mdi-backspace"></i> Reset
-                </button>
-                <button type="submit" class="btn btn-sm btn-primary m-1">
-                    <i class="mdi mdi-magnify"></i> Search
-                </button>
-            </div>
-        </div>
-    </form>
+<div id="advanced-search-content" class="collapse mb-3">
+  <div class="col col-md-12 noprint">
+      <form action="." method="get">
+          <div class="card">
+              <h5 class="card-header">
+                  Advanced Search
+              </h5>
+              <div class="card-body overflow-visible d-flex flex-wrap justify-content-between py-3">
+                      {% for field in filter_form.hidden_fields %}
+                          {{ field }}
+                      {% endfor %}
+                      {% if filter_form.field_groups %}
+                          {% for group in filter_form.field_groups %}
+                              <div class="col">
+                                  {% for name in group %}
+                                      {% with field=filter_form|get_item:name %}
+                                          {% if field|widget_type == 'checkboxinput' %}
+                                              <div class="form-check mb-3">
+                                                  <label class="form-check-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
+                                                  {{ field }}
+                                              </div>
+                                          {% else %}
+                                              <div class="form-floating mb-3 mx-3">
+                                                  {{ field }}
+                                                  {{ field.label_tag }}
+                                              </div>
+                                          {% endif %}
+                                      {% endwith %}
+                                  {% endfor %}
+                              </div>
+                          {% endfor %}
+                      {% else %}
+                          {% for field in filter_form.visible_fields %}
+                              <div class="col">
+                                  {% if field|widget_type == 'checkboxinput' %}
+                                      <div class="form-check mb-3">
+                                          <label class="form-check-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
+                                          {{ field }}
+                                      </div>
+                                  {% else %}
+                                      <div class="form-floating mb-3">
+                                          {{ field }}
+                                          {{ field.label_tag }}
+                                      </div>
+                                  {% endif %}
+                              </div>
+                          {% endfor %}
+                      {% endif %}
+              </div>
+              <div class="card-footer text-end noprint border-0">
+                  <button type="button" class="btn btn-sm btn-outline-dark m-1" data-bs-toggle="collapse" data-bs-target="#advanced-search-content">
+                      <i class="mdi mdi-close"></i> Close
+                  </button>
+                  <button type="button" class="btn btn-sm btn-outline-danger m-1" data-reset-select>
+                      <i class="mdi mdi-backspace"></i> Reset
+                  </button>
+                  <button type="submit" class="btn btn-sm btn-primary m-1">
+                      <i class="mdi mdi-magnify"></i> Search
+                  </button>
+              </div>
+          </div>
+      </form>
+  </div>
 </div>
diff --git a/netbox/templates/inc/paginator.html b/netbox/templates/inc/paginator.html
index d0e9a0339..c55203be3 100644
--- a/netbox/templates/inc/paginator.html
+++ b/netbox/templates/inc/paginator.html
@@ -1,6 +1,6 @@
 {% load helpers %}
 
-<div class="paginator float-end text-end my-3">
+<div class="paginator float-end text-end">
     {% if paginator.num_pages > 1 %}
     <div class="btn-group btn-group-sm mb-3" role="group" aria-label="Pages">    
     {% if page.has_previous %}
diff --git a/netbox/templates/inc/table.html b/netbox/templates/inc/table.html
index e1800ab83..3710af846 100644
--- a/netbox/templates/inc/table.html
+++ b/netbox/templates/inc/table.html
@@ -1,7 +1,6 @@
 {% load django_tables2 %}
 
 <table{% if table.attrs %} {{ table.attrs.as_html }}{% endif %}>
-    <caption class="text-center small mt-3"></caption>
     {% if table.show_header %}
         <thead>
             <tr>