mirror of
https://github.com/netbox-community/netbox.git
synced 2025-07-21 19:47:20 -06:00
update templates to bootstrap 5 classes
This commit is contained in:
checktheroads
parent
362392d1de
commit
991f71bf28
@ -313,3 +313,18 @@ div.field-group:not(:first-of-type) {
|
||||
margin-bottom: $spacer;
|
||||
}
|
||||
}
|
||||
|
||||
label.required {
|
||||
font-weight: $font-weight-bold;
|
||||
&::after {
|
||||
font-family: bootstrap-icons;
|
||||
content: '\f151';
|
||||
font-weight: normal;
|
||||
font-size: 8px;
|
||||
font-style: normal;
|
||||
margin: 0 0 0 2px;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
@ -17,8 +17,7 @@
|
||||
/>
|
||||
</head>
|
||||
<body>
|
||||
{% comment %} {% include './layout.html' %} {% endcomment %} {% comment %}
|
||||
{% endcomment %} {% block layout %}{% endblock %}
|
||||
{% block layout %}{% endblock %}
|
||||
<script
|
||||
src="{% static 'netbox.js' %}"
|
||||
onerror="window.location='{% url 'media_failure' %}?filename=netbox.js'"
|
||||
|
||||
@ -319,6 +319,11 @@
|
||||
<div class="card-body">
|
||||
{% if related_devices %}
|
||||
<table class="table table-hover">
|
||||
<tr>
|
||||
<th>Device</th>
|
||||
<th>Rack</th>
|
||||
<th>Type</th>
|
||||
</tr>
|
||||
{% for rd in related_devices %}
|
||||
<tr>
|
||||
<td>
|
||||
@ -326,7 +331,7 @@
|
||||
</td>
|
||||
<td>
|
||||
{% if rd.rack %}
|
||||
<a href="{% url 'dcim:rack' pk=rd.rack.pk %}">Rack {{ rd.rack }}</a>
|
||||
<a href="{% url 'dcim:rack' pk=rd.rack.pk %}">{{ rd.rack }}</a>
|
||||
{% else %}
|
||||
<span class="text-muted">—</span>
|
||||
{% endif %}
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
{% load form_helpers %}
|
||||
|
||||
{% block form %}
|
||||
{% render_errors form %}
|
||||
|
||||
<div class="field-group">
|
||||
<h4 >Device</h4>
|
||||
{% render_field form.name %}
|
||||
|
||||
@ -1,42 +1,39 @@
|
||||
{% load form_helpers %}
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading"><strong>Cable</strong></div>
|
||||
<div class="panel-body">
|
||||
{% render_field form.status %}
|
||||
{% render_field form.type %}
|
||||
{% render_field form.label %}
|
||||
{% render_field form.color %}
|
||||
<div class="form-group">
|
||||
<label class="col-md-3 control-label" for="id_length">{{ form.length.label }}</label>
|
||||
<div class="col-md-5">
|
||||
{{ form.length }}
|
||||
{% if form.length.errors %}
|
||||
<ul>
|
||||
{% for error in form.length.errors %}
|
||||
<li class="text-danger">{{ error }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
{{ form.length_unit }}
|
||||
{% if form.length_unit.errors %}
|
||||
<ul>
|
||||
{% for error in form.length_unit.errors %}
|
||||
<li class="text-danger">{{ error }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="field-group">
|
||||
<h4>Cable</h4>
|
||||
{% render_field form.status %}
|
||||
{% render_field form.type %}
|
||||
{% render_field form.label %}
|
||||
{% render_field form.color %}
|
||||
<div class="field-group">
|
||||
<label class="col-md-3 control-label" for="id_length">{{ form.length.label }}</label>
|
||||
<div class="col-md-5">
|
||||
{{ form.length }}
|
||||
{% if form.length.errors %}
|
||||
<ul>
|
||||
{% for error in form.length.errors %}
|
||||
<li class="text-danger">{{ error }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
{{ form.length_unit }}
|
||||
{% if form.length_unit.errors %}
|
||||
<ul>
|
||||
{% for error in form.length_unit.errors %}
|
||||
<li class="text-danger">{{ error }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% render_field form.tags %}
|
||||
</div>
|
||||
{% render_field form.tags %}
|
||||
|
||||
</div>
|
||||
{% if form.custom_fields %}
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading"><strong>Custom Fields</strong></div>
|
||||
<div class="panel-body">
|
||||
{% render_custom_fields form %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="field-group">
|
||||
<h4>Custom Fields</h4>
|
||||
{% render_custom_fields form %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
@ -3,191 +3,195 @@
|
||||
{% load static %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
<li><a href="{% url 'extras:configcontext_list' %}">Config Contexts</a></li>
|
||||
<li>{{ object }}</li>
|
||||
<li class="breadcrumb-item"><a href="{% url 'extras:configcontext_list' %}">Config Contexts</a></li>
|
||||
<li class="breadcrumb-item">{{ object }}</li>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="row">
|
||||
<div class="col-md-5">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<strong>Config Context</strong>
|
||||
<div class="card">
|
||||
<h5 class="card-header">
|
||||
Config Context
|
||||
</h5>
|
||||
<div class="card-body">
|
||||
<table class="table table-hover attr-table">
|
||||
<tr>
|
||||
<th scope="row">Name</th>
|
||||
<td>
|
||||
{{ object.name }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Weight</th>
|
||||
<td>
|
||||
{{ object.weight }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Description</th>
|
||||
<td>{{ object.description|placeholder }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Active</th>
|
||||
<td>
|
||||
{% if object.is_active %}
|
||||
<span class="text-success">
|
||||
<i class="mdi mdi-check-bold"></i>
|
||||
</span>
|
||||
{% else %}
|
||||
<span class="text-danger">
|
||||
<i class="mdi mdi-close"></i>
|
||||
</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<table class="table table-hover panel-body attr-table">
|
||||
<tr>
|
||||
<td>Name</td>
|
||||
<td>
|
||||
{{ object.name }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Weight</td>
|
||||
<td>
|
||||
{{ object.weight }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Description</td>
|
||||
<td>{{ object.description|placeholder }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Active</td>
|
||||
<td>
|
||||
{% if object.is_active %}
|
||||
<span class="text-success">
|
||||
<i class="mdi mdi-check-bold"></i>
|
||||
</span>
|
||||
{% else %}
|
||||
<span class="text-danger">
|
||||
<i class="mdi mdi-close"></i>
|
||||
</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<strong>Assignment</strong>
|
||||
<div class="card">
|
||||
<h5 class="card-header">
|
||||
Assignment
|
||||
</h5>
|
||||
<div class="card-body">
|
||||
<table class="table table-hover attr-table">
|
||||
<tr>
|
||||
<th scope="row">Regions</th>
|
||||
<td>
|
||||
{% if object.regions.all %}
|
||||
<ul>
|
||||
{% for region in object.regions.all %}
|
||||
<li><a href="{{ region.get_absolute_url }}">{{ region }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Sites</th>
|
||||
<td>
|
||||
{% if object.sites.all %}
|
||||
<ul>
|
||||
{% for site in object.sites.all %}
|
||||
<li><a href="{{ site.get_absolute_url }}">{{ site }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Roles</th>
|
||||
<td>
|
||||
{% if object.roles.all %}
|
||||
<ul>
|
||||
{% for role in object.roles.all %}
|
||||
<li><a href="{% url 'dcim:device_list' %}?role={{ role.slug }}">{{ role }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Platforms</th>
|
||||
<td>
|
||||
{% if object.platforms.all %}
|
||||
<ul>
|
||||
{% for platform in object.platforms.all %}
|
||||
<li><a href="{{ platform.get_absolute_url }}">{{ platform }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Cluster Groups</th>
|
||||
<td>
|
||||
{% if object.cluster_groups.all %}
|
||||
<ul>
|
||||
{% for cluster_group in object.cluster_groups.all %}
|
||||
<li><a href="{{ cluster_group.get_absolute_url }}">{{ cluster_group }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Clusters</th>
|
||||
<td>
|
||||
{% if object.clusters.all %}
|
||||
<ul>
|
||||
{% for cluster in object.clusters.all %}
|
||||
<li><a href="{{ cluster.get_absolute_url }}">{{ cluster }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Tenant Groups</th>
|
||||
<td>
|
||||
{% if object.tenant_groups.all %}
|
||||
<ul>
|
||||
{% for tenant_group in object.tenant_groups.all %}
|
||||
<li><a href="{{ tenant_group.get_absolute_url }}">{{ tenant_group }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Tenants</th>
|
||||
<td>
|
||||
{% if object.tenants.all %}
|
||||
<ul>
|
||||
{% for tenant in object.tenants.all %}
|
||||
<li><a href="{{ tenant.get_absolute_url }}">{{ tenant }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Tags</th>
|
||||
<td>
|
||||
{% if object.tags.all %}
|
||||
<ul>
|
||||
{% for tag in object.tags.all %}
|
||||
<li><a href="{{ tag.get_absolute_url }}">{{ tag }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<table class="table table-hover panel-body attr-table">
|
||||
<tr>
|
||||
<td>Regions</td>
|
||||
<td>
|
||||
{% if object.regions.all %}
|
||||
<ul>
|
||||
{% for region in object.regions.all %}
|
||||
<li><a href="{{ region.get_absolute_url }}">{{ region }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sites</td>
|
||||
<td>
|
||||
{% if object.sites.all %}
|
||||
<ul>
|
||||
{% for site in object.sites.all %}
|
||||
<li><a href="{{ site.get_absolute_url }}">{{ site }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Roles</td>
|
||||
<td>
|
||||
{% if object.roles.all %}
|
||||
<ul>
|
||||
{% for role in object.roles.all %}
|
||||
<li><a href="{% url 'dcim:device_list' %}?role={{ role.slug }}">{{ role }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Platforms</td>
|
||||
<td>
|
||||
{% if object.platforms.all %}
|
||||
<ul>
|
||||
{% for platform in object.platforms.all %}
|
||||
<li><a href="{{ platform.get_absolute_url }}">{{ platform }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Cluster Groups</td>
|
||||
<td>
|
||||
{% if object.cluster_groups.all %}
|
||||
<ul>
|
||||
{% for cluster_group in object.cluster_groups.all %}
|
||||
<li><a href="{{ cluster_group.get_absolute_url }}">{{ cluster_group }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Clusters</td>
|
||||
<td>
|
||||
{% if object.clusters.all %}
|
||||
<ul>
|
||||
{% for cluster in object.clusters.all %}
|
||||
<li><a href="{{ cluster.get_absolute_url }}">{{ cluster }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Tenant Groups</td>
|
||||
<td>
|
||||
{% if object.tenant_groups.all %}
|
||||
<ul>
|
||||
{% for tenant_group in object.tenant_groups.all %}
|
||||
<li><a href="{{ tenant_group.get_absolute_url }}">{{ tenant_group }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Tenants</td>
|
||||
<td>
|
||||
{% if object.tenants.all %}
|
||||
<ul>
|
||||
{% for tenant in object.tenants.all %}
|
||||
<li><a href="{{ tenant.get_absolute_url }}">{{ tenant }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Tags</td>
|
||||
<td>
|
||||
{% if object.tags.all %}
|
||||
<ul>
|
||||
{% for tag in object.tags.all %}
|
||||
<li><a href="{{ tag.get_absolute_url }}">{{ tag }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<span class="text-muted">None</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-7">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<strong>Data</strong>
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5>Data</h5>
|
||||
{% include 'extras/inc/configcontext_format.html' %}
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="card-body">
|
||||
{% include 'extras/inc/configcontext_data.html' with data=object.data format=format %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<div class="pull-right">
|
||||
<div class="btn-group btn-group-xs" role="group">
|
||||
<a href="?format=json" class="btn btn-default{% if format == 'json' %} active{% endif %}">JSON</a>
|
||||
<a href="?format=yaml" class="btn btn-default{% if format == 'yaml' %} active{% endif %}">YAML</a>
|
||||
<div class="float-end">
|
||||
<div class="btn-group btn-group-sm" role="group">
|
||||
<a href="?format=json" type="button" class="btn btn-outline-dark{% if format == 'json' %} active{% endif %}">JSON</a>
|
||||
<a href="?format=yaml" type="button" class="btn btn-outline-dark{% if format == 'yaml' %} active{% endif %}">YAML</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
{% block breadcrumb_main %}
|
||||
<nav class="breadcrumb-container" aria-label="breadcrumb">
|
||||
<ol class="breadcrumb">
|
||||
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
||||
<li class="breadcrumb-item"><a href="/">Home</a></li>
|
||||
{% block breadcrumbs %}{%endblock%}
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
@ -5,33 +5,36 @@
|
||||
|
||||
{% block content %}
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="card bg-danger">
|
||||
<h5 class="card-header">Confirm Bulk Deletion</h5>
|
||||
<div class="col-md-8">
|
||||
<div class="alert alert-danger mb-3" role="alert">
|
||||
<h4 class="alert-heading">Confirm Bulk Deletion</h4>
|
||||
<hr />
|
||||
<div>
|
||||
<strong>Warning:</strong> The following operation will delete <strong>{{ table.rows|length }}</strong> {{ obj_type_plural }}. Please carefully review the {{ obj_type_plural }} to be deleted and confirm below.
|
||||
</div>
|
||||
{% block message_extra %}{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<p><strong>Warning:</strong> The following operation will delete {{ table.rows|length }} {{ obj_type_plural }}. Please carefully review the {{ obj_type_plural }} to be deleted and confirm below.</p>
|
||||
{% block message_extra %}{% endblock %}
|
||||
{% include 'inc/table.html' %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="card">
|
||||
{% include 'inc/table.html' %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6 col-md-offset-3">
|
||||
<form action="" method="post" class="form">
|
||||
<div class="row mt-3">
|
||||
<div class="col-md-8">
|
||||
<form action="" method="post">
|
||||
{% csrf_token %}
|
||||
{% for field in form.hidden_fields %}
|
||||
{{ field }}
|
||||
{% endfor %}
|
||||
<div class="text-center">
|
||||
<button type="submit" name="_confirm" class="btn btn-danger">Delete these {{ table.rows|length }} {{ obj_type_plural }}</button>
|
||||
<a href="{{ return_url }}" class="btn btn-default">Cancel</a>
|
||||
<div class="text-end">
|
||||
<a href="{{ return_url }}" class="btn btn-outline-dark">Cancel</a>
|
||||
<button type="submit" name="_confirm" class="btn btn-danger">Delete {{ table.rows|length }} {{ obj_type_plural }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user