Clean up object edit forms

netbox/ipam/forms.py

@@ -1422,6 +1422,10 @@ class VLANGroupForm(BootstrapMixin, CustomFieldModelForm):
             'name', 'slug', 'description', 'scope_type', 'region', 'sitegroup', 'site', 'location', 'rack',
             'clustergroup', 'cluster',
         ]
+        fieldsets = (
+            ('VLAN Group', ('name', 'slug', 'description')),
+            ('Scope', ('scope_type', 'region', 'sitegroup', 'site', 'location', 'rack', 'clustergroup', 'cluster')),
+        )
         widgets = {
             'scope_type': StaticSelect,
         }

netbox/ipam/views.py

@@ -769,7 +769,6 @@ class VLANGroupView(generic.ObjectView):
 class VLANGroupEditView(generic.ObjectEditView):
     queryset = VLANGroup.objects.all()
     model_form = forms.VLANGroupForm
-    template_name = 'ipam/vlangroup_edit.html'
 
 
 class VLANGroupDeleteView(generic.ObjectDeleteView):

netbox/project-static/styles/netbox.scss

@@ -725,15 +725,6 @@ div.paginator > form > div.input-group {
 
 div.field-group:not(:first-of-type) {
   margin-top: $spacer * 3;
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    margin-bottom: $spacer;
-  }
 }
 
 label.required {

netbox/templates/circuits/circuittermination_edit.html

@@ -6,54 +6,62 @@
 
 {% block form %}
   <div class="field-group">
-    <h4 class="mb-3">Termination</h4>
-        <div class="row mb-3">
-            <label class="col-sm-3 col-form-label">Provider</label>
-            <div class="col">
-                <input class="form-control" value="{{ obj.circuit.provider }}" disabled />
-            </div>
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Circuit Termination</h5>
+    </div>
+    <div class="row mb-3">
+        <label class="col-sm-3 col-form-label text-lg-end">Provider</label>
+        <div class="col">
+            <input class="form-control" value="{{ obj.circuit.provider }}" disabled />
         </div>
-        <div class="row mb-3">
-            <label class="col-sm-3 col-form-label">Circuit</label>
-            <div class="col">
-                <input class="form-control" value="{{ obj.circuit.cid }}" disabled />
-            </div>
+    </div>
+    <div class="row mb-3">
+        <label class="col-sm-3 col-form-label text-lg-end">Circuit</label>
+        <div class="col">
+            <input class="form-control" value="{{ obj.circuit.cid }}" disabled />
         </div>
-        <div class="row mb-3">
-            <label class="col-sm-3 col-form-label">Termination</label>
-            <div class="col">
-                <input class="form-control" value="{{ form.term_side.value }}" disabled />
-            </div>
+    </div>
+    <div class="row mb-3">
+        <label class="col-sm-3 col-form-label text-lg-end">Termination</label>
+        <div class="col">
+            <input class="form-control" value="{{ form.term_side.value }}" disabled />
         </div>
-        {% render_field form.mark_connected %}
-        {% with providernetwork_tab_active=form.initial.provider_network %}
-            <ul class="nav nav-tabs" role="tablist">
+    </div>
+    {% render_field form.mark_connected %}
+    {% with providernetwork_tab_active=form.initial.provider_network %}
+      <div class="row mb-2">
+        <div class="offset-sm-3">
+          <ul class="nav nav-pills" role="tablist">
             <li class="nav-item" role="presentation">
-                <button class="nav-link{% if not providernetwork_tab_active %} active{% endif %}" role="tab" type="button" data-bs-target="#site" data-bs-toggle="tab">Site</button>
+              <button class="nav-link{% if not providernetwork_tab_active %} active{% endif %}" role="tab" type="button" data-bs-target="#site" data-bs-toggle="tab">Site</button>
             </li>
             <li class="nav-item" role="presentation">
-                <button class="nav-link{% if providernetwork_tab_active %} active{% endif %}" role="tab" type="button" data-bs-toggle="tab" data-bs-target="#providernetwork">Provider Network</button>
+              <button class="nav-link{% if providernetwork_tab_active %} active{% endif %}" role="tab" type="button" data-bs-toggle="tab" data-bs-target="#providernetwork">Provider Network</button>
             </li>
-            </ul>
-            <div class="tab-content">
-                <div class="tab-pane{% if not providernetwork_tab_active %} active{% endif %}" id="site">
-                    {% render_field form.region %}
-                    {% render_field form.site_group %}
-                    {% render_field form.site %}
-                </div>
-                <div class="tab-pane{% if providernetwork_tab_active %} active{% endif %}" id="providernetwork">
-                    {% render_field form.provider_network %}
-                </div>
-            </div>
-        {% endwith %}
+          </ul>
+        </div>
+      </div>
+      <div class="tab-content p-0">
+        <div class="tab-pane{% if not providernetwork_tab_active %} active{% endif %}" id="site">
+          {% render_field form.region %}
+          {% render_field form.site_group %}
+          {% render_field form.site %}
+        </div>
+        <div class="tab-pane{% if providernetwork_tab_active %} active{% endif %}" id="providernetwork">
+          {% render_field form.provider_network %}
+        </div>
+      </div>
+    {% endwith %}
   </div>
   <div class="field-group">
-    <h4 class="mb-3">Termination Details</h4>
-        {% render_field form.port_speed %}
-        {% render_field form.upstream_speed %}
-        {% render_field form.xconnect_id %}
-        {% render_field form.pp_info %}
-        {% render_field form.description %}
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Termination Details</h5>
+    </div>
+    {% render_field form.port_speed %}
+    {% render_field form.upstream_speed %}
+    {% render_field form.xconnect_id %}
+    {% render_field form.pp_info %}
+    {% render_field form.description %}
   </div>
 {% endblock %}
 

netbox/templates/dcim/cable_connect.html

@@ -5,162 +5,169 @@
 
 {% block title %}Connect {{ form.instance.termination_a.device }} {{ form.instance.termination_a }} to {{ termination_b_type|bettertitle }}{% endblock %}
 
-{% block content %}
-{% with termination_a=form.instance.termination_a %}
-{% render_errors form %}
-<form method="post">
-    {% csrf_token %}
-    {% for field in form.hidden_fields %}
-        {{ field }}
-    {% endfor %}
-    <div class="row my-3">
-        <div class="col col-md-5">
-            <div class="card h-100">
-                <h5 class="card-header">
-                    A Side
-                </h5>
-                <div class="card-body">
-                    {% if termination_a.device %}
-                        {# Device component #}
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label text-lg-end">Region</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.device.site.region }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label text-lg-end">Site</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.device.site }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label text-lg-end">Location</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.device.location|default:"None" }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label text-lg-end">Rack</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.device.rack|default:"None" }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label text-lg-end">Device</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.device }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label text-lg-end">Type</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a|meta:"verbose_name"|capfirst }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label text-lg-end">Name</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a }}" disabled />
-                            </div>
-                        </div>
-                    {% else %}
-                        {# Circuit termination #}
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label">Site</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.site }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label">Provider</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.circuit.provider }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label">Circuit</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.circuit.cid }}" disabled />
-                            </div>
-                        </div>
-                        <div class="row mb-3">
-                            <label class="col-sm-3 col-form-label">Side</label>
-                            <div class="col">
-                                <input class="form-control" value="{{ termination_a.term_side }}" disabled />
-                            </div>
-                        </div>
-                    {% endif %}
-                </div>
-            </div>
-        </div>
-        <div class="col col-md-2 flex-column justify-content-center align-items-center d-none d-md-flex">
-            <i class="mdi mdi-swap-horizontal-bold mdi-48px"></i>
-        </div>
-        <div class="col col-md-5">
-            <div class="card h-100">
-                <h5 class="card-header">
-                    B Side
-                </h5>
-                <div class="card-body">
-                    {% if tabs %}
-                        <ul class="nav nav-tabs">
-                            {% for url, link in tabs %}
-                                <li class="nav-item" role="presentation">
-                                    <a class="nav-link" href="{{ url }}">{{ link }}</a>
-                                </li>
-                            {% endfor %}
-                        </ul>
-                    {% endif %}
-                    {% if 'termination_b_provider' in form.fields %}
-                        {% render_field form.termination_b_provider %}
-                    {% endif %}
-                    {% if 'termination_b_region' in form.fields %}
-                        {% render_field form.termination_b_region %}
-                    {% endif %}
-                    {% if 'termination_b_site' in form.fields %}
-                        {% render_field form.termination_b_site %}
-                    {% endif %}
-                    {% if 'termination_b_location' in form.fields %}
-                        {% render_field form.termination_b_location %}
-                    {% endif %}
-                    {% if 'termination_b_rack' in form.fields %}
-                        {% render_field form.termination_b_rack %}
-                    {% endif %}
-                    {% if 'termination_b_device' in form.fields %}
-                        {% render_field form.termination_b_device %}
-                    {% endif %}
-                    {% if 'termination_b_type' in form.fields %}
-                        {% render_field form.termination_b_type %}
-                    {% endif %}
-                    {% if 'termination_b_powerpanel' in form.fields %}
-                        {% render_field form.termination_b_powerpanel %}
-                    {% endif %}
-                    {% if 'termination_b_circuit' in form.fields %}
-                        {% render_field form.termination_b_circuit %}
-                    {% endif %}
-                    <div class="row mb-3">
-                        <label class="col-sm-3 col-form-label text-lg-end">Type</label>
-                        <div class="col">
-                            <input class="form-control" value="{{ termination_b_type|capfirst }}" disabled />
-                        </div>
-                    </div>
-                    {% render_field form.termination_b_id %}
-                </div>
-            </div>
-        </div>
-    </div>
-    <div class="row my-3 justify-content-center">
+{% block content-wrapper %}
+  <div class="tab-content">
+    {% with termination_a=form.instance.termination_a %}
+      {% render_errors form %}
+      <form method="post">
+      {% csrf_token %}
+      {% for field in form.hidden_fields %}
+          {{ field }}
+      {% endfor %}
+      <div class="row my-3">
+          <div class="col col-md-5">
+              <div class="card h-100">
+                  <h5 class="card-header">
+                      A Side
+                  </h5>
+                  <div class="card-body">
+                      {% if termination_a.device %}
+                          {# Device component #}
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label text-lg-end">Region</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.device.site.region }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label text-lg-end">Site</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.device.site }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label text-lg-end">Location</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.device.location|default:"None" }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label text-lg-end">Rack</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.device.rack|default:"None" }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label text-lg-end">Device</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.device }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label text-lg-end">Type</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a|meta:"verbose_name"|capfirst }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label text-lg-end">Name</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a }}" disabled />
+                              </div>
+                          </div>
+                      {% else %}
+                          {# Circuit termination #}
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label">Site</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.site }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label">Provider</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.circuit.provider }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label">Circuit</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.circuit.cid }}" disabled />
+                              </div>
+                          </div>
+                          <div class="row mb-3">
+                              <label class="col-sm-3 col-form-label">Side</label>
+                              <div class="col">
+                                  <input class="form-control" value="{{ termination_a.term_side }}" disabled />
+                              </div>
+                          </div>
+                      {% endif %}
+                  </div>
+              </div>
+          </div>
+          <div class="col col-md-2 flex-column justify-content-center align-items-center d-none d-md-flex">
+              <i class="mdi mdi-swap-horizontal-bold mdi-48px"></i>
+          </div>
+          <div class="col col-md-5">
+              <div class="card h-100">
+                  <h5 class="card-header">
+                      B Side
+                  </h5>
+                  <div class="card-body">
+                      {% if tabs %}
+                          <ul class="nav nav-tabs">
+                              {% for url, link in tabs %}
+                                  <li class="nav-item" role="presentation">
+                                      <a class="nav-link" href="{{ url }}">{{ link }}</a>
+                                  </li>
+                              {% endfor %}
+                          </ul>
+                      {% endif %}
+                      {% if 'termination_b_provider' in form.fields %}
+                          {% render_field form.termination_b_provider %}
+                      {% endif %}
+                      {% if 'termination_b_region' in form.fields %}
+                          {% render_field form.termination_b_region %}
+                      {% endif %}
+                      {% if 'termination_b_site' in form.fields %}
+                          {% render_field form.termination_b_site %}
+                      {% endif %}
+                      {% if 'termination_b_location' in form.fields %}
+                          {% render_field form.termination_b_location %}
+                      {% endif %}
+                      {% if 'termination_b_rack' in form.fields %}
+                          {% render_field form.termination_b_rack %}
+                      {% endif %}
+                      {% if 'termination_b_device' in form.fields %}
+                          {% render_field form.termination_b_device %}
+                      {% endif %}
+                      {% if 'termination_b_type' in form.fields %}
+                          {% render_field form.termination_b_type %}
+                      {% endif %}
+                      {% if 'termination_b_powerpanel' in form.fields %}
+                          {% render_field form.termination_b_powerpanel %}
+                      {% endif %}
+                      {% if 'termination_b_circuit' in form.fields %}
+                          {% render_field form.termination_b_circuit %}
+                      {% endif %}
+                      <div class="row mb-3">
+                          <label class="col-sm-3 col-form-label text-lg-end">Type</label>
+                          <div class="col">
+                              <input class="form-control" value="{{ termination_b_type|capfirst }}" disabled />
+                          </div>
+                      </div>
+                      {% render_field form.termination_b_id %}
+                  </div>
+              </div>
+          </div>
+      </div>
+      <div class="row my-3 justify-content-center">
         <div class="col col-md-8">
