Sunil Mohan Adapa 83c0adf6cf
ui: Avoid inline styling for setting progress bar width
- attr() CSS function can't used practically on anything but the content
property.

- Introduce a hack for setting any arbitrary percentage width on an element
similar to w-25, w-50, w-75 and w-100 bootstrap utilities. This hack should not
be used widely.

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

54 lines
1.5 KiB
HTML

{% extends 'app.html' %}
{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
{% endcomment %}
{% load i18n %}
{% load static %}
{% block configuration %}
{% if not is_running %}
<form class="form form-run-diagnostics" method="post"
action="{% url 'diagnostics:index' %}">
{% csrf_token %}
<input type="submit" class="btn btn-primary"
value="{% trans "Run Diagnostics" %}"/>
</form>
{% else %}
<p>{% trans "Diagnostics test is currently running" %}</p>
<div class="progress">
<div class="progress-bar progress-bar-striped active
w-{{ results.progress_percentage }}"
role="progressbar" aria-valuemin="0" aria-valuemax="100"
aria-valuenow="{{ results.progress_percentage }}">
{{ results.progress_percentage }}%
</div>
</div>
{% endif %}
{% if results %}
<h3>{% trans "Results" %}</h3>
{% for app_id, app_data in results.results.items %}
<h4>
{% blocktrans with app_name=app_data.name %}
App: {{app_name}}
{% endblocktrans %}
</h4>
{% 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>
{% else %}
<p><span class="fa fa-hourglass-o"></span></p>
{% endif %}
{% endfor %}
{% endif %}
{% endblock %}