mirror of
https://github.com/netbox-community/netbox.git
synced 2025-07-19 05:21:55 -06:00
update cable trace styles
This commit is contained in:
parent
844186d520
commit
59256cf8b3
BIN
netbox/project-static/dist/netbox.css
vendored
BIN
netbox/project-static/dist/netbox.css
vendored
Binary file not shown.
2
netbox/project-static/dist/netbox.css.map
vendored
2
netbox/project-static/dist/netbox.css.map
vendored
File diff suppressed because one or more lines are too long
@ -349,3 +349,44 @@ table td,
|
||||
table th {
|
||||
font-size: $font-size-sm;
|
||||
}
|
||||
|
||||
// Cable Tracing
|
||||
.cable-trace {
|
||||
max-width: 38rem;
|
||||
margin: 1rem auto;
|
||||
text-align: center;
|
||||
}
|
||||
.cable-trace .node {
|
||||
background-color: $gray-100;
|
||||
border: $border-width solid $gray-200;
|
||||
border-radius: $border-radius;
|
||||
padding: 1.5rem 1rem;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.cable-trace .termination {
|
||||
background-color: $gray-200;
|
||||
border: $border-width solid $gray-300;
|
||||
box-shadow: $box-shadow;
|
||||
border-radius: $border-radius;
|
||||
margin: -1rem auto;
|
||||
padding: 0.5rem;
|
||||
position: relative;
|
||||
width: 60%;
|
||||
z-index: 2;
|
||||
}
|
||||
.cable-trace .active {
|
||||
border: 0.25rem solid $green;
|
||||
}
|
||||
.cable-trace .cable {
|
||||
border-left-style: solid;
|
||||
border-left-width: 0.25rem;
|
||||
margin: 1rem 0 1rem 50%;
|
||||
padding: 1.5rem;
|
||||
text-align: left;
|
||||
width: 50%;
|
||||
}
|
||||
.cable-trace .trace-end {
|
||||
margin-top: 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
@ -9,13 +9,18 @@
|
||||
<li class="breadcrumb-item">{{ object }}</li>
|
||||
{% endblock %}
|
||||
|
||||
{% block buttons %}
|
||||
{% block controls %}
|
||||
{% plugin_buttons object %}
|
||||
<div class="container mb-2 mx-0">
|
||||
<div class="d-flex flex-wrap justify-content-end">
|
||||
{% if request.user|can_change:object %}
|
||||
{% edit_button object %}
|
||||
{% endif %}
|
||||
{% if request.user|can_delete:object %}
|
||||
{% delete_button object %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
@ -1,4 +1,4 @@
|
||||
{% extends 'base.html' %}
|
||||
{% extends 'layout.html' %}
|
||||
{% load helpers %}
|
||||
|
||||
{% block header %}
|
||||
@ -54,7 +54,7 @@
|
||||
<div class="trace-end">
|
||||
<h3 class="text-danger">Path split!</h3>
|
||||
<p>Select a node below to continue:</p>
|
||||
<ul class="text-left">
|
||||
<ul class="text-start">
|
||||
{% for next_node in path.get_split_nodes %}
|
||||
{% if next_node.cable %}
|
||||
<li>
|
||||
@ -69,9 +69,9 @@
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="trace-end">
|
||||
<h3{% if far_end %} class="text-success"{% endif %}>Trace completed</h3>
|
||||
<h5>Total segments: {{ traced_path|length }}</h5>
|
||||
<h5>Total length:
|
||||
<h3{% if far_end %} class="text-success"{% endif %}>Trace Completed</h3>
|
||||
<h5>Total Segments: {{ traced_path|length }}</h5>
|
||||
<h5>Total Length:
|
||||
{% if total_length %}
|
||||
{{ total_length|floatformat:"-2" }}{% if not is_definitive %}+{% endif %} Meters /
|
||||
{{ total_length|meters_to_feet|floatformat:"-2" }} Feet
|
||||
@ -89,44 +89,46 @@
|
||||
</div>
|
||||
<div class="col-md-7 col-sm-12">
|
||||
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<strong>Related Paths</strong>
|
||||
</div>
|
||||
<table class="table table-hover panel-body">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Origin</th>
|
||||
<th>Destination</th>
|
||||
<th>Segments</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for cablepath in related_paths %}
|
||||
<tr{% if cablepath.pk == path.pk %} class="info"{% endif %}>
|
||||
<td>
|
||||
<a href="?cablepath_id={{ cablepath.pk }}">
|
||||
{{ cablepath.origin.parent_object }} / {{ cablepath.origin }}
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
{% if cablepath.destination %}
|
||||
{{ cablepath.destination }} ({{ cablepath.destination.parent_object }})
|
||||
{% else %}
|
||||
<span class="text-muted">Incomplete</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="text-right">
|
||||
{{ cablepath.segment_count }}
|
||||
</td>
|
||||
<div class="card">
|
||||
<h5 class="card-header">
|
||||
Related Paths
|
||||
</h5>
|
||||
<div class="card-body">
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Origin</th>
|
||||
<th>Destination</th>
|
||||
<th>Segments</th>
|
||||
</tr>
|
||||
{% empty %}
|
||||
<td colspan="3" class="text-muted">
|
||||
None found
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for cablepath in related_paths %}
|
||||
<tr{% if cablepath.pk == path.pk %} class="info"{% endif %}>
|
||||
<td>
|
||||
<a href="?cablepath_id={{ cablepath.pk }}">
|
||||
{{ cablepath.origin.parent_object }} / {{ cablepath.origin }}
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
{% if cablepath.destination %}
|
||||
{{ cablepath.destination }} ({{ cablepath.destination.parent_object }})
|
||||
{% else %}
|
||||
<span class="text-muted">Incomplete</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="text-end">
|
||||
{{ cablepath.segment_count }}
|
||||
</td>
|
||||
</tr>
|
||||
{% empty %}
|
||||
<td colspan="3" class="text-muted">
|
||||
None found
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
@ -1,13 +1,13 @@
|
||||
{% load helpers %}
|
||||
|
||||
<div class="cable" style="border-left-color: #{% if cable.color == 'ffffff' %}909090; border-left-style: double; border-left-width: 6px;{% else %}{{ cable.color|default:'606060' }};{% endif %} {% if cable.status != 'connected' %} border-left-style: dashed{% endif %}">
|
||||
<div class="cable" style="border-left-color: #{% if cable.color == 'ffffff' %}909090; border-left-style: double; border-left-width: 0.4rem;{% else %}{{ cable.color|default:'606060' }};{% endif %} {% if cable.status != 'connected' %} border-left-style: dashed{% endif %}">
|
||||
<strong>
|
||||
<a href="{% url 'dcim:cable' pk=cable.pk %}">
|
||||
{% if cable.label %}<code>{{ cable.label }}</code>{% else %}Cable #{{ cable.pk }}{% endif %}
|
||||
</a>
|
||||
</strong><br />
|
||||
{% if cable.type %}
|
||||
{{ cable.get_type_display|default:"" }}<br />
|
||||
<span class="badge bg-secondary">{{ cable.get_type_display|default:"" }}</span>
|
||||
{% endif %}
|
||||
{% if cable.length %}
|
||||
({{ cable.length }} {{ cable.get_length_unit_display }})<br />
|
||||
|
@ -3,6 +3,6 @@
|
||||
<strong><a href="{{ termination.get_absolute_url }}">{{ termination }}</a></strong><br />
|
||||
{{ termination|meta:"verbose_name"|bettertitle }}
|
||||
{% if termination.type %}
|
||||
({{ termination.get_type_display }})
|
||||
<small class="text-muted">{{ termination.get_type_display }}</small>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user