-            {% include 'dcim/inc/cable_form.html' %}
+          <div class="card">
+            <h5 class="card-header">Cable</h5>
+            <div class="card-body">
+              {% include 'dcim/inc/cable_form.html' %}
+            </div>
+          </div>
         </div>
-    </div>
-    <div class="row my-3">
+      </div>
+      <div class="row my-3">
         <div class="col col-md-12 text-center">
-            <a href="{{ return_url }}" class="btn btn-outline-danger">Cancel</a>
-            <button type="submit" name="_update" class="btn btn-primary">Connect</button>
+          <a href="{{ return_url }}" class="btn btn-outline-danger">Cancel</a>
+          <button type="submit" name="_update" class="btn btn-primary">Connect</button>
         </div>
-    </div>
-</form>
-{% endwith %}
+      </div>
+    </form>
+    {% endwith %}
+  </div>
 {% endblock %}

netbox/templates/dcim/cable_edit.html

@@ -1,5 +1,5 @@
 {% extends 'generic/object_edit.html' %}
 
 {% block form %}
-    {% include 'dcim/inc/cable_form.html' %}
+  {% include 'dcim/inc/cable_form.html' %}
 {% endblock %}

netbox/templates/dcim/device_edit.html

@@ -5,14 +5,18 @@
     {% render_errors form %}
     
     <div class="field-group">
