nik/FreedomBox
1
0
Fork 0
mirror of https://github.com/freedombox/FreedomBox.git synced 2026-01-28 08:03:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

ui: Use Bootstrap 5 styling for all alerts

Browse Source 
- Ensure that .sr-only is replaced with newer classes.

- Ensure that icons are present for all alerts.

- Use flex-box for display of icons on the left center of the alert.

- .close has been renamed to .btn-close.

- × is no longer required for close buttons.

Tests:

- Visually verify all the changes by triggering them with code changes.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
This commit is contained in:
Sunil Mohan Adapa 2024-11-13 16:30:57 -08:00 committed by Veiko Aasa
parent ac6cca95e3
commit 62dad9336b
No known key found for this signature in database
GPG Key ID: 478539CAE680674E
26 changed files with 390 additions and 193 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
plinth/modules/backups/templates/backups_add_remote_repository.html
View File

@ -15,13 +15,19 @@
{{ form|bootstrap }}
<div class="alert alert-warning" role="alert">
{% blocktrans trimmed %}
The credentials for this repository are stored on your {{ box_name }}.
<br />
To restore a backup on a new {{ box_name }} you need the SSH
credentials and, if chosen, the encryption passphrase.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
The credentials for this repository are stored on your {{ box_name }}.
<br />
To restore a backup on a new {{ box_name }} you need the SSH credentials
and, if chosen, the encryption passphrase.
{% endblocktrans %}
</div>
</div>
<input type="submit" class="btn btn-primary"

18
plinth/modules/backups/templates/backups_upload.html
View File

@ -22,13 +22,17 @@
</p>
{% if max_filesize %}
<div class="alert alert-warning" role="alert">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="sr-only">{% trans "Caution:" %}</span>
{% blocktrans trimmed %}
You have {{ max_filesize }} available to restore a backup.
Exceeding this limit can leave your {{ box_name }} unusable.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
You have {{ max_filesize }} available to restore a backup.
Exceeding this limit can leave your {{ box_name }} unusable.
{% endblocktrans %}
</div>
</div>
{% endif %}

8
plinth/modules/backups/templates/verify_ssh_hostkey.html
View File

@ -21,7 +21,13 @@
{% endblocktrans %}
</p>
{% if form.keyscan_error %}
<pre class="alert alert-danger">{{ form.keyscan_error }}</pre>
<div class="alert alert-danger d-flex align-items-center">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<pre class="mb-0">{{ form.keyscan_error }}</pre>
</div>
{% endif %}
{% else %}
<p>

10
plinth/modules/diagnostics/templates/diagnostics_app.html
View File

@ -25,8 +25,14 @@
{% if results %}
{% include "diagnostics_results.html" with results=results %}
{% elif exception %}
<div class="alert alert-danger" role="alert">
{{ exception }}
<div class="alert alert-danger d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{{ exception }}
</div>
</div>
{% else %}
<p>{% trans "This app does not support diagnostics" %}</p>

10
plinth/modules/diagnostics/templates/diagnostics_full.html
View File

@ -53,8 +53,14 @@
{% if app_data.diagnosis %}
{% include "diagnostics_results.html" with results=app_data.diagnosis %}
{% elif app_data.exception %}
<div class="alert alert-danger" role="alert">
{{ app_data.exception }}
<div class="alert alert-danger d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{{ app_data.exception }}
</div>
</div>
{% else %}
<p><span class="fa fa-hourglass-o"></span></p>

42
plinth/modules/help/templates/help_about.html
View File

@ -14,22 +14,34 @@
</p>
{% if version %}
<div class="alert {% if new_version %}alert-warning{% else %}alert-success{% endif %}">
{% blocktrans trimmed %}
You are running {{ os_release }} and {{ box_name }} version {{ version }}.
{% endblocktrans %}
<div class="alert {% if new_version %}alert-warning{% else %}alert-success{% endif %}
d-flex align-items-center">
<div class="me-2">
{% if new_version %}
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
{% else %}
<span class="fa fa-check-circle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Success:" %}</span>
{% endif %}
</div>
<div>
{% blocktrans trimmed %}
You are running {{ os_release }} and {{ box_name }} version {{ version }}.
{% endblocktrans %}
{% if new_version %}
{% url 'upgrades:index' as upgrades_url %}
{% blocktrans trimmed %}
There is a new {{ box_name }} version
<a href="{{ upgrades_url }}">available</a>.
{% endblocktrans %}
{% else %}
{% blocktrans trimmed %}
{{ box_name }} is up to date.
{% endblocktrans %}
{% endif %}
{% if new_version %}
{% url 'upgrades:index' as upgrades_url %}
{% blocktrans trimmed %}
There is a new {{ box_name }} version
<a href="{{ upgrades_url }}">available</a>.
{% endblocktrans %}
{% else %}
{% blocktrans trimmed %}
{{ box_name }} is up to date.
{% endblocktrans %}
{% endif %}
</div>
</div>
{% endif %}

