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

90 lines
2.8 KiB
HTML

{% extends "base.html" %}
{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
{% endcomment %}
{% load bootstrap %}
{% load i18n %}
{% load static %}
{% block content %}
{% include "app-header.html" with setup=True %}
{% include "toolbar.html" %}
{% if setup_state.value == 'up-to-date' %}
<div class="app-just-installed">
{% trans "Application installed." %}
</div>
{% elif not operations %}
<p>
{% if setup_state.value == 'needs-setup' %}
{% blocktrans trimmed %}
Install this application?
{% endblocktrans %}
{% elif setup_state.value == 'needs-update' %}
{% blocktrans trimmed %}
This application needs an update. Update now?
{% endblocktrans %}
{% endif %}
</p>
<form class="form-install" action="" method="post">
{% csrf_token %}
{% if has_unavailable_packages %}
<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 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 %}
<input type="submit" class="btn btn-md btn-primary" name="install"
{% if has_unavailable_packages %}
disabled="disabled"
{% endif %}
{% if setup_state.value == 'needs-setup' %}
value="{% trans "Install" %}"
{% elif setup_state.value == 'needs-update' %}
value="{% trans "Update" %}"
{% endif %} />
</form>
{% else %}
{% include "operations.html" %}
{% endif %}
{% endblock %}