-        <h5 class="text-center">Device</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Device</h5>
+        </div>
         {% render_field form.name %}
         {% render_field form.device_role %}
         {% render_field form.tags %}
     </div>
     
     <div class="field-group">
-        <h5 class="text-center">Hardware</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Hardware</h5>
+        </div>
         {% render_field form.manufacturer %}
         {% render_field form.device_type %}
         {% render_field form.serial %}
@@ -20,7 +24,9 @@
     </div>
     
     <div class="field-group">
-        <h5 class="text-center">Location</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Location</h5>
+        </div>
         {% render_field form.region %}
         {% render_field form.site_group %}
         {% render_field form.site %}
@@ -52,7 +58,9 @@
     </div>
     
     <div class="field-group">
-        <h5 class="text-center">Management</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Management</h5>
+        </div>
         {% render_field form.status %}
         {% render_field form.platform %}
         {% if obj.pk %}
@@ -62,20 +70,26 @@
     </div>
     
     <div class="field-group">
-        <h5 class="text-center">Virtualization</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Virtualization</h5>
+        </div>
         {% render_field form.cluster_group %}
         {% render_field form.cluster %}
     </div>
     
     <div class="field-group">
-        <h5 class="text-center">Tenancy</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Tenancy</h5>
+        </div>
         {% render_field form.tenant_group %}
         {% render_field form.tenant %}
     </div>
 
 {% if form.custom_fields %}
     <div class="field-group">
-        <h5 class="text-center">Custom Fields</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Custom Fields</h5>
+        </div>
         {% render_custom_fields form %}
     </div>
 

netbox/templates/dcim/inc/cable_form.html

@@ -1,27 +1,23 @@
 {% load form_helpers %}
-<div class="card">
-    <h5 class="card-header">Cable</h5>
-    <div class="card-body">
-        {% render_field form.status %}
-        {% render_field form.type %}
-        {% render_field form.label %}
-        {% render_field form.color %}
-        <div class="row mb-3">
-            <label class="col-sm-3 col-form-label text-lg-end">{{ form.length.label }}</label>
-            <div class="col-md-5">
-                {{ form.length }}
-            </div>
-            <div class="col-md-4">
-                {{ form.length_unit }}
-            </div>
-            <div class="invalid-feedback"></div>
-        </div>
-        {% render_field form.tags %}
-        {% if form.custom_fields %}
-          <div class="field-group">
-              <h4>Custom Fields</h4>
-              {% render_custom_fields form %}
-          </div>
-        {% endif %}
+
+{% render_field form.status %}
+{% render_field form.type %}
+{% render_field form.label %}
+{% render_field form.color %}
+<div class="row mb-3">
+    <label class="col-sm-3 col-form-label text-lg-end">{{ form.length.label }}</label>
+    <div class="col-md-5">
+        {{ form.length }}
     </div>