20
plinth/modules/help/templates/statuslog.html
View File

@ -18,14 +18,18 @@
{% endblocktrans %}
</p>
<p class="alert alert-warning">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="sr-only">{% trans "Caution:" %}</span>
{% blocktrans trimmed %}
Please remove any personal information from the log before submitting the
bug report.
{% endblocktrans %}
</p>
<div class="alert alert-warning d-flex align-items-center">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
Please remove any personal information from the log before submitting
the bug report.
{% endblocktrans %}
</div>
</div>
<p>
<pre class="status-log">{{ data }}</pre>

14
plinth/modules/kiwix/templates/kiwix-add-package.html
View File

@ -20,10 +20,16 @@
</p>
{% if max_filesize %}
<div class="alert alert-warning" role="alert">
{% blocktrans trimmed %}
You have {{ max_filesize }} of free disk space available.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
You have {{ max_filesize }} of free disk space available.
{% endblocktrans %}
</div>
</div>
{% endif %}

17
plinth/modules/matrixsynapse/templates/matrix-synapse-pre-setup.html
View File

@ -22,11 +22,18 @@
{% endblocktrans %}
</p>
<div class="alert alert-warning" role="alert">
{% blocktrans trimmed %}
<strong>Warning!</strong> Changing the domain name after this step will
require uninstalling and reinstalling the app which will wipe app's data.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
<strong>Warning!</strong> Changing the domain name after this step will
require uninstalling and reinstalling the app which will wipe app's
data.
{% endblocktrans %}
</div>
</div>
{% if not domain_names %}

22
plinth/modules/matrixsynapse/templates/matrix-synapse.html
View File

@ -70,14 +70,20 @@
{% endif %}
{% if certificate_status != "valid" %}
<div class="alert alert-warning" role="alert">
{% url 'letsencrypt:index' as letsencrypt_url %}
{% blocktrans trimmed %}
The configured domain name is using a self-signed certificate.
Federation with other Matrix Synapse instances requires a valid TLS
certificate. Please go to <a href="{{ letsencrypt_url }}">Let's
Encrypt</a> to obtain one.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% url 'letsencrypt:index' as letsencrypt_url %}
{% blocktrans trimmed %}
The configured domain name is using a self-signed certificate.
Federation with other Matrix Synapse instances requires a valid TLS
certificate. Please go to <a href="{{ letsencrypt_url }}">Let's
Encrypt</a> to obtain one.
{% endblocktrans %}
</div>
</div>
{% endif %}
{% endblock %}

10
plinth/modules/names/templates/names.html
View File

@ -122,8 +122,14 @@
</form>
</p>
{% else %}
<div class="alert alert-danger">
{% trans "Error retrieving status:" %} {{ resolved_status_error }}
<div class="alert alert-danger d-flex align-items-center">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% trans "Error retrieving status:" %} {{ resolved_status_error }}
</div>
</div>
{% endif %}

95
plinth/modules/networks/templates/connection_show.html
View File

