FreedomBox/plinth/templates/clients.html
Sunil Mohan Adapa 83dcafac55
ui: Make all tables responsive
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
2020-12-19 11:26:34 +02:00

130 lines
4.9 KiB
HTML

{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
{% endcomment %}
{% load i18n %}
{% load plinth_extras %}
{% load static %}
{% if clients %}
<div id="clients" class="collapse table-responsive">
<table class="table">
{% with clients|clients_of_type:'web' as web_clients %}
{% for client in web_clients %}
<tr>
{% if forloop.counter == 1 %}
<th rowspan="{{ web_clients|length }}">{% trans "Web" %}</th>
{% endif %}
{% for platform in client.platforms %}
{% if platform.type == 'web' %}
<td>{{ client.name }}</td>
<td>
<a target="_blank" rel="noopener noreferrer"
class="btn btn-default" role="button"
{% if not enabled %} disabled="disabled"
{% else %} href="{{ platform.url }}"
{% endif %}>
{% trans "Launch" %}
<span class="fa fa-external-link"></span>
</a>
</td>
{% endif %}
{% endfor %}
</tr>
{% endfor %}
{% endwith %}
{% with clients|clients_of_type:'desktop' as desktop_clients %}
{% for client in desktop_clients %}
<tr>
{% if forloop.counter == 1 %}
<th rowspan="{{ desktop_clients|length }}">{% trans "Desktop" %}</th>
{% endif %}
<td>{{ client.name }}</td>
<td>
{% for platform in client.platforms %}
{% if platform.type == 'download' %}
<a class="btn btn-default" href="{{ platform.url }}" role="button">
<span>
{% with 'theme/icons/'|add:platform.os|add:'.png' as icon %}
<img class="client-icon" src="{% static icon %}" />
{% if platform.os == 'gnu-linux' %}
{% trans 'GNU/Linux' %}
{% elif platform.os == 'windows' %}
{% trans 'Windows' %}
{% elif platform.os == 'macos' %}
{% trans 'macOS' %}
{% endif %}
{% endwith %}
</span>
</a>
{% endif %}
{% endfor %}
</td>
</tr>
{% endfor %}
{% endwith %}
{% with clients|clients_of_type:'mobile' as mobile_clients %}
{% for client in mobile_clients %}
<tr>
{% if forloop.counter == 1 %}
<th rowspan="{{ mobile_clients|length }}">{% trans "Mobile" %}</th>
{% endif %}
<td>{{ client.name }}</td>
<td>
{% for platform in client.platforms %}
{% if platform.type == 'store' and platform.os == 'android' or platform.os == 'ios' %}
<a class="btn btn-default" href="{{ platform.url }}" role="button">
<span>
{% with 'theme/icons/'|add:platform.store_name|add:'.png' as icon %}
<img class="client-icon" src="{% static icon %}" />
{% if platform.store_name == 'google-play' %}
{% trans 'Play Store' %}
{% elif platform.store_name == 'f-droid' %}
{% trans 'F-Droid' %}
{% elif platform.store_name == 'app-store' %}
{% trans 'App Store' %}
{% endif %}
{% endwith %}
</span>
</a>
{% endif %}
{% endfor %}
</td>
</tr>
{% endfor %}
{% endwith %}
{% with clients|clients_of_type:'package' as package_clients %}
{% for client in package_clients %}
<tr>
{% if forloop.counter == 1 %}
<th rowspan="{{ package_clients|length }}">{% trans "Package" %}</th>
{% endif %}
<td>{{ client.name }}</td>
<td>
{% for platform in client.platforms %}
{% if platform.type == 'package' %}
{% if platform.format == 'deb' %}
<div><strong>{% trans "Debian:" %}</strong> {{ platform.name }}</div>
{% endif %}
{% if platform.format == 'brew' %}
<div><strong>{% trans "Homebrew:" %}</strong> {{ platform.name }}</div>
{% endif %}
{% if platform.format == 'rpm' %}
<p><strong>{% trans "RPM:" %}</strong> {{ platform.name }}</p>
{% endif %}
{% endif %}
{% endfor %}
</td>
</tr>
{% endfor %}
{% endwith %}
</table>
</div>
{% endif %}