+    <div class="col-md-4">
+        {{ form.length_unit }}
+    </div>
+    <div class="invalid-feedback"></div>
 </div>
+{% render_field form.tags %}
+{% if form.custom_fields %}
+  <div class="field-group">
+      <h4>Custom Fields</h4>
+      {% render_custom_fields form %}
+  </div>
+{% endif %}

netbox/templates/dcim/interface_edit.html

@@ -3,30 +3,34 @@
 
 {% block form %}
     <div class="field-group">
-        <h4 class="mb-3">Interface</h4>
-            {% if form.instance.device %}
-                <div class="row mb-3">
-                    <label class="col-sm-3 col-form-label text-lg-end required" for="id_device">Device</label>
-                    <div class="col">
-                        <input class="form-control" value="{{ form.instance.device }}" disabled />
-                    </div>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Interface</h5>
+        </div>
+        {% if form.instance.device %}
+            <div class="row mb-3">
+                <label class="col-sm-3 col-form-label text-lg-end required" for="id_device">Device</label>
+                <div class="col">
+                    <input class="form-control" value="{{ form.instance.device }}" disabled />
                 </div>
-            {% endif %}
+            </div>
+        {% endif %}
         {% render_field form.name %}
         {% render_field form.label %}
         {% render_field form.type %}
-        {% render_field form.enabled %}
         {% render_field form.parent %}
         {% render_field form.lag %}
         {% render_field form.mac_address %}
         {% render_field form.mtu %}
-        {% render_field form.mgmt_only %}
-        {% render_field form.mark_connected %}
         {% render_field form.description %}
         {% render_field form.tags %}
+        {% render_field form.enabled %}
+        {% render_field form.mgmt_only %}
+        {% render_field form.mark_connected %}
     </div>
     <div class="field-group">
-        <h4 class="mb-3">802.1Q Switching</h4>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">802.1Q Switching</h5>
+        </div>
         {% render_field form.mode %}
         {% render_field form.vlan_group %}
         {% render_field form.untagged_vlan %}
@@ -34,7 +38,9 @@
     </div>
     {% if form.custom_fields %}
         <div class="field-group">
-            <h4 class="mb-3">Custom Fields</h4>
+            <div class="row mb-2">
+              <h5 class="offset-sm-3">Custom Fields</h5>
+            </div>
             {% render_custom_fields form %}
         </div>
     {% endif %}

netbox/templates/dcim/rack_edit.html

@@ -3,7 +3,9 @@
 
 {% block form %}
     <div class="field-group">
-        <h5 class="text-center">Rack</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Rack</h5>
+        </div>
         {% render_field form.region %}
         {% render_field form.site_group %}
         {% render_field form.site %}
@@ -14,18 +16,24 @@
         {% render_field form.tags %}
     </div>
     <div class="field-group">
-        <h5 class="text-center">Inventory Control</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Inventory Control</h5>
+        </div>
         {% render_field form.facility_id %}
         {% render_field form.serial %}
         {% render_field form.asset_tag %}
     </div>
     <div class="field-group">
-        <h5 class="text-center">Tenancy</h5>
+        <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">
-        <h5 class="text-center">Dimensions</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Dimensions</h5>
+        </div>
         {% render_field form.type %}
         {% render_field form.width %}
         {% render_field form.u_height %}
@@ -48,7 +56,9 @@
     </div>
     {% if form.custom_fields %}
         <div class="field-group">
-            <h5 class="text-center">Custom Fields</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Custom Fields</h5>
+        </div>
             {% render_custom_fields form %}
         </div>
     {% endif %}

netbox/templates/dcim/virtualchassis_add.html

@@ -2,31 +2,31 @@
 {% load form_helpers %}
 
 {% block form %}
-    <div class="card">
-        <h5 class="card-header">Virtual Chassis</h5>
-        <div class="card-body">
-            {% render_field form.name %}
-            {% render_field form.domain %}
-            {% render_field form.tags %}
-        </div>
+  <div class="field-group">
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Virtual Chassis</h5>
     </div>
-    <div class="card">
-        <h5 class="card-header">Member Devices</h5>
-        <div class="card-body">
-            {% render_field form.region %}
-            {% render_field form.site_group %}
-            {% render_field form.site %}
-            {% render_field form.rack %}
-            {% render_field form.members %}
-            {% render_field form.initial_position %}
-        </div>
+    {% render_field form.name %}
+    {% render_field form.domain %}
+    {% render_field form.tags %}
+  </div>
+  <div class="field-group">
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Member Devices</h5>
     </div>
-    {% if form.custom_fields %}
-        <div class="card">
-            <h5 class="card-header">Custom Fields</h5>
-            <div class="card-body">
-                {% render_custom_fields form %}
-            </div>
-        </div>
-    {% endif %}
+    {% render_field form.region %}
+    {% render_field form.site_group %}
+    {% render_field form.site %}
+    {% render_field form.rack %}
+    {% render_field form.members %}
+    {% render_field form.initial_position %}
+  </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 %}
+    </div>
+  {% endif %}
 {% endblock %}

netbox/templates/dcim/virtualchassis_edit.html

@@ -2,89 +2,89 @@
 {% load helpers %}
 {% load form_helpers %}
 
-{% block title %}{% if vc_form.instance %}Editing Virtual Chassis {{ vc_form.instance }}{% else %}New Virtual Chassis{% endif %}{% endblock %}
+{% block title %}Editing Virtual Chassis {{ vc_form.instance }}{% endblock %}
 
