ui: diagnostics: Fix gap between headings

- Wrap each app's results in a <section>. Style section to maintain gap with
previous sections.

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-16 10:55:25 -08:00 committed by Veiko Aasa
parent a2d5238dbc
commit adc615bc32
No known key found for this signature in database
GPG Key ID: 478539CAE680674E
3 changed files with 61 additions and 56 deletions

View File

@ -9,33 +9,35 @@
<h2>{% trans "Diagnostic Results" %}</h2> <h2>{% trans "Diagnostic Results" %}</h2>
<div class="d-flex align-items-center justify-content-between"> <section>
<h3>{% blocktrans %}App: {{ app_name }}{% endblocktrans %}</h3> <div class="d-flex align-items-center justify-content-between">
<h3>{% blocktrans %}App: {{ app_name }}{% endblocktrans %}</h3>
{% if show_repair %} {% if show_repair %}
<form class="form form-diagnostics-repair-button" method="post" <form class="form form-diagnostics-repair-button" method="post"
action="{% url 'diagnostics:repair' app_id=app_id %}"> action="{% url 'diagnostics:repair' app_id=app_id %}">
{% csrf_token %} {% csrf_token %}
<input type="submit" class="btn btn-default" <input type="submit" class="btn btn-default"
name="repair" value="{% trans "Try to repair" %}"/> name="repair" value="{% trans "Try to repair" %}"/>
</form> </form>
{% endif %} {% 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> </div>
{% else %}
<p>{% trans "This app does not support diagnostics" %}</p> {% if results %}
{% endif %} {% 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 %}
</section>
{% endblock %} {% endblock %}

View File

@ -33,38 +33,40 @@
{% if results %} {% if results %}
<h3>{% trans "Results" %}</h3> <h3>{% trans "Results" %}</h3>
{% for app_id, app_data in results.results.items %} {% for app_id, app_data in results.results.items %}
<div class="d-flex align-items-center justify-content-between"> <section>
<h4> <div class="d-flex align-items-center justify-content-between">
{% blocktrans trimmed with app_name=app_data.name %} <h4>
App: {{app_name}} {% blocktrans trimmed with app_name=app_data.name %}
{% endblocktrans %} App: {{app_name}}
</h4> {% endblocktrans %}
</h4>
{% if app_data.show_repair %} {% if app_data.show_repair %}
<form class="form form-diagnostics-repair-button" method="post" <form class="form form-diagnostics-repair-button" method="post"
action="{% url 'diagnostics:repair' app_id=app_id %}"> action="{% url 'diagnostics:repair' app_id=app_id %}">
{% csrf_token %} {% csrf_token %}
<input type="submit" class="btn btn-default" <input type="submit" class="btn btn-default"
name="repair" value="{% trans "Try to repair" %}"/> name="repair" value="{% trans "Try to repair" %}"/>
</form> </form>
{% endif %} {% endif %}
</div>
{% if app_data.diagnosis %}
{% include "diagnostics_results.html" with results=app_data.diagnosis %}
{% elif 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> </div>
{% else %}
<p><span class="fa fa-hourglass-o"></span></p> {% if app_data.diagnosis %}
{% endif %} {% include "diagnostics_results.html" with results=app_data.diagnosis %}
{% elif 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>
{% endif %}
</section>
{% endfor %} {% endfor %}
{% endif %} {% endif %}

View File

@ -73,6 +73,7 @@
/* /*
* Bootstrap override * Bootstrap override
*/ */
section:not(:first-child),
h1:not(:first-child), h1:not(:first-child),
h2:not(:first-child), h2:not(:first-child),
h3:not(:first-child), h3:not(:first-child),