@ -18,15 +18,19 @@
<div class="row">
<div class="col-md-8 offset-md-2">
{% if connection.primary %}
<div class="alert alert-warning" role="alert">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="sr-only">{% trans "Caution:" %}</span>
{% blocktrans trimmed %}
This is the primary connection that {{ box_name }} relies on for
Internet connectivity. Altering it may render your {{ box_name }}
unreachable. Ensure that you have other means to access
{{ box_name }} before altering this connection.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
This is the primary connection that {{ box_name }} relies on for
Internet connectivity. Altering it may render your {{ box_name }}
unreachable. Ensure that you have other means to access
{{ box_name }} before altering this connection.
{% endblocktrans %}
</div>
</div>
{% endif %}
@ -279,15 +283,20 @@
</div>
</div>
<div class="alert alert-info">
<span class="fa fa-info-circle" aria-hidden="true"></span>
{% blocktrans trimmed %}
This interface should be connected to a local
network/machine. If you connect this interface to a
public network, services meant to be available only
internally will become available externally. This is a
security risk.
{% endblocktrans %}
<div class="alert alert-info d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-info-circle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Info:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
This interface should be connected to a local
network/machine. If you connect this interface to a
public network, services meant to be available only
internally will become available externally. This is a
security risk.
{% endblocktrans %}
</div>
</div>
{% elif connection.zone == "external" %}
<div class="list-group list-group-two-column">
@ -299,14 +308,19 @@
</div>
</div>
<div class="alert alert-info">
<span class="fa fa-info-circle" aria-hidden="true"></span>
{% blocktrans trimmed %}
This interface should receive your Internet connection.
If you connect it to a local network/machine, many
services meant to available only internally will not be
available.
{% endblocktrans %}
<div class="alert alert-info d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-info-circle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Info:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
This interface should receive your Internet connection.
If you connect it to a local network/machine, many
services meant to available only internally will not be
available.
{% endblocktrans %}
</div>
</div>
{% else %}
<div class="list-group list-group-two-column">
@ -318,18 +332,23 @@
</div>
</div>
<div class="alert alert-info">
<span class="fa fa-info-circle" aria-hidden="true"></span>
{% blocktrans trimmed %}
This interface is not maintained by {{ box_name }}. For security,
it is automatically assigned to the external zone.
{% endblocktrans %}
{% blocktrans trimmed %}
This interface should receive your Internet connection.
If you connect it to a local network/machine, many
services meant to available only internally will not be
available.
{% endblocktrans %}
<div class="alert alert-info d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-info-circle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Info:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
This interface is not maintained by {{ box_name }}. For security,
it is automatically assigned to the external zone.
{% endblocktrans %}
{% blocktrans trimmed %}
This interface should receive your Internet connection.
If you connect it to a local network/machine, many
services meant to available only internally will not be
available.
{% endblocktrans %}
</div>
</div>
{% endif %}
</div>

13
plinth/modules/networks/templates/connections_fields.html
View File

@ -6,11 +6,20 @@
{% load i18n %}
{% if form.non_field_errors %}
<div class="alert alert-danger">
<a class="close" data-dismiss="alert">&times;</a>
<div class="alert alert-danger alert-dismissible
d-flex align-items-center fade show">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Error:" %}</span>
</div>
<div>
{% for non_field_error in form.non_field_errors %}
{{ non_field_error }}
{% endfor %}
<button type="button" class="btn-close" data-bs-dismiss="alert"
aria-label="{% trans "Close" %}">
</button>
</div>
</div>
{% endif %}

12
plinth/modules/nextcloud/__init__.py
View File

@ -21,6 +21,15 @@ from plinth.utils import format_lazy
from . import manifest, privileged
_alert = '''
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{}</span>
</div>
<div>{}</div>
</div>
'''
_description = [
_('Nextcloud is a self-hosted productivity platform which provides '
'private and secure functions for file sharing, collaborative work, '
@ -36,8 +45,7 @@ _description = [
'and legal reviews are done by the upstream project and not by '
'Debian/{box_name}. Updates are performed following an independent '
'cycle.'), box_name=_(cfg.box_name)),
format_lazy('<div class="alert alert-warning" role="alert">{}</div>',
_('This app is experimental.')),
format_lazy(_alert, _('Caution:'), _('This app is experimental.')),
]

19
plinth/modules/pagekite/templates/pagekite_custom_services.html
View File

@ -10,13 +10,18 @@
{% block content %}
<h3>{% trans 'Add custom PageKite service' %}</h3>
<div class="alert alert-warning" role="alert">
{% blocktrans trimmed %}
<b>Warning:</b><br>Your PageKite frontend server may not support
all the protocol/port combinations that you are able to define
here. For example, HTTPS on ports other than 443 is known to
cause problems.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
Your PageKite frontend server may not support all the protocol/port
combinations that you are able to define here. For example, HTTPS on
ports other than 443 is known to cause problems.
{% endblocktrans %}
</div>
</div>
<form class="form" method="post">

16
plinth/modules/power/templates/power.html
View File

@ -9,11 +9,17 @@
{% block configuration %}
{% if pkg_manager_is_busy %}
<div class="alert alert-danger">
{% blocktrans trimmed %}
Currently an installation or upgrade is running.
Consider waiting until it's finished before shutting down or restarting.
{% endblocktrans %}
<div class="alert alert-danger d-flex align-items-center">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
Currently an installation or upgrade is running.
Consider waiting until it's finished before shutting down or restarting.
{% endblocktrans %}
</div>
</div>
{% endif %}