-{% block content %}
-    <form action="" method="post" enctype="multipart/form-data" class="form-object-edit">
+{% block content-wrapper %}
+  <div class="tab-content">
+    <div class="tab-pane show active" id="edit-form" role="tabpanel" aria-labelledby="object-list-tab">
+      <form action="" method="post" enctype="multipart/form-data" class="form-object-edit">
         {% csrf_token %}
         {{ pk_form.pk }}
         {{ formset.management_form }}
-        <div class="card">
-            <h5 class="card-header">Virtual Chassis</h5>
-            <div class="card-body">
-                {% render_field vc_form.name %}
-                {% render_field vc_form.domain %}
-                {% render_field vc_form.master %}
-                {% render_field vc_form.tags %}
-            </div>
+        <div class="field-group">
+          <div class="row mb-2">
+            <h5 class="offset-sm-3">Virtual Chassis</h5>
+          </div>
+          {% render_field vc_form.name %}
+          {% render_field vc_form.domain %}
+          {% render_field vc_form.master %}
+          {% render_field vc_form.tags %}
         </div>
         {% if vc_form.custom_fields %}
-            <div class="card">
-                <h5 class="card-header">Custom Fields</h5>
-                <div class="card-body">
-                    {% render_custom_fields vc_form %}
-                </div>
+          <div class="field-group">
+            <div class="row mb-2">
+              <h5 class="offset-sm-3">Custom Fields</h5>
             </div>
+            {% render_custom_fields vc_form %}
+          </div>
         {% endif %}
-        <div class="card">
-            <h5 class="card-header">Members</h5>
-            <div class="card-body">
-                <table class="table">
-                    <thead>
-                        <tr>
-                            <th>Device</th>
-                            <th>ID</th>
-                            <th>Rack/Unit</th>
-                            <th>Serial</th>
-                            <th>Position</th>
-                            <th>Priority</th>
-                            <th></th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        {% for form in formset %}
-                            {% for field in form.hidden_fields %}
-                                {{ field }}
-                            {% endfor %}
-                            {% with device=form.instance virtual_chassis=vc_form.instance %}
-                                <tr>
-                                    <td>
-                                        <a href="{{ device.get_absolute_url }}">{{ device }}</a>
-                                    </td>
-                                    <td>{{ device.pk }}</td>
-                                    <td>
-                                        {% if device.rack %}
-                                            {{ device.rack }} / {{ device.position }}
-                                        {% else %}
-                                            <span class="text-muted">&mdash;</span>
-                                        {% endif %}
-                                    </td>
-                                    <td>{{ device.serial|placeholder }}</td>
-                                    <td>
-                                        {{ form.vc_position }}
-                                        {% if form.vc_position.errors %}
-                                            <br /><small class="text-danger">{{ form.vc_position.errors.0 }}</small>
-                                        {% endif %}
-                                    </td>
-                                    <td>
-                                        {{ form.vc_priority }}
-                                        {% if form.vc_priority.errors %}
-                                            <br /><small class="text-danger">{{ form.vc_priority.errors.0 }}</small>
-                                        {% endif %}
-                                    </td>
-                                    <td>
-                                        {% if virtual_chassis.pk %}
-                                            <a href="{% url 'dcim:virtualchassis_remove_member' pk=device.pk %}?return_url={% url 'dcim:virtualchassis_edit' pk=virtual_chassis.pk %}" class="btn btn-danger btn-sm{% if virtual_chassis.master == device %} disabled{% endif %}">
-                                                <span class="mdi mdi-trash-can-outline" aria-hidden="true"></span>
-                                            </a>
-                                        {% endif %}
-                                    </td>
-                                </tr>
-                            {% endwith %}
-                        {% endfor %}
-                    </tbody>
-                </table>
-            </div>
+        <div class="field-group mb-5">
+          <h5 class="text-center">Members</h5>
+          <table class="table">
+              <thead>
+                  <tr>
+                      <th>Device</th>
+                      <th>ID</th>
+                      <th>Rack/Unit</th>
+                      <th>Serial</th>
+                      <th>Position</th>
+                      <th>Priority</th>
+                      <th></th>
+                  </tr>
+              </thead>
+              <tbody>
+                  {% for form in formset %}
+                      {% for field in form.hidden_fields %}
+                          {{ field }}
+                      {% endfor %}
+                      {% with device=form.instance virtual_chassis=vc_form.instance %}
+                          <tr>
+                              <td>
+                                  <a href="{{ device.get_absolute_url }}">{{ device }}</a>
+                              </td>
+                              <td>{{ device.pk }}</td>
+                              <td>
+                                  {% if device.rack %}
+                                      {{ device.rack }} / {{ device.position }}
+                                  {% else %}
+                                      <span class="text-muted">&mdash;</span>
+                                  {% endif %}
+                              </td>
+                              <td>{{ device.serial|placeholder }}</td>
+                              <td>
+                                  {{ form.vc_position }}
+                                  {% if form.vc_position.errors %}
+                                      <br /><small class="text-danger">{{ form.vc_position.errors.0 }}</small>
+                                  {% endif %}
+                              </td>
+                              <td>
+                                  {{ form.vc_priority }}
+                                  {% if form.vc_priority.errors %}
+                                      <br /><small class="text-danger">{{ form.vc_priority.errors.0 }}</small>
+                                  {% endif %}
+                              </td>
+                              <td>
+                                  {% if virtual_chassis.pk %}
+                                      <a href="{% url 'dcim:virtualchassis_remove_member' pk=device.pk %}?return_url={% url 'dcim:virtualchassis_edit' pk=virtual_chassis.pk %}" class="btn btn-danger btn-sm{% if virtual_chassis.master == device %} disabled{% endif %}">
+                                          <span class="mdi mdi-trash-can-outline" aria-hidden="true"></span>
+                                      </a>
+                                  {% endif %}
+                              </td>
+                          </tr>
+                      {% endwith %}
+                  {% endfor %}
+              </tbody>
+          </table>
         </div>
         <div class="text-end">
             <a href="{{ return_url }}" class="btn btn-outline-danger">Cancel</a>
