NeoAnd/netbox
1
0
Fork 0
mirror of https://github.com/netbox-community/netbox.git synced 2025-07-21 19:47:20 -06:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

update templates to bootstrap 5 classes

Browse Source
This commit is contained in:
checktheroads 2021-03-14 01:06:18 -07:00
parent 362392d1de
commit 991f71bf28
9 changed files with 259 additions and 234 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
netbox/project-static/netbox.scss
View File

@ -313,3 +313,18 @@ div.field-group:not(:first-of-type) {
margin-bottom: $spacer; 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;
}
}

3
netbox/templates/base.html
View File

@ -17,8 +17,7 @@
/> />
</head> </head>
<body> <body>
{% comment %} {% include './layout.html' %} {% endcomment %} {% comment %} {% block layout %}{% endblock %}
{% endcomment %} {% block layout %}{% endblock %}
<script <script
src="{% static 'netbox.js' %}" src="{% static 'netbox.js' %}"
onerror="window.location='{% url 'media_failure' %}?filename=netbox.js'" onerror="window.location='{% url 'media_failure' %}?filename=netbox.js'"

7
netbox/templates/dcim/device.html
View File

@ -319,6 +319,11 @@
<div class="card-body"> <div class="card-body">
{% if related_devices %} {% if related_devices %}
<table class="table table-hover"> <table class="table table-hover">
<tr>
<th>Device</th>
<th>Rack</th>
<th>Type</th>
</tr>
{% for rd in related_devices %} {% for rd in related_devices %}
<tr> <tr>
<td> <td>
@ -326,7 +331,7 @@
</td> </td>
<td> <td>
{% if rd.rack %} {% 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 %} {% else %}
<span class="text-muted">&mdash;</span> <span class="text-muted">&mdash;</span>
{% endif %} {% endif %}

2
netbox/templates/dcim/device_edit.html
View File

@ -2,6 +2,8 @@
{% load form_helpers %} {% load form_helpers %}
{% block form %} {% block form %}
{% render_errors form %}
<div class="field-group"> <div class="field-group">
<h4 >Device</h4> <h4 >Device</h4>
{% render_field form.name %} {% render_field form.name %}

69
netbox/templates/dcim/inc/cable_form.html
View File

@ -1,42 +1,39 @@
{% load form_helpers %} {% load form_helpers %}
<div class="panel panel-default"> <div class="field-group">
<div class="panel-heading"><strong>Cable</strong></div> <h4>Cable</h4>
<div class="panel-body"> {% render_field form.status %}
{% render_field form.status %} {% render_field form.type %}
{% render_field form.type %} {% render_field form.label %}
{% render_field form.label %} {% render_field form.color %}
{% render_field form.color %} <div class="field-group">
<div class="form-group"> <label class="col-md-3 control-label" for="id_length">{{ form.length.label }}</label>
<label class="col-md-3 control-label" for="id_length">{{ form.length.label }}</label> <div class="col-md-5">
<div class="col-md-5"> {{ form.length }}
{{ form.length }} {% if form.length.errors %}
{% if form.length.errors %} <ul>
<ul> {% for error in form.length.errors %}
{% for error in form.length.errors %} <li class="text-danger">{{ error }}</li>
<li class="text-danger">{{ error }}</li> {% endfor %}
{% endfor %} </ul>
</ul> {% endif %}
{% endif %} </div>
</div> <div class="col-md-4">
<div class="col-md-4"> {{ form.length_unit }}
{{ form.length_unit }} {% if form.length_unit.errors %}
{% if form.length_unit.errors %} <ul>
<ul> {% for error in form.length_unit.errors %}
{% for error in form.length_unit.errors %} <li class="text-danger">{{ error }}</li>
<li class="text-danger">{{ error }}</li> {% endfor %}
{% endfor %} </ul>
</ul> {% endif %}
{% endif %}
</div>
</div> </div>
{% render_field form.tags %}
</div> </div>
{% render_field form.tags %}
</div> </div>
{% if form.custom_fields %} {% if form.custom_fields %}
<div class="panel panel-default"> <div class="field-group">
<div class="panel-heading"><strong>Custom Fields</strong></div> <h4>Custom Fields</h4>
<div class="panel-body"> {% render_custom_fields form %}
{% render_custom_fields form %} </div>
</div>
</div>
{% endif %} {% endif %}

