achalaramu 00bc55f762
Migrate bootstrap 4 from bootstrap 3
Closes: #1818. The new navbar collapse handles items better without a scrollbar.

- Switch dependency to newer bootstrap4 library.

- Bootstrap 4 has 5 grid levels instead of 4. Adjust all classes accordingly to
retain current semantics.

- Update for newer markup for dropdowns.

- Replace use for labels with badges. Labels have been removed. Use
badge-secondary instead of label-default.

- Replace use of btn-xs with btn-sm. Size is roughly the same.

- Accommodate removal of form-horizontal.

- .hidden* and .visible* classes have been removed. Use alternate utilities.

- Replace use of table-condensed with table-sm.

- Update progress bar background styling. .progress-bar-* have been replaced
with bg-*.

- Drop support for IE9 and below. Bootstrap 4 does not support those browsers.

- Use the new simplified markup for navs, navbar and navbar-toggler. Accommodate
removal of .navbar-fixed-top.

- Update the JSXC page too.

- Update all values that are using rem units. The base font size is now 1rem =
16px instead of 1rem = 10px. This the default for bootstrap 4.

- A button inside a dropdown menu is natively supported by bootstrap 4. Remove
custom styling done earlier.

- Drop use of removed class thumbnail.

- Override colors for buttons and warnings to keep the old style.

- Use new markup for close buttons inside alerts.

- Use .collapse.show instead of .collapse.in as per bootstrap 4 styling.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
2020-12-19 11:26:32 +02:00

106 lines
2.6 KiB
HTML

{% extends "app.html" %}
{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
{% endcomment %}
{% load bootstrap %}
{% load i18n %}
{% load static %}
{% block status %}
{% if config_running %}
<h3>{% trans "Status" %}</h3>
<p class="running-status-parent">
<span class="running-status loading"></span>
{% trans "Tor configuration is being updated" %}
</p>
{% else %}
{{ block.super }}
{% if status.hs_enabled %}
<table class="table table-bordered table-sm table-striped tor-hs">
<thead>
<tr>
<th>{% trans "Onion Service" %}</th>
<th>{% trans "Status" %}</th>
<th>{% trans "Ports" %}</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tor-hs-hostname">{{ status.hs_hostname }}</td>
<td class="tor-hs-status">{{ status.hs_status }}</td>
<td class="tor-hs-services">
{{ status.hs_services|join:', ' }}
</td>
</tr>
</tbody>
</table>
{% endif %}
{% endif %}
{% endblock %}
{% block internal_zone %}
{% if not config_running %}
{{ block.super }}
{% endif %}
{% endblock %}
{% block configuration %}
{% if not config_running %}
{{ block.super }}
{% if status.relay_enabled %}
<h3>{% trans "Relay" %}</h3>
<p>
{% blocktrans trimmed %}
If your {{ box_name }} is behind a router or firewall, you should
make sure the following ports are open, and port-forwarded, if
necessary:
{% endblocktrans %}
</p>
<div class="row">
<div class="col-md-6">
<table class="table table-bordered table-sm table-striped tor-relay-ports">
<thead>
<tr>
<th>{% trans "Service" %}</th>
<th>{% trans "Port" %}</th>
</tr>
</thead>
<tbody>
{% for name, port in status.ports.items %}
<tr>
<td class="tor-relay-port-name">{{ name }}</td>
<td class="tor-relay-port-number">{{ port }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
{% endif %}
<h3>{% trans "SOCKS" %}</h3>
<p>
{% blocktrans trimmed %}
A Tor SOCKS port is available on your {{ box_name }} on TCP port
9050.
{% endblocktrans %}
</p>
{% endif %}
{% endblock %}
{% block page_js %}
<script type="text/javascript" src="{% static 'tor/tor.js' %}"></script>
{% endblock %}