@@ -94,5 +94,7 @@
                 <button type="submit" name="_create" class="btn btn-primary">Create</button>
             {% endif %}
         </div>
-    </form>
+      </form>
+    </div>
+  </div>
 {% endblock %}

netbox/templates/generic/object_edit.html

@@ -43,7 +43,9 @@
             {# Render grouped fields according to Form #}
             {% for group, fields in form.Meta.fieldsets %}
               <div class="field-group">
-                <h5 class="text-center">{{ group }}</h5>
+                <div class="row mb-2">
+                  <h5 class="offset-sm-3">{{ group }}</h5>
+                </div>
                 {% for name in fields %}
                     {% render_field form|getfield:name %}
                 {% endfor %}
@@ -52,7 +54,9 @@
 
             {% if form.custom_fields %}
               <div class="field-group">
-                <h5 class="text-center">Custom Fields</h5>
+                <div class="row mb-1">
+                  <h5 class="offset-sm-3">Custom Fields</h5>
+                </div>
                 {% render_custom_fields form %}
               </div>
             {% endif %}
@@ -66,7 +70,6 @@
           {% else %}
             {# Render all fields in a single group #}
             <div class="field-group">
-              <h5 class="text-center">{{ obj_type|capfirst }}</h5>
               {% block form_fields %}{% render_form form %}{% endblock %}
             </div>
           {% endif %}

netbox/templates/ipam/ipaddress_edit.html

@@ -9,67 +9,81 @@
 
 {% block form %}
     <div class="field-group">
-        <h4 class="mb-3">IP Address</h4>
-        {% render_field form.address %}
-        {% render_field form.status %}
-        {% render_field form.role %}
-        {% render_field form.vrf %}
-        {% render_field form.dns_name %}
-        {% render_field form.description %}
-        {% render_field form.tags %}
+      <div class="row mb-2">
+        <h5 class="offset-sm-3">IP Address</h5>
+      </div>
+      {% render_field form.address %}
+      {% render_field form.status %}
+      {% render_field form.role %}
+      {% render_field form.vrf %}
+      {% render_field form.dns_name %}
+      {% render_field form.description %}
+      {% render_field form.tags %}
     </div>
     <div class="field-group">
-        <h4 class="mb-3">Tenancy</h4>
-        {% render_field form.tenant_group %}
-        {% render_field form.tenant %}
+      <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">
-        <h4 class="mb-3">Interface Assignment</h4>
-        {% with vm_tab_active=form.initial.vminterface %}
-            <ul class="nav nav-tabs" role="tablist">
-                <li role="presentation" class="nav-item">
-                    <button
-                        role="tab"
-                        type="button"
-                        id="device_tab"
-                        data-bs-toggle="tab"
-                        aria-controls="device"
-                        data-bs-target="#device"
-                        class="nav-link {% if not vm_tab_active %}active{% endif %}"
-                    >
-                        Device
-                    </button>
-                </li>
-                <li role="presentation" class="nav-item">
-                    <button
-                        role="tab"
-                        type="button"
-                        id="vm_tab"
-                        data-bs-toggle="tab"
-                        aria-controls="vm"
-                        data-bs-target="#vm"
-                        class="nav-link {% if vm_tab_active %}active{% endif %}"
-                    >
-                        Virtual Machine
-                    </button>
-                </li>
+      <div class="row mb-2">
+        <h5 class="offset-sm-3">Interface Assignment</h5>
+      </div>
+      {% with vm_tab_active=form.initial.vminterface %}
+        <div class="row mb-2">
+          <div class="offset-sm-3">
+            <ul class="nav nav-pills" role="tablist">
+              <li role="presentation" class="nav-item">
+                  <button
+                      role="tab"
+                      type="button"
+                      id="device_tab"
+                      data-bs-toggle="tab"
+                      aria-controls="device"
+                      data-bs-target="#device"
+                      class="nav-link {% if not vm_tab_active %}active{% endif %}"
+                  >
+                      Device
+                  </button>
+              </li>
+              <li role="presentation" class="nav-item">
+                  <button
+                      role="tab"
+                      type="button"
+                      id="vm_tab"
+                      data-bs-toggle="tab"
+                      aria-controls="vm"
+                      data-bs-target="#vm"
+                      class="nav-link {% if vm_tab_active %}active{% endif %}"
+                  >
+                      Virtual Machine
+                  </button>
+              </li>
             </ul>
-            <div class="tab-content">
-                <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 %}
-                </div>
-                <div class="tab-pane {% if vm_tab_active %}active{% endif %}" id="vm" role="tabpanel" aria-labeled-by="vm_tab">
-                    {% render_field form.virtual_machine %}
-                    {% render_field form.vminterface %}
-                </div>
-            </div>
-        {% endwith %}
-        {% render_field form.primary_for_parent %}
+          </div>
+        </div>
+        <div class="tab-content p-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 %}
+          </div>
+          <div class="tab-pane {% if vm_tab_active %}active{% endif %}" id="vm" role="tabpanel" aria-labeled-by="vm_tab">
+            {% render_field form.virtual_machine %}
+            {% render_field form.vminterface %}
+          </div>
+          {% render_field form.primary_for_parent %}
+        </div>
+      {% endwith %}
     </div>
     <div class="field-group">
-        <h4 class="mb-3">NAT IP (Inside)</h4>
-        <ul class="nav nav-tabs" role="tablist">
+      <div class="row mb-2">
+        <h5 class="offset-sm-3">NAT IP (Inside)</h5>
+      </div>
+      <div class="row mb-2">
+        <div class="offset-sm-3">
+          <ul class="nav nav-pills" role="tablist">
             <li class="nav-item" role="presentation">
                 <button
                     role="tab"
@@ -109,29 +123,33 @@
                     By IP
                 </button>
             </li>
-        </ul>
-        <div class="tab-content">
-            <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 %}
-                {% render_field form.nat_site %}
-                {% render_field form.nat_rack %}
-                {% render_field form.nat_device %}
-            </div>
-            <div class="tab-pane" id="by_vm" aria-labelledby="vm_tab" role="tabpanel">
-                {% render_field form.nat_cluster %}
-                {% render_field form.nat_virtual_machine %}
-            </div>
-            <div class="tab-pane" id="by_vrf" aria-labelledby="vrf_tab" role="tabpanel">
-                {% render_field form.nat_vrf %}
-            </div>
-            {% render_field form.nat_inside %}
+          </ul>
         </div>
