Sunil Mohan Adapa 62dad9336b
ui: Use Bootstrap 5 styling for all alerts
- 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>
2024-12-12 12:38:01 +02:00

42 lines
1.2 KiB
HTML

{% extends 'base.html' %}
{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
{% endcomment %}
{% load i18n %}
{% block content %}
<h2>{% trans "Diagnostic Results" %}</h2>
<div class="row align-items-center justify-content-between">
<h3>{% blocktrans %}App: {{ app_name }}{% endblocktrans %}</h3>
{% if show_repair %}
<form class="form form-diagnostics-repair-button" method="post"
action="{% url 'diagnostics:repair' app_id=app_id %}">
{% csrf_token %}
<input type="submit" class="btn btn-default"
name="repair" value="{% trans "Try to repair" %}"/>
</form>
{% endif %}
</div>
{% if results %}
{% include "diagnostics_results.html" with results=results %}
{% elif 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>
{% endif %}
{% endblock %}