1
0
mirror of https://github.com/netbox-community/netbox.git synced 2024-05-10 07:54:54 +00:00

#6372: Form should be centered on page

This commit is contained in:
checktheroads
2021-05-23 13:21:52 -07:00
parent 1811118f28
commit c4bd47eb84
6 changed files with 82 additions and 89 deletions

View File

@ -94,11 +94,12 @@
{# Title #}
<div id="content-title">
<h1 class="h2 w-100">{% block title %}{% endblock %}</h1>
{# Center-align title in object-edit views #}
<h1 class="h2 w-100{% if form or vc_form %} text-center{% endif %}">{% block title %}{% endblock title %}</h1>
</div>
{# Controls #}
{% block controls %}{% endblock %}
{% block controls %}{% endblock controls %}
</div>
{% endblock header %}

View File

@ -5,52 +5,48 @@
{% block title %}{{ obj.circuit.provider }} {{ obj.circuit }} - Side {{ form.term_side.value }}{% endblock %}
{% block form %}
<div class="card">
<h5 class="card-header">Termination</h5>
<div class="card-body">
<div class="form-floating mb-3">
<input class="form-control" value="{{ obj.circuit.provider }}" disabled />
<label>Provider</label>
</div>
<div class="form-floating mb-3">
<input class="form-control" value="{{ obj.circuit.cid }}" disabled />
<label>Circuit</label>
</div>
<div class="form-floating mb-3">
<input class="form-control" value="{{ form.term_side.value }}" disabled />
<label>Termination</label>
</div>
{% render_field form.mark_connected %}
{% with providernetwork_tab_active=form.initial.provider_network %}
<ul class="nav nav-tabs mb-3" 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>
</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>
</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 %}
</div>
<div class="field-group">
<h4 class="mb-3">Termination</h4>
<div class="form-floating mb-3">
<input class="form-control" value="{{ obj.circuit.provider }}" disabled />
<label>Provider</label>
</div>
<div class="form-floating mb-3">
<input class="form-control" value="{{ obj.circuit.cid }}" disabled />
<label>Circuit</label>
</div>
<div class="form-floating mb-3">
<input class="form-control" value="{{ form.term_side.value }}" disabled />
<label>Termination</label>
</div>
{% render_field form.mark_connected %}
{% with providernetwork_tab_active=form.initial.provider_network %}
<ul class="nav nav-tabs mb-3" 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>
</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>
</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 %}
</div>
<div class="card">
<h5 class="card-header">Termination Details</h5>
<div class="card-body">
{% 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>
<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>
{% endblock %}

View File

@ -2,44 +2,38 @@
{% load form_helpers %}
{% block form %}
<div class="card">
<div class="card-header">Interface</div>
<div class="card-body">
<div class="field-group">
<h4 class="mb-3">Interface</h4>
{% if form.instance.device %}
<div class="form-floating mb-3">
<input class="form-control" value="{{ form.instance.device }}" disabled />
<label class="form-label required" for="id_device">Device</label>
</div>
<div class="form-floating mb-3">
<input class="form-control" value="{{ form.instance.device }}" disabled />
<label class="form-label required" for="id_device">Device</label>
</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 %}
</div>
{% 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 %}
</div>
<div class="card">
<div class="card-header">802.1Q Switching</div>
<div class="card-body">
{% render_field form.mode %}
{% render_field form.untagged_vlan %}
{% render_field form.tagged_vlans %}
</div>
<div class="field-group">
<h4 class="mb-3">802.1Q Switching</h4>
{% render_field form.mode %}
{% render_field form.untagged_vlan %}
{% render_field form.tagged_vlans %}
</div>
{% if form.custom_fields %}
<div class="card">
<div class="card-header">Custom Fields</div>
<div class="card-body">
{% render_custom_fields form %}
<div class="field-group">
<h4 class="mb-3">Custom Fields</h4>
{% render_custom_fields form %}
</div>
</div>
{% endif %}
{% endblock %}

View File

@ -2,7 +2,7 @@
{% load helpers %}
{% load form_helpers %}
{% block title %}{% if vc_form.instance %}Editing {{ vc_form.instance }}{% else %}New Virtual Chassis{% endif %}{% endblock %}
{% block title %}{% if vc_form.instance %}Editing Virtual Chassis {{ vc_form.instance }}{% else %}New Virtual Chassis{% endif %}{% endblock %}
{% block content %}
<form action="" method="post" enctype="multipart/form-data" class="form form-horizontal">
@ -10,7 +10,7 @@
{{ pk_form.pk }}
{{ formset.management_form }}
<div class="row">
<div class="col col-md-8">
<div class="col col-md-8 offset-md-2">
<div class="card">
<h5 class="card-header">Virtual Chassis</h5>
<div class="card-body">
@ -91,7 +91,7 @@
</div>
</div>
<div class="row my-3">
<div class="col col-md-8 col col-md-offset-2 text-end">
<div class="col col-md-8 offset-md-2 text-end">
<a href="{{ return_url }}" class="btn btn-outline-danger">Cancel</a>
{% if vc_form.instance.pk %}
<button type="submit" name="_update" class="btn btn-primary">Save</button>

View File

@ -1,6 +1,8 @@
{% extends 'base/layout.html' %} {% load form_helpers %} {% load helpers %}
{% block title %}{% if obj.pk %}Editing {{ obj_type }} {{ obj }}{% else %}Add a new {{ obj_type }}{% endif %}{% endblock %}
{% block title %}
{% if obj.pk %}Editing {{ obj_type }} {{ obj }}{% else %}Add a new {{ obj_type }}{% endif %}
{% endblock title %}
{% block controls %}
{% if settings.DOCS_ROOT %}
@ -15,7 +17,7 @@
{% csrf_token %}
{% for field in form.hidden_fields %}{{ field }}{% endfor %}
<div class="row">
<div class="col col-md-8">
<div class="col col-md-8 offset-md-2">
{% block tabs %}{% endblock %}
{% block form %}
{% if form.Meta.fieldsets %}
@ -51,7 +53,7 @@
</div>
</div>
<div class="row my-3">
<div class="col col-md-8 text-end">
<div class="col col-md-8 offset-md-2 text-end">
{% block buttons %}
<a class="btn btn-outline-danger" href="{{ return_url }}">Cancel</a>
{% if obj.pk %}

View File

@ -3,7 +3,7 @@
{% load form_helpers %}
{% load helpers %}
{% block title %}Assign an IP Address{% endblock %}
{% block title %}Assign an IP Address{% endblock title %}
{% block content %}
<form action="{% querystring request %}" method="post" class="form form-horizontal">
@ -12,7 +12,7 @@
{{ field }}
{% endfor %}
<div class="row mb-3">
<div class="col col-md-6">
<div class="col col-md-8 offset-md-2">
{% include 'ipam/inc/ipadress_edit_header.html' with active_tab='assign' %}
<div class="card">
<h5 class="card-header">Select IP Address</h5>
@ -24,7 +24,7 @@
</div>
</div>
<div class="row mb-3">
<div class="col col-md-6 text-end">
<div class="col col-md-8 offset-md-2 text-end">
<a href="{{ return_url }}" class="btn btn-outline-danger">Cancel</a>
<button type="submit" class="btn btn-primary">Search</button>
</div>