+      </div>
+      <div class="tab-content p-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 %}
+              {% render_field form.nat_site %}
+              {% render_field form.nat_rack %}
+              {% render_field form.nat_device %}
+          </div>
+          <div class="tab-pane" id="by_vm" aria-labelledby="vm_tab" role="tabpanel">
+              {% render_field form.nat_cluster %}
+              {% render_field form.nat_virtual_machine %}
+          </div>
+          <div class="tab-pane" id="by_vrf" aria-labelledby="vrf_tab" role="tabpanel">
+              {% render_field form.nat_vrf %}
+          </div>
+          {% render_field form.nat_inside %}
+      </div>
     </div>
     {% if form.custom_fields %}
-        <div class="field-group">
-            <h4 class="mb-3">Custom Fields</h4>
-            {% render_custom_fields form %}
+      <div class="field-group">
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Custom Fields</h5>
         </div>
+        {% render_custom_fields form %}
+      </div>
     {% endif %}
 {% endblock %}

netbox/templates/ipam/service_edit.html

@@ -2,50 +2,49 @@
 {% load form_helpers %}
 
 {% block form %}
-    <div class="field-group">
-        <h5 class="text-center">Service</h5>
-        {% if obj.device %}
-            <div class="row mb-3">
-                <label class="col-sm-3 col-form-label text-lg-end">Device</label>
-                <div class="col">
-                    <input class="form-control" value="{{ obj.device }}" disabled />
-                </div>
-            </div>
-        {% else %}
-            <div class="row mb-3">
-                <label class="col-sm-3 col-form-label text-lg-end">Virtual Machine</label>
-                <div class="col">
-                    <input class="form-control" value="{{ obj.virtual_machine }}" disabled />
-                </div>
-            </div>
-        {% endif %}
-        {% render_field form.name %}
-        <div class="row">
-            <label class="col-sm-3 col-form-label text-lg-end">Port(s)</label>
-            <div class="col-2">
-                {{ form.protocol }}
-            </div>
-            <div class="col-7">
-                {{ form.ports }}
+  <div class="field-group">
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Service</h5>
+    </div>
+    {% if obj.device %}
+        <div class="row mb-3">
+            <label class="col-sm-3 col-form-label text-lg-end">Device</label>
+            <div class="col">
+                <input class="form-control" value="{{ obj.device }}" disabled />
             </div>
         </div>
+    {% else %}
         <div class="row mb-3">
-            <div class="col-3"></div>
-            <div class="col-9">
-                <span class="form-text">{{ form.ports.help_text }}</span>
+            <label class="col-sm-3 col-form-label text-lg-end">Virtual Machine</label>
+            <div class="col">
+                <input class="form-control" value="{{ obj.virtual_machine }}" disabled />
             </div>
         </div>
-        
-        {% render_field form.ipaddresses %}
-        {% render_field form.description %}
-        {% render_field form.tags %}
+    {% endif %}
+    {% render_field form.name %}
+    <div class="row">
+        <label class="col-sm-3 col-form-label text-lg-end">Port(s)</label>
+        <div class="col-2">
+            {{ form.protocol }}
+        </div>
+        <div class="col-7">
+            {{ form.ports }}
+        </div>
     </div>
-    {% if form.custom_fields %}
-        <div class="card">
-            <h5 class="card-header">Custom Fields</h5>
-            <div class="card-body">
-                {% render_custom_fields form %}
-            </div>
+    <div class="row mb-3">
+        <div class="col-3"></div>
+        <div class="col-9">
+            <span class="form-text">{{ form.ports.help_text }}</span>
         </div>
-    {% endif %}
+    </div>
+    {% render_field form.ipaddresses %}
+    {% render_field form.description %}
+    {% render_field form.tags %}
+  </div>
+  {% if form.custom_fields %}
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Custom Fields</h5>
+    </div>
+    {% render_custom_fields form %}
+  {% endif %}
 {% endblock %}

netbox/templates/ipam/vlan_edit.html

@@ -4,48 +4,60 @@
 {% load helpers %}
 
 {% block form %}
-    <div class="field-group mb-3">
-        <h5 class="text-center">VLAN</h5>
-        {% render_field form.vid %}
-        {% render_field form.name %}
-        {% render_field form.status %}
-        {% render_field form.role %}
-        {% render_field form.description %}
-        {% render_field form.tags %}
+  <div class="field-group mb-3">
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">VLAN</h5>
     </div>
-    <div class="field-group mb-3">
-        <h5 class="text-center">Tenancy</h5>
-        {% render_field form.tenant_group %}
-        {% render_field form.tenant %}
+    {% render_field form.vid %}
+    {% render_field form.name %}
+    {% render_field form.status %}
+    {% render_field form.role %}
+    {% render_field form.description %}
+    {% render_field form.tags %}
+  </div>
+  <div class="field-group mb-3">
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Tenancy</h5>
     </div>