348
netbox/templates/extras/configcontext.html
View File

@ -3,191 +3,195 @@
{% load static %} {% load static %}
{% block breadcrumbs %} {% block breadcrumbs %}
<li><a href="{% url 'extras:configcontext_list' %}">Config Contexts</a></li> <li class="breadcrumb-item"><a href="{% url 'extras:configcontext_list' %}">Config Contexts</a></li>
<li>{{ object }}</li> <li class="breadcrumb-item">{{ object }}</li>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="row"> <div class="row">
<div class="col-md-5"> <div class="col-md-5">
<div class="panel panel-default"> <div class="card">
<div class="panel-heading"> <h5 class="card-header">
<strong>Config Context</strong> 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> </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>
<div class="panel panel-default"> <div class="card">
<div class="panel-heading"> <h5 class="card-header">
<strong>Assignment</strong> 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> </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> </div>
<div class="col-md-7"> <div class="col-md-7">
<div class="panel panel-default"> <div class="card">
<div class="panel-heading"> <div class="card-header">
<strong>Data</strong> <h5>Data</h5>
{% include 'extras/inc/configcontext_format.html' %} {% include 'extras/inc/configcontext_format.html' %}
</div> </div>
<div class="panel-body"> <div class="card-body">
{% include 'extras/inc/configcontext_data.html' with data=object.data format=format %} {% include 'extras/inc/configcontext_data.html' with data=object.data format=format %}
</div> </div>
</div> </div>

8
netbox/templates/extras/inc/configcontext_format.html
View File

@ -1,6 +1,6 @@
<div class="pull-right"> <div class="float-end">
<div class="btn-group btn-group-xs" role="group"> <div class="btn-group btn-group-sm" role="group">
<a href="?format=json" class="btn btn-default{% if format == 'json' %} active{% endif %}">JSON</a> <a href="?format=json" type="button" class="btn btn-outline-dark{% if format == 'json' %} active{% endif %}">JSON</a>
<a href="?format=yaml" class="btn btn-default{% if format == 'yaml' %} active{% endif %}">YAML</a> <a href="?format=yaml" type="button" class="btn btn-outline-dark{% if format == 'yaml' %} active{% endif %}">YAML</a>
</div> </div>
</div> </div>

2
netbox/templates/generic/object.html
View File

@ -11,7 +11,7 @@
{% block breadcrumb_main %} {% block breadcrumb_main %}
<nav class="breadcrumb-container" aria-label="breadcrumb"> <nav class="breadcrumb-container" aria-label="breadcrumb">
<ol class="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%} {% block breadcrumbs %}{%endblock%}
</ol> </ol>
</nav> </nav>

39
netbox/templates/generic/object_bulk_delete.html
View File

@ -5,33 +5,36 @@
{% block content %} {% block content %}
<div class="row"> <div class="row">
<div class="col-md-8 col-md-offset-2"> <div class="col-md-8">
<div class="card bg-danger"> <div class="alert alert-danger mb-3" role="alert">
<h5 class="card-header">Confirm Bulk Deletion</h5> <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"> <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> {% include 'inc/table.html' %}
{% block message_extra %}{% endblock %}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row mt-3">
<div class="col-md-8 col-md-offset-2"> <div class="col-md-8">
<div class="card"> <form action="" method="post">
{% 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">
{% csrf_token %} {% csrf_token %}
{% for field in form.hidden_fields %} {% for field in form.hidden_fields %}
{{ field }} {{ field }}
{% endfor %} {% endfor %}
<div class="text-center"> <div class="text-end">
<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-outline-dark">Cancel</a>
<a href="{{ return_url }}" class="btn btn-default">Cancel</a> <button type="submit" name="_confirm" class="btn btn-danger">Delete {{ table.rows|length }} {{ obj_type_plural }}</button>
</div> </div>
</form> </form>
</div> </div>