networks: Use common styling for showing network connection

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
This commit is contained in:
Sunil Mohan Adapa 2020-12-17 16:43:49 -08:00 committed by Veiko Aasa
parent 9e04782f0d
commit 55880e8f0b
No known key found for this signature in database
GPG Key ID: 478539CAE680674E

View File

@ -4,18 +4,13 @@
# ToDo: if connection is disabled, no information are visible anymore (Bug) # ToDo: if connection is disabled, no information are visible anymore (Bug)
{% endcomment %} {% endcomment %}
{% load static %}
{% load bootstrap %} {% load bootstrap %}
{% load i18n %} {% load i18n %}
{% block page_head %} {% block page_head %}
<style type="text/css"> <link type="text/css" rel="stylesheet"
.list-group-item .btn { href="{% static 'networks/networks.css' %}"/>
margin: -0.3125rem 0;
}
.form-inline {
display: inline;
}
</style>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
@ -28,14 +23,14 @@
title="{% trans "Edit connection" %}">{% trans "Edit" %}</a> title="{% trans "Edit connection" %}">{% trans "Edit" %}</a>
{% if active_connection %} {% if active_connection %}
<form class="form form-inline" method="post" <form class="form" method="post"
action="{% url 'networks:deactivate' connection.uuid %}"> action="{% url 'networks:deactivate' connection.uuid %}">
{% csrf_token %} {% csrf_token %}
<button class="btn btn-default" type="submit"> <button class="btn btn-default" type="submit">
{% trans "Deactivate" %}</button> {% trans "Deactivate" %}</button>
</form> </form>
{% else %} {% else %}
<form class="form form-inline" method="post" <form class="form" method="post"
action="{% url 'networks:activate' connection.uuid %}"> action="{% url 'networks:activate' connection.uuid %}">
{% csrf_token %} {% csrf_token %}
<button class="btn btn-default" type="submit"> <button class="btn btn-default" type="submit">
@ -50,73 +45,71 @@
<h3>{% trans "Connection" %}</h3> <h3>{% trans "Connection" %}</h3>
<div class="list-group"> <div class="list-group list-group-two-column">
{% if connection.primary %} {% if connection.primary %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Primary connection" %} <span class="primary">{% trans "Primary connection" %}</span>
<div class="pull-right"> <span class="badge badge-success secondary">
<span class="badge badge-success">{% trans "yes" %}</span> {% trans "yes" %}
</div> </span>
</div> </div>
{% endif %} {% endif %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Name" %} <span class="primary">{% trans "Name" %}</span>
<div class="pull-right">{{ connection.id }}</div> <span class="secondary">{{ connection.id }}</span>
</div> </div>
</div> </div>
{% if device %} {% if device %}
<h3>{% trans "Device" %}</h3> <h3>{% trans "Device" %}</h3>
<div class="list-group"> <div class="list-group list-group-two-column">
<div class="list-group-item"> <div class="list-group-item">
{% trans "State" %} <span class="primary">{% trans "State" %}</span>
<span class="pull-right">{{ device.state_string }}</span> <span class="secondary">{{ device.state_string }}</span>
</div> </div>
{% if device.state_reason != 'none' %} {% if device.state_reason != 'none' %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "State reason" %} <span class="primary">{% trans "State reason" %}</span>
<span class="pull-right">{{ device.state_reason_string }}</span> <span class="secondary">{{ device.state_reason_string }}</span>
</div> </div>
{% endif %} {% endif %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Type" %} <span class="primary">{% trans "Type" %}</span>
<span class="pull-right">{{ device.type_string }}</span> <span class="secondary">{{ device.type_string }}</span>
</div> </div>
<div class="list-group-item"> <div class="list-group-item">
{% trans "MAC address" %} <span class="primary">{% trans "MAC address" %}</span>
<span class="pull-right">{{ device.hw_address }}</span> <span class="secondary">{{ device.hw_address }}</span>
</div> </div>
<div class="list-group-item"> <div class="list-group-item">
{% trans "Interface" %} <span class="primary">{% trans "Interface" %}</span>
<span class="pull-right">{{ device.interface_name }}</span> <span class="secondary">{{ device.interface_name }}</span>
</div> </div>
<div class="list-group-item"> <div class="list-group-item">
{% trans "Description" %} <span class="primary">{% trans "Description" %}</span>
<span class="pull-right">{{ device.description }}</span> <span class="secondary">{{ device.description }}</span>
</div> </div>
</div> </div>
{% endif %} {% endif %}
<h3>{% trans "Physical Link" %}</h3> <h3>{% trans "Physical Link" %}</h3>
<div class="list-group"> <div class="list-group list-group-two-column">
{% if device.ethernet %} {% if device.ethernet %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Link state" %} <span class="primary">{% trans "Link state" %}</span>
<div class="pull-right">
{% if device.ethernet.carrier %} {% if device.ethernet.carrier %}
<span class='badge badge-success'> <span class='badge badge-success secondary'>
{% trans "cable is connected" %}</span> {% trans "cable is connected" %}</span>
{% else %} {% else %}
<span class='badge badge-warning'> <span class='badge badge-warning secondary'>
{% trans "please check cable" %}</span> {% trans "please check cable" %}</span>
{% endif %} {% endif %}
</div> </div>
</div>
<div class="list-group-item"> <div class="list-group-item">
{% trans "Speed" %} <span class="primary">{% trans "Speed" %}</span>
<span class="pull-right"> <span class="secondary">
{% blocktrans trimmed with ethernet_speed=device.ethernet.speed %} {% blocktrans trimmed with ethernet_speed=device.ethernet.speed %}
{{ ethernet_speed }} Mbit/s {{ ethernet_speed }} Mbit/s
{% endblocktrans %} {% endblocktrans %}
@ -126,37 +119,35 @@
{% if connection.type == "802-11-wireless" %} {% if connection.type == "802-11-wireless" %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "SSID" %} <span class="primary">{% trans "SSID" %}</span>
<span class="pull-right">{{ connection.wireless.ssid }}</span> <span class="secondary">{{ connection.wireless.ssid }}</span>
</div> </div>
{% if device %} {% if device %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Speed" %} <span class="primary">{% trans "Speed" %}</span>
<span class="pull-right"> <span class="secondary">
{% blocktrans trimmed with wireless_bitrate=device.wireless.bitrate %} {% blocktrans trimmed with wireless_bitrate=device.wireless.bitrate %}
{{ wireless_bitrate }} Mbit/s {{ wireless_bitrate }} Mbit/s
{% endblocktrans %} {% endblocktrans %}
</span> </span>
</div> </div>
<div class="list-group-item"> <div class="list-group-item">
{% trans "Mode" %} <span class="primary">{% trans "Mode" %}</span>
<span class="pull-right">{{ device.wireless.mode_string }}</span> <span class="secondary">{{ device.wireless.mode_string }}</span>
</div> </div>
{% endif %} {% endif %}
{% if access_point.channel %} {% if access_point.channel %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Signal strength" %} <span class="primary">{% trans "Signal strength" %}</span>
<div class="pull-right"> <span class="btn btn-primary btn-sm secondary">
<span class="btn btn-primary btn-sm">
{{ access_point.strength }}% {{ access_point.strength }}%
</span> </span>
</div> </div>
</div>
{% endif %} {% endif %}
{% if access_point.channel %} {% if access_point.channel %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Channel" %} <span class="primary">{% trans "Channel" %}</span>
<span class="pull-right">{{ access_point.channel }}</span> <span class="secondary">{{ access_point.channel }}</span>
</div> </div>
{% endif %} {% endif %}
{% endif %} {% endif %}
@ -165,18 +156,20 @@
{% if active_connection %} {% if active_connection %}
<h3>{% trans "IPv4" %}</h3> <h3>{% trans "IPv4" %}</h3>
<div class="list-group"> <div class="list-group list-group-two-column">
{% if connection.ipv4.method %} {% if connection.ipv4.method %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Method" %} <span class="primary">{% trans "Method" %}</span>
<span class="pull-right">{{ connection.ipv4.method_string }}</span> <span class="secondary">
{{ connection.ipv4.method_string }}
</span>
</div> </div>
{% endif %} {% endif %}
{% for address in device.ip4.addresses %} {% for address in device.ip4.addresses %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "IP address" %} <span class="primary">{% trans "IP address" %}</span>
<span class="pull-right"> <span class="secondary">
{{ address.address }}/{{ address.prefix }} {{ address.address }}/{{ address.prefix }}
</span> </span>
</div> </div>
@ -184,61 +177,63 @@
{% if device.ip4.gateway %} {% if device.ip4.gateway %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Gateway" %} <span class="primary">{% trans "Gateway" %}</span>
<span class="pull-right">{{ device.ip4.gateway }}</span> <span class="secondary">{{ device.ip4.gateway }}</span>
</div> </div>
{% endif %} {% endif %}
{% for server in device.ip4.nameservers %} {% for server in device.ip4.nameservers %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "DNS server" %} <span class="primary">{% trans "DNS server" %}</span>
<span class="pull-right">{{ server }}</span> <span class="secondary">{{ server }}</span>
</div> </div>
{% endfor %} {% endfor %}
{% if active_connection.ip4.default %} {% if active_connection.ip4.default %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Default" %} <span class="primary">{% trans "Default" %}</span>
<span class="pull-right">{% trans "yes" %}</span> <span class="secondary">{% trans "yes" %}</span>
</div> </div>
{% endif %} {% endif %}
</div> </div>
<h3>{% trans "IPv6" %}</h3> <h3>{% trans "IPv6" %}</h3>
<div class="list-group"> <div class="list-group list-group-two-column">
{% if connection.ipv6.method %} {% if connection.ipv6.method %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Method" %} <span class="primary">{% trans "Method" %}</span>
<span class="pull-right">{{ connection.ipv6.method_string }}</span> <span class="secondary">{{ connection.ipv6.method_string }}</span>
</div> </div>
{% endif %} {% endif %}
{% for address in device.ip6.addresses %} {% for address in device.ip6.addresses %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "IP address" %} <span class="primary">{% trans "IP address" %}</span>
<span class="pull-right">{{ address.address }}/{{ address.prefix }}</span> <span class="secondary">
{{ address.address }}/{{ address.prefix }}
</span>
</div> </div>
{% endfor %} {% endfor %}
{% if device.ip6.gateway %} {% if device.ip6.gateway %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Gateway" %} <span class="primary">{% trans "Gateway" %}</span>
<span class="pull-right">{{ device.ip6.gateway }}</span> <span class="secondary">{{ device.ip6.gateway }}</span>
</div> </div>
{% endif %} {% endif %}
{% for server in device.ip6.nameservers %} {% for server in device.ip6.nameservers %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "DNS server" %} <span class="primary">{% trans "DNS server" %}</span>
<span class="pull-right">{{ server }}</span> <span class="secondary">{{ server }}</span>
</div> </div>
{% endfor %} {% endfor %}
{% if active_connection.ip6.default %} {% if active_connection.ip6.default %}
<div class="list-group-item"> <div class="list-group-item">
{% trans "Default" %} <span class="primary">{% trans "Default" %}</span>
<span class="pull-right">{% trans "yes" %}</span> <span class="secondary">{% trans "yes" %}</span>
</div> </div>
{% endif %} {% endif %}
</div> </div>
@ -251,12 +246,12 @@
<h3>{% trans "Security" %}</h3> <h3>{% trans "Security" %}</h3>
{% if connection.zone == "internal" %} {% if connection.zone == "internal" %}
<div class="list-group"> <div class="list-group list-group-two-column">
<div class="list-group-item"> <div class="list-group-item">
{% trans "Firewall zone" %} <span class="primary">{% trans "Firewall zone" %}</span>
<div class="pull-right"> <span class="badge badge-success secondary">
<span class="badge badge-success">{{ connection.zone_string }}</span> {{ connection.zone_string }}
</div> </span>
</div> </div>
</div> </div>
@ -271,12 +266,12 @@
{% endblocktrans %} {% endblocktrans %}
</div> </div>
{% elif connection.zone == "external" %} {% elif connection.zone == "external" %}
<div class="list-group"> <div class="list-group list-group-two-column">
<div class="list-group-item"> <div class="list-group-item">
{% trans "Firewall zone" %} <span class="primary">{% trans "Firewall zone" %}</span>
<div class="pull-right"> <span class="badge badge-warning secondary">
<span class="badge badge-warning">{{ connection.zone_string }}</span> {{ connection.zone_string }}
</div> </span>
</div> </div>
</div> </div>
@ -290,12 +285,12 @@
{% endblocktrans %} {% endblocktrans %}
</div> </div>
{% else %} {% else %}
<div class="list-group"> <div class="list-group list-group-two-column">
<div class="list-group-item"> <div class="list-group-item">
{% trans "Firewall zone" %} <span class="primary">{% trans "Firewall zone" %}</span>
<div class="pull-right"> <span class="badge badge-danger secondary">
<span class="badge badge-danger">{% trans "External" %}</span> {% trans "External" %}
</div> </span>
</div> </div>
</div> </div>