-    <div class="field-group mb-3">
-        <h5 class="text-center">Assignment</h5>
-        {% with site_tab_active=form.initial.site %}
-            <ul class="nav nav-tabs" role="tablist">
-                <li class="nav-item" role="presentation">
-                    <a class="nav-link{% if not site_tab_active %} active{% endif %}" href="#group" role="tab" data-bs-toggle="tab">VLAN Group</a>
-                </li>
-                <li class="nav-item" role="presentation">
-                    <a class="nav-link{% if site_tab_active %} active{% endif %}" href="#site" role="tab" data-bs-toggle="tab">Site</a>
-                </li>
-            </ul>
-            <div class="tab-content">
-                <div class="tab-pane{% if not site_tab_active %} active{% endif %}" id="group">
-                    {% render_field form.scope_type %}
-                    {% render_field form.group %}
-                </div>
-                <div class="tab-pane{% if site_tab_active %} active{% endif %}" id="site">
-                    {% render_field form.region %}
-                    {% render_field form.sitegroup %}
-                    {% render_field form.site %}
-                </div>
-            </div>
-        {% endwith %}
+    {% render_field form.tenant_group %}
+    {% render_field form.tenant %}
+  </div>
+  <div class="field-group mb-3">
+    <div class="row mb-2">
+      <h5 class="offset-sm-3">Assignment</h5>
     </div>
-    {% if form.custom_fields %}
-        <div class="field-group">
-            <h5 class="text-center">Custom Fields</h5>
-            {% render_custom_fields form %}
+    {% with site_tab_active=form.initial.site %}
+      <div class="row mb-2">
+        <div class="offset-sm-3">
+          <ul class="nav nav-pills" role="tablist">
+            <li class="nav-item" role="presentation">
+              <a class="nav-link{% if not site_tab_active %} active{% endif %}" href="#group" role="tab" data-bs-toggle="tab">VLAN Group</a>
+            </li>
+            <li class="nav-item" role="presentation">
+              <a class="nav-link{% if site_tab_active %} active{% endif %}" href="#site" role="tab" data-bs-toggle="tab">Site</a>
+            </li>
+          </ul>
         </div>
-    {% endif %}
+      </div>
+      <div class="tab-content p-0">
+        <div class="tab-pane{% if not site_tab_active %} active{% endif %}" id="group">
+          {% render_field form.scope_type %}
+          {% render_field form.group %}
+        </div>
+        <div class="tab-pane{% if site_tab_active %} active{% endif %}" id="site">
+          {% render_field form.region %}
+          {% render_field form.sitegroup %}
+          {% render_field form.site %}
+        </div>
+      </div>
+    {% endwith %}
+  </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 %}
+    </div>
+  {% endif %}
 {% endblock %}

netbox/templates/ipam/vlangroup_edit.html

@@ -1,30 +0,0 @@
-{% extends 'generic/object_edit.html' %}
-{% load form_helpers %}
-{% load helpers %}
-
-{% block form %}
-    <div class="field-group">
-        <h5 class="text-center">VLAN Group</h5>
-        {% render_field form.name %}
-        {% render_field form.slug %}
-        {% render_field form.description %}
-    </div>
-    <div class="field-group">
-        <h5 class="text-center">Scope</h5>
-        {% render_field form.scope_type %}
-        {% render_field form.region %}
-        {% render_field form.sitegroup %}
-        {% render_field form.site %}
-        {% render_field form.location %}
-        {% render_field form.rack %}
-        {% render_field form.clustergroup %}
-        {% render_field form.cluster %}
-    </div>
-    {% if form.custom_fields %}
-        <div class="field-group">
-            <h5 class="text-center">Custom Fields</h5>
-            {% render_custom_fields form %}
-        </div>
-    {% endif %}
-{% endblock %}
-

netbox/templates/virtualization/vminterface_edit.html

@@ -3,34 +3,39 @@
 
 {% block form %}
     <div class="field-group">
-        <h5 class="text-center">Interface</h5>
-        {% if form.instance.virtual_machine %}
-            <div class="row mb-3">
-                <label class="col-sm-3 col-form-label text-lg-end required" for="id_device">Virtual Machine</label>
-                <div class="col">
-                    <input class="form-control" value="{{ form.instance.virtual_machine }}" disabled />
-                </div>
-            </div>
-        {% endif %}
-        {% render_field form.name %}
-        {% render_field form.enabled %}
-        {% render_field form.parent %}
-        {% render_field form.mac_address %}
-        {% render_field form.mtu %}
-        {% render_field form.description %}
-        {% render_field form.tags %}
-        
+      <div class="row mb-2">
+        <h5 class="offset-sm-3">Interface</h5>
+      </div>
+      {% if form.instance.virtual_machine %}
+          <div class="row mb-3">
+              <label class="col-sm-3 col-form-label text-lg-end required" for="id_device">Virtual Machine</label>
+              <div class="col">
+                  <input class="form-control" value="{{ form.instance.virtual_machine }}" disabled />
+              </div>
+          </div>
+      {% endif %}
+      {% render_field form.name %}
+      {% render_field form.enabled %}
+      {% render_field form.parent %}
+      {% render_field form.mac_address %}
+      {% render_field form.mtu %}
+      {% render_field form.description %}
+      {% render_field form.tags %}
     </div>
     <div class="field-group">
-        <h5 class="text-center">802.1Q Switching</h5>
-        {% render_field form.mode %}
-        {% render_field form.vlan_group %}
-        {% render_field form.untagged_vlan %}
-        {% render_field form.tagged_vlans %}
+      <div class="row mb-2">
+        <h5 class="offset-sm-3">802.1Q Switching</h5>
+      </div>
+      {% render_field form.mode %}
+      {% render_field form.vlan_group %}
+      {% render_field form.untagged_vlan %}
+      {% render_field form.tagged_vlans %}
     </div>
     {% if form.custom_fields %}
       <div class="field-group">
-        <h5 class="text-center">Custom Fields</h5>
+        <div class="row mb-2">
+          <h5 class="offset-sm-3">Custom Fields</h5>
+        </div>
         {% render_custom_fields form %}
       </div>
     {% endif %}