kundenplattform/templates/auftragskatalog.html
Thomas Stallinger c35145ef8e feat: Pico.css für Dark/Light-Mode und Responsivität
Klassenloses CSS-Framework (self-hosted unter static/, kein CDN), passt
zum bestehenden Ansatz ohne JS-Build-Schritt. Bringt automatisches
Dark/Light-Mode (prefers-color-scheme) und Responsivität ohne
Zusatzaufwand. Templates auf Picos semantische Konventionen umgestellt
(label/input-Paare, article für die Login-Karte, figure um Tabellen für
horizontales Scrollen). Eigene CSS-Regeln auf die zwei Farb-Utility-
Klassen (state-present/state-absent) reduziert, Rest kommt von Pico.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-08-05 08:16:43 +02:00

55 lines
2.4 KiB
HTML

{% extends "base.html" %}
{% block title %}Auftragskatalog {{ device.hostname or device.device_fingerprint }} — Tuxflotte{% endblock %}
{% block content %}
<p><a href="/geraete">← Geräteliste</a></p>
<h2>Auftragskatalog: {{ device.hostname or device.device_fingerprint }}</h2>
{% if fehler %}
<p><mark>{{ fehler }}</mark></p>
{% else %}
{% for kategorie_name, eintraege in kategorien.items() %}
<section>
<h3>{{ kategorie_name }}</h3>
<figure>
<table>
<tbody>
{% for eintrag in eintraege %}
<tr>
<td>
<strong>{{ eintrag.name }}</strong>
{% if eintrag.description %}<br><small>{{ eintrag.description }}</small>{% endif %}
</td>
<td class="state-{{ eintrag.state }}">
{{ "ausgewählt" if eintrag.state == "present" else "nicht ausgewählt" }}
</td>
<td>
{% if eintrag.state == "present" %}
<form method="post" action="/geraete/{{ device.id }}/auftragskatalog/{{ eintrag.merkmal }}/deselect">
<button type="submit" class="secondary outline">Abwählen</button>
</form>
{% else %}
<form method="post" action="/geraete/{{ device.id }}/auftragskatalog/{{ eintrag.merkmal }}/select">
{% if optionen_felder.get(eintrag.merkmal) %}
<div class="optionen">
{% for feld in optionen_felder[eintrag.merkmal] %}
<label>
<input type="checkbox" name="optionen.{{ feld.key }}">
{{ feld.label }}
</label>
{% endfor %}
</div>
{% endif %}
<button type="submit">Auswählen</button>
</form>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</figure>
</section>
{% endfor %}
{% endif %}
{% endblock %}