Clean up object edit forms

netbox/project-static/styles/netbox.scss

@@ -243,6 +243,7 @@ table {
 
   &.attr-table {
     th {
+      font-weight: normal;
       width: 25%;
     }
   }
@@ -723,10 +724,6 @@ div.paginator > form > div.input-group {
   width: fit-content;
 }
 
-div.field-group:not(:first-of-type) {
-  margin-top: $spacer * 3;
-}
-
 label.required {
   font-weight: $font-weight-bold;
 

netbox/templates/circuits/circuittermination_edit.html

@@ -5,7 +5,7 @@
 {% block title %}{{ obj.circuit.provider }} {{ obj.circuit }} - Side {{ form.term_side.value }}{% endblock %}
 
 {% block form %}
-  <div class="field-group">
+  <div class="field-group my-4">
     <div class="row mb-2">
       <h5 class="offset-sm-3">Circuit Termination</h5>
     </div>
@@ -41,7 +41,7 @@
           </ul>
         </div>
       </div>
-      <div class="tab-content p-0">
+      <div class="tab-content p-0 border-0">
         <div class="tab-pane{% if not providernetwork_tab_active %} active{% endif %}" id="site">
           {% render_field form.region %}
           {% render_field form.site_group %}
@@ -53,7 +53,9 @@
       </div>
     {% endwith %}
   </div>
-  <div class="field-group">
+  <hr />
+
+  <div class="field-group my-4">
     <div class="row mb-2">
       <h5 class="offset-sm-3">Termination Details</h5>
     </div>

netbox/templates/dcim/device_edit.html

@@ -4,7 +4,7 @@
 {% block form %}
     {% render_errors form %}
     
-    <div class="field-group">
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Device</h5>
         </div>
@@ -12,8 +12,9 @@
         {% render_field form.device_role %}
         {% render_field form.tags %}
     </div>
+    <hr />
     
-    <div class="field-group">
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Hardware</h5>
         </div>
@@ -22,8 +23,9 @@
         {% render_field form.serial %}
         {% render_field form.asset_tag %}
     </div>
+    <hr />
     
-    <div class="field-group">
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Location</h5>
         </div>
@@ -56,8 +58,9 @@
             {% render_field form.position %}
         {% endif %}
     </div>
+    <hr />
     
-    <div class="field-group">
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Management</h5>
         </div>
@@ -68,38 +71,43 @@
             {% render_field form.primary_ip6 %}
         {% endif %}
     </div>
+    <hr />
     
-    <div class="field-group">
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Virtualization</h5>
         </div>
         {% render_field form.cluster_group %}
         {% render_field form.cluster %}
     </div>
+    <hr />
     
-    <div class="field-group">
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Tenancy</h5>
         </div>
         {% render_field form.tenant_group %}
         {% render_field form.tenant %}
     </div>
+    <hr />
 
-{% if form.custom_fields %}
-    <div class="field-group">
+    {% if form.custom_fields %}
+      <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Custom Fields</h5>
         </div>
         {% render_custom_fields form %}
-    </div>
+      </div>
+      <hr />
+    {% endif %}
 
-{% endif %}
-    <div class="field-group">
+    <div class="field-group my-4">
         <h5 class="text-center">Local Config Context Data</h5>
         {% render_field form.local_context_data %}
     </div>
+    <hr />
 
-    <div class="field-group">
+    <div class="field-group my-4">
         {% render_field form.comments label='Comments' %}
     </div>
 

netbox/templates/dcim/inc/cable_form.html

@@ -16,8 +16,11 @@
 </div>
 {% render_field form.tags %}
 {% if form.custom_fields %}
+  <hr />
   <div class="field-group">
-      <h4>Custom Fields</h4>
-      {% render_custom_fields form %}
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Custom Fields</h5>
+    </div>
+    {% render_custom_fields form %}
   </div>
 {% endif %}

netbox/templates/dcim/interface_edit.html

@@ -2,7 +2,7 @@
 {% load form_helpers %}
 
 {% block form %}
-    <div class="field-group">
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Interface</h5>
         </div>
@@ -27,7 +27,9 @@
         {% render_field form.mgmt_only %}
         {% render_field form.mark_connected %}
     </div>
-    <div class="field-group">
+    <hr />
+
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">802.1Q Switching</h5>
         </div>
@@ -36,13 +38,15 @@
         {% render_field form.untagged_vlan %}
         {% render_field form.tagged_vlans %}
     </div>
+
     {% if form.custom_fields %}
-        <div class="field-group">
-            <div class="row mb-2">
-              <h5 class="offset-sm-3">Custom Fields</h5>
-            </div>
-            {% render_custom_fields form %}
+      <hr />
+      <div class="field-group my-4">
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Custom Fields</h5>
         </div>
+        {% render_custom_fields form %}
+      </div>
     {% endif %}
 {% endblock %}
 

netbox/templates/dcim/rack_edit.html

@@ -2,7 +2,7 @@
 {% load form_helpers %}
 
 {% block form %}
-    <div class="field-group">
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Rack</h5>
         </div>
@@ -15,7 +15,9 @@
         {% render_field form.role %}
         {% render_field form.tags %}
     </div>
-    <div class="field-group">
+    <hr />
+
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Inventory Control</h5>
         </div>
@@ -23,14 +25,18 @@
         {% render_field form.serial %}
         {% render_field form.asset_tag %}
     </div>
-    <div class="field-group">
+    <hr />
+
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Tenancy</h5>
         </div>
         {% render_field form.tenant_group %}
         {% render_field form.tenant %}
     </div>
-    <div class="field-group">
+    <hr />
+
+    <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Dimensions</h5>
         </div>
@@ -54,15 +60,19 @@
         </div>
         {% render_field form.desc_units %}
     </div>
+    <hr />
+
     {% if form.custom_fields %}
-        <div class="field-group">
+      <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Custom Fields</h5>
         </div>
-            {% render_custom_fields form %}
-        </div>
+          {% render_custom_fields form %}
+      </div>
+      <hr />
     {% endif %}
-    <div class="field-group">
+
+    <div class="field-group my-4">
         {% render_field form.comments label='Comments' %}
     </div>
 {% endblock %}

netbox/templates/dcim/site.html

@@ -209,7 +209,14 @@
                 Locations
             </h5>
             <div class='card-body'>
+              {% if locations %}
                 <table class="table table-hover">
+                    <tr>
+                        <th>Location</th>
+                        <th>Racks</th>
+                        <th>Devices</th>
+                        <th></th>
+                    </tr>
                     {% for location in locations %}
                         <tr>
                             <td style="padding-left: {{ location.level }}8px">
@@ -230,6 +237,9 @@
                         </tr>
                     {% endfor %}
                 </table>
+              {% else %}
+                <span class="text-muted">None</span>
+              {% endif %}
             </div>
         </div>
         <div class="card">

netbox/templates/dcim/virtualchassis_add.html

@@ -2,7 +2,7 @@
 {% load form_helpers %}
 
 {% block form %}
-  <div class="field-group">
+  <div class="field-group my-4">
     <div class="row mb-2">
       <h5 class="offset-sm-3">Virtual Chassis</h5>
     </div>
@@ -10,7 +10,9 @@
     {% render_field form.domain %}
     {% render_field form.tags %}
   </div>
-  <div class="field-group">
+  <hr />
+
+  <div class="field-group my-4">
     <div class="row mb-2">
       <h5 class="offset-sm-3">Member Devices</h5>
     </div>
@@ -21,8 +23,10 @@
     {% render_field form.members %}
     {% render_field form.initial_position %}
   </div>
+
   {% if form.custom_fields %}
-    <div class="field-group">
+    <hr />
+    <div class="field-group my-4">
       <div class="row mb-2">
         <h5 class="offset-sm-3">Custom Fields</h5>
       </div>

netbox/templates/dcim/virtualchassis_edit.html

@@ -11,7 +11,7 @@
         {% csrf_token %}
         {{ pk_form.pk }}
         {{ formset.management_form }}
-        <div class="field-group">
+        <div class="field-group my-4">
           <div class="row mb-2">
             <h5 class="offset-sm-3">Virtual Chassis</h5>
           </div>
@@ -20,14 +20,18 @@
           {% render_field vc_form.master %}
           {% render_field vc_form.tags %}
         </div>
+        <hr />
+
         {% if vc_form.custom_fields %}
-          <div class="field-group">
+          <div class="field-group my-4">
             <div class="row mb-2">
               <h5 class="offset-sm-3">Custom Fields</h5>
             </div>
             {% render_custom_fields vc_form %}
           </div>
+          <hr />
         {% endif %}
+
         <div class="field-group mb-5">
           <h5 class="text-center">Members</h5>
           <table class="table">

netbox/templates/generic/object_edit.html

@@ -42,7 +42,7 @@
 
             {# Render grouped fields according to Form #}
             {% for group, fields in form.Meta.fieldsets %}
-              <div class="field-group">
+              <div class="field-group my-4">
                 <div class="row mb-2">
                   <h5 class="offset-sm-3">{{ group }}</h5>
                 </div>
@@ -50,11 +50,15 @@
                     {% render_field form|getfield:name %}
                 {% endfor %}
               </div>
+              {% if not forloop.last %}
+                <hr />
+              {% endif %}
             {% endfor %}
 
             {% if form.custom_fields %}
-              <div class="field-group">
-                <div class="row mb-1">
+              <hr />
+              <div class="field-group my-4">
+                <div class="row mb-2">
                   <h5 class="offset-sm-3">Custom Fields</h5>
                 </div>
                 {% render_custom_fields form %}
@@ -62,14 +66,15 @@
             {% endif %}
 
             {% if form.comments %}
-              <div class="field-group">
+              <hr />
+              <div class="field-group my-4">
                 {% render_field form.comments label='Comments' %}
               </div>
             {% endif %}
 
           {% else %}
             {# Render all fields in a single group #}
-            <div class="field-group">
+            <div class="field-group my-4">
               {% block form_fields %}{% render_form form %}{% endblock %}
             </div>
           {% endif %}

netbox/templates/inc/filter_list.html

@@ -48,7 +48,7 @@
         <i class="mdi mdi-backspace"></i> Reset
       </button>
       <button type="submit" class="btn btn-sm btn-primary m-1">
-        <i class="mdi mdi-filter-variant"></i> Filter
+        <i class="mdi mdi-magnify"></i> Search
       </button>
     </div>
   </div>

netbox/templates/ipam/ipaddress_bulk_add.html

@@ -9,8 +9,10 @@
 {% endblock %}
 
 {% block form %}
-    <div class="field-group">
-        <h5 class="text-center">IP Addresses</h5>
+    <div class="field-group my-4">
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">IP Addresses</h5>
+        </div>
         {% render_field form.pattern %}
         {% render_field model_form.status %}
         {% render_field model_form.role %}
@@ -18,14 +20,21 @@
         {% render_field model_form.description %}
         {% render_field model_form.tags %}
     </div>
-    <div class="field-group">
-        <h5 class="text-center">Tenancy</h5>
+    <hr />
+
+    <div class="field-group my-4">
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Tenancy</h5>
+        </div>
         {% render_field model_form.tenant_group %}
         {% render_field model_form.tenant %}
     </div>
     {% if model_form.custom_fields %}
-        <div class="field-group">
-            <h5 class="text-center">Custom Fields</h5>
+        <hr />
+        <div class="field-group my-4">
+            <div class="row mb-2">
+              <h5 class="offset-sm-3">Custom Fields</h5>
+            </div>
             {% render_custom_fields model_form %}
         </div>
     {% endif %}

netbox/templates/ipam/ipaddress_edit.html

@@ -8,7 +8,7 @@
 {% endblock tabs %}
 
 {% block form %}
-    <div class="field-group">
+    <div class="field-group my-4">
       <div class="row mb-2">
         <h5 class="offset-sm-3">IP Address</h5>
       </div>
@@ -20,14 +20,18 @@
       {% render_field form.description %}
       {% render_field form.tags %}
     </div>
-    <div class="field-group">
+    <hr />
+
+    <div class="field-group my-4">
       <div class="row mb-2">
         <h5 class="offset-sm-3">Tenancy</h5>
       </div>
       {% render_field form.tenant_group %}
       {% render_field form.tenant %}
     </div>
-    <div class="field-group">
+    <hr />
+
+    <div class="field-group my-4">
       <div class="row mb-2">
         <h5 class="offset-sm-3">Interface Assignment</h5>
       </div>
@@ -64,7 +68,7 @@
             </ul>
           </div>
         </div>
-        <div class="tab-content p-0">
+        <div class="tab-content p-0 border-0">
           <div class="tab-pane {% if not vm_tab_active %}active{% endif %}" id="device" role="tabpanel" aria-labeled-by="device_tab">
             {% render_field form.device %}
             {% render_field form.interface %}
@@ -77,7 +81,9 @@
         </div>
       {% endwith %}
     </div>
-    <div class="field-group">
+    <hr />
+
+    <div class="field-group my-4">
       <div class="row mb-2">
         <h5 class="offset-sm-3">NAT IP (Inside)</h5>
       </div>
@@ -126,7 +132,7 @@
           </ul>
         </div>
       </div>
-      <div class="tab-content p-0">
+      <div class="tab-content p-0 border-0">
           <div class="tab-pane active" id="by_device" aria-labelledby="device_tab" role="tabpanel">
               {% render_field form.nat_region %}
               {% render_field form.nat_site_group %}
@@ -144,8 +150,10 @@
           {% render_field form.nat_inside %}
       </div>
     </div>
+
     {% if form.custom_fields %}
-      <div class="field-group">
+      <hr />
+      <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Custom Fields</h5>
         </div>

netbox/templates/ipam/service_edit.html

@@ -2,7 +2,7 @@
 {% load form_helpers %}
 
 {% block form %}
-  <div class="field-group">
+  <div class="field-group my-4">
     <div class="row mb-2">
       <h5 class="offset-sm-3">Service</h5>
     </div>
@@ -41,7 +41,9 @@
     {% render_field form.description %}
     {% render_field form.tags %}
   </div>
+
   {% if form.custom_fields %}
+    <hr />
     <div class="row mb-2">
       <h5 class="offset-sm-3">Custom Fields</h5>
     </div>

netbox/templates/ipam/vlan_edit.html

@@ -4,7 +4,7 @@
 {% load helpers %}
 
 {% block form %}
-  <div class="field-group mb-3">
+  <div class="field-group my-4">
     <div class="row mb-2">
       <h5 class="offset-sm-3">VLAN</h5>
     </div>
@@ -15,14 +15,18 @@
     {% render_field form.description %}
     {% render_field form.tags %}
   </div>
-  <div class="field-group mb-3">
+  <hr />
+
+  <div class="field-group my-4">
     <div class="row mb-2">
       <h5 class="offset-sm-3">Tenancy</h5>
     </div>
     {% render_field form.tenant_group %}
     {% render_field form.tenant %}
   </div>
-  <div class="field-group mb-3">
+  <hr />
+
+  <div class="field-group my-4">
     <div class="row mb-2">
       <h5 class="offset-sm-3">Assignment</h5>
     </div>
@@ -39,7 +43,7 @@
           </ul>
         </div>
       </div>
-      <div class="tab-content p-0">
+      <div class="tab-content p-0 border-0">
         <div class="tab-pane{% if not site_tab_active %} active{% endif %}" id="group">
           {% render_field form.scope_type %}
           {% render_field form.group %}
@@ -52,8 +56,10 @@
       </div>
     {% endwith %}
   </div>
+
   {% if form.custom_fields %}
-    <div class="field-group">
+    <hr />
+    <div class="field-group my-4">
       <div class="row mb-2">
         <h5 class="offset-sm-3">Custom Fields</h5>
       </div>

netbox/templates/virtualization/vminterface_edit.html

@@ -2,7 +2,7 @@
 {% load form_helpers %}
 
 {% block form %}
-    <div class="field-group">
+    <div class="field-group my-4">
       <div class="row mb-2">
         <h5 class="offset-sm-3">Interface</h5>
       </div>
@@ -22,7 +22,9 @@
       {% render_field form.description %}
       {% render_field form.tags %}
     </div>
-    <div class="field-group">
+    <hr />
+
+    <div class="field-group my-4">
       <div class="row mb-2">
         <h5 class="offset-sm-3">802.1Q Switching</h5>
       </div>
@@ -31,8 +33,10 @@
       {% render_field form.untagged_vlan %}
       {% render_field form.tagged_vlans %}
     </div>
+
     {% if form.custom_fields %}
-      <div class="field-group">
+      <hr />
+      <div class="field-group my-4">
         <div class="row mb-2">
           <h5 class="offset-sm-3">Custom Fields</h5>
         </div>