16
plinth/modules/power/templates/power_restart.html
View File

@ -30,11 +30,17 @@
{% endif %}
{% if pkg_manager_is_busy %}
<div class="alert alert-danger">
{% blocktrans trimmed %}
Currently an installation or upgrade is running.
Consider waiting until it's finished before restarting.
{% endblocktrans %}
<div class="alert alert-danger d-flex align-items-center">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
Currently an installation or upgrade is running.
Consider waiting until it's finished before shutting down or restarting.
{% endblocktrans %}
</div>
</div>
{% endif %}

16
plinth/modules/power/templates/power_shutdown.html
View File

@ -29,11 +29,17 @@
{% endif %}
{% if pkg_manager_is_busy %}
<div class="alert alert-danger">
{% blocktrans trimmed %}
Currently an installation or upgrade is running.
Consider waiting until it's finished before shutting down.
{% endblocktrans %}
<div class="alert alert-danger d-flex align-items-center">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
Currently an installation or upgrade is running.
Consider waiting until it's finished before shutting down or restarting.
{% endblocktrans %}
</div>
</div>
{% endif %}

18
plinth/modules/snapshot/templates/snapshot_not_supported.html
View File

@ -7,11 +7,17 @@
{% load i18n %}
{% block configuration %}
<div id="snapshot-not-supported" class="alert alert-danger">
{% blocktrans trimmed with fs_types_supported|join:', ' as types_supported %}
You have a filesystem of type <strong>{{ fs_type }}</strong>. Snapshots
are currently only available on <strong>{{ types_supported }}</strong>
filesystems.
{% endblocktrans %}
<div id="snapshot-not-supported" class="alert alert-danger d-flex align-items-center">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed with fs_types_supported|join:', ' as types_supported %}
You have a filesystem of type <strong>{{ fs_type }}</strong>. Snapshots
are currently only available on <strong>{{ types_supported }}</strong>
filesystems.
{% endblocktrans %}
</div>
</div>
{% endblock %}

16
plinth/modules/upgrades/templates/backports-firstboot.html
View File

@ -29,11 +29,17 @@
{% endblocktrans %}
</p>
<div class="alert alert-warning" role="alert">
{% blocktrans trimmed %}
<strong>Note:</strong> Once frequent feature updates are activated,
they cannot be deactivated.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
<strong>Note:</strong> Once frequent feature updates are activated, they
cannot be deactivated.
{% endblocktrans %}
</div>
</div>
<form class="form" method="post">

20
plinth/modules/upgrades/templates/upgrades_configure.html
View File

@ -72,13 +72,19 @@
{% endif %}
</p>
{% if can_activate_backports and not is_backports_requested %}
<div class="alert alert-warning" role="alert">
{% url 'snapshot:index' as snapshot_url %}
{% blocktrans trimmed %}
<strong>Warning!</strong> Once frequent feature updates are activated,
they cannot be deactivated. You may wish to take a snapshot using
<a href="{{ snapshot_url }}">Storage Snapshots</a> before continuing.
{% endblocktrans %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% url 'snapshot:index' as snapshot_url %}
{% blocktrans trimmed %}
<strong>Warning!</strong> Once frequent feature updates are activated,
they cannot be deactivated. You may wish to take a snapshot using
<a href="{{ snapshot_url }}">Storage Snapshots</a> before continuing.
{% endblocktrans %}
</div>
</div>
<p>
<form class="form" method="post"

14
plinth/modules/users/templates/users_firstboot.html
View File

@ -28,10 +28,16 @@
value="{% trans "Create Account" %}"/>
</form>
{% else %}
<div class="alert alert-danger" role="alert">
{% blocktrans trimmed %}
An administrator account already exists.
{% endblocktrans %}
<div class="alert alert-danger d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
An administrator account already exists.
{% endblocktrans %}
</div>
</div>
<p>

14
plinth/templates/app.html
View File

@ -25,10 +25,16 @@
{% block status %}
{% if is_running is not None and not is_running %}
<div id='service-not-running' role="alert"
class="alert alert-danger {{ is_enabled|yesno:',d-none' }}">
{% blocktrans trimmed with service_name=app_info.name %}
Service <em>{{ service_name }}</em> is not running.
{% endblocktrans %}
class="alert alert-danger d-flex align-items-center {{ is_enabled|yesno:',d-none' }}">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed with service_name=app_info.name %}
Service <em>{{ service_name }}</em> is not running.
{% endblocktrans %}
</div>
</div>
{% endif %}
{% endblock %}

48
plinth/templates/internal-zone.html
View File

@ -7,26 +7,34 @@
{% block internal_zone_warning %}
{% for component in firewall %}
{% if not component.is_external %}
<div class="alert alert-info" role="alert">
{% blocktrans trimmed with service_name=component.name %}
<em>{{ service_name }}</em> is available only on internal networks or
when the client is connected to {{ box_name }} through VPN.
{% endblocktrans %}
<p>
{% with interfaces=component.get_internal_interfaces %}
{% if not interfaces %}
{% blocktrans trimmed %}
Currently there are no network interfaces configured as
internal.
{% endblocktrans %}
{% else %}
{% blocktrans trimmed with interface_list=interfaces|join:", " %}
Currently the following network interfaces are configured as
internal: {{ interface_list }}
{% endblocktrans %}
{% endif %}
{% endwith %}
</p>
<div class="alert alert-info d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-info-circle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Info:" %}</span>
</div>
<div>
<div>
{% blocktrans trimmed with service_name=component.name %}
<em>{{ service_name }}</em> is available only on internal networks
or when the client is connected to {{ box_name }} through VPN.
{% endblocktrans %}
</div>
<div>
{% with interfaces=component.get_internal_interfaces %}
{% if not interfaces %}
{% blocktrans trimmed %}
Currently there are no network interfaces configured as
internal.
{% endblocktrans %}
{% else %}
{% blocktrans trimmed with interface_list=interfaces|join:", " %}
Currently the following network interfaces are configured as
internal: {{ interface_list }}
{% endblocktrans %}
{% endif %}
{% endwith %}
</div>
</div>
</div>
{% endif %}
{% endfor %}

31
plinth/templates/messages.html
View File

@ -5,11 +5,30 @@
{% load i18n %}
{% for message in messages %}
<div class='alert alert-{{ message.tags }} alert-dismissible'>
{{ message }}
<button type="button" class="close" data-dismiss="alert"
aria-label="{% trans "Close" %}">
<span aria-hidden="true">&times;</span>
</button>
<div class="alert alert-{{ message.tags }} alert-dismissible
d-flex align-items-center fade show"
role="alert">
<div class="me-2">
{% if message.tags == 'danger' %}
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Error:" %}</span>
{% elif message.tags == 'warning' %}
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
{% elif message.tags == 'info' %}
<span class="fa fa-info-circle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Info:" %}</span>
{% elif message.tags == 'success' %}
<span class="fa fa-check-circle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Success:" %}</span>
{% endif %}
</div>
<div>
{{ message }}
<button type="button" class="btn-close" data-bs-dismiss="alert"
aria-label="{% trans "Close" %}">
</button>
</div>
</div>
{% endfor %}

44
plinth/templates/setup.html
View File

@ -37,24 +37,36 @@
{% csrf_token %}
{% if has_unavailable_packages %}
<div class="alert alert-warning" role="alert">
{% blocktrans trimmed %}
This application is currently not available in your distribution.
{% endblocktrans %}
<button type="submit" class="btn btn-default btn-sm" name="refresh-packages">
<span class="fa fa-refresh"></span> {% trans "Check again" %}
</button>
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
This application is currently not available in your distribution.
{% endblocktrans %}
<button type="submit" class="btn btn-default btn-sm" name="refresh-packages">
<span class="fa fa-refresh"></span> {% trans "Check again" %}
</button>
</div>
</div>
{% elif package_conflicts and package_conflicts_action.value != 'ignore' %}
<div class="alert alert-warning" role="alert">
{% blocktrans trimmed %}
<strong>Conflicting Packages:</strong> Some packages installed on
the system conflict with the installation of this app. The following
packages will be removed if you proceed:
{% endblocktrans %}
{% for package in package_conflicts %}
{{ package }}
{% endfor %}
<div class="alert alert-warning d-flex align-items-center" role="alert">
<div class="me-2">
<span class="fa fa-exclamation-triangle" aria-hidden="true"></span>
<span class="visually-hidden">{% trans "Caution:" %}</span>
</div>
<div>
{% blocktrans trimmed %}
<strong>Conflicting Packages:</strong> Some packages installed on
the system conflict with the installation of this app. The following
packages will be removed if you proceed:
{% endblocktrans %}
{% for package in package_conflicts %}
{{ package }}
{% endfor %}
</div>
</div>
{% endif %}