v0.2 planning and ux improvements

nouri/templates/planner/day.html

@@ -0,0 +1,104 @@
+{% extends "base.html" %}
+{% block title %}Tagesplan | Nouri{% endblock %}
+{% block content %}
+<section class="page-intro">
+    <div>
+        <p class="eyebrow">Tagesplan</p>
+        <h1>{{ weekday_name(selected_date) }}, {{ selected_date.strftime('%d.%m.%Y') }}</h1>
+        <p class="lead">Der Tagesplan bleibt bewusst ruhig. Jede Tageszeit ist eine eigene Kachel und öffnet sich erst, wenn du sie brauchst.</p>
+    </div>
+    <div class="week-nav">
+        <a class="ghost-button" href="{{ url_for('main.planner_day', date=previous_day.isoformat()) }}">Vorheriger Tag</a>
+        <a class="ghost-button" href="{{ url_for('main.planner') }}">Zur Woche</a>
+        <a class="ghost-button" href="{{ url_for('main.planner_day', date=next_day.isoformat()) }}">Nächster Tag</a>
+    </div>
+</section>
+
+<section class="planner-day-stack">
+    {% for section in sections %}
+        <details class="day-tile" id="daypart-{{ section.daypart.id }}" {% if section.is_open %}open{% endif %}>
+            <summary class="day-tile-summary">
+                <div class="day-tile-summary-main">
+                    <div class="day-tile-icon"><span class="ui-icon icon-calendar"></span></div>
+                    <div>
+                        <h2>{{ section.daypart.name }}</h2>
+                        {% if section.summary_items %}
+                            <p class="muted">{{ section.summary_items|join(', ') }}</p>
+                        {% else %}
+                            <p class="muted">Noch frei. Öffnen, wenn du etwas ergänzen möchtest.</p>
+                        {% endif %}
+                    </div>
+                </div>
+                <span class="status-pill">{{ section.entries|length }} geplant</span>
+            </summary>
+
+            <div class="day-tile-body">
+                {% if section.quick_items %}
+                    <div class="quick-add-row">
+                        {% for item in section.quick_items %}
+                            <form method="post" action="{{ url_for('main.planner_day', date=selected_date.isoformat()) }}">
+                                {{ csrf_input() }}
+                                <input type="hidden" name="plan_date" value="{{ selected_date.isoformat() }}">
+                                <input type="hidden" name="daypart_id" value="{{ section.daypart.id }}">
+                                <input type="hidden" name="item_id" value="{{ item.id }}">
+                                <button class="quick-add-button" type="submit">
+                                    <span>{{ item.name }}</span>
+                                    <small>{{ item_kind_labels[item.kind] }}{% if item.availability_state == 'home' %} · zuhause{% endif %}</small>
+                                </button>
+                            </form>
+                        {% endfor %}
+                    </div>
+                {% endif %}
+
+                <form method="post" class="planner-entry-form">
+                    {{ csrf_input() }}
+                    <input type="hidden" name="plan_date" value="{{ selected_date.isoformat() }}">
+                    <input type="hidden" name="daypart_id" value="{{ section.daypart.id }}">
+                    <label class="wide">
+                        Eintrag hinzufügen
+                        <select name="item_id">
+                            <option value="">Etwas für {{ section.daypart.name }} wählen</option>
+                            {% for item in section.candidates %}
+                                <option value="{{ item.id }}" {% if section.selected_item_id == item.id %}selected{% endif %}>
+                                    {{ item.name }} · {{ item_kind_labels[item.kind] }}{% if item.availability_state == 'home' %} · zuhause{% endif %}{% if item.dayparts and section.daypart.name not in item.dayparts %} · auch flexibel{% endif %}
+                                </option>
+                            {% endfor %}
+                        </select>
+                    </label>
+                    <label class="wide">
+                        Notiz
+                        <input type="text" name="note" placeholder="Optional, wenn eine kleine Erinnerung hilft">
+                    </label>
+                    <button type="submit">Eintragen</button>
+                </form>
+
+                {% if section.entries %}
+                    <div class="planner-entry-list">
+                        {% for entry in section.entries %}
+                            <article class="planner-entry">
+                                <div class="planner-entry-top">
+                                    <div>
+                                        <strong>{{ entry.item_name }}</strong>
+                                        <small>{{ item_kind_labels[entry.item_kind] }}{% if entry.availability_state == 'home' %} · zuhause{% else %} · bei Bedarf auf Einkaufsliste{% endif %}</small>
+                                    </div>
+                                    <div class="row-actions">
+                                        <form method="post" action="{{ url_for('main.planner_remove', entry_id=entry.id, date=selected_date.isoformat()) }}">
+                                            {{ csrf_input() }}
+                                            <button class="ghost-button" type="submit">Entfernen</button>
+                                        </form>
+                                    </div>
+                                </div>
+                                {% if entry.note %}
+                                    <p>{{ entry.note }}</p>
+                                {% endif %}
+                            </article>
+                        {% endfor %}
+                    </div>
+                {% else %}
+                    <p class="empty-state">Hier ist noch nichts eingetragen. Ein kleiner Anfang reicht völlig.</p>
+                {% endif %}
+            </div>
+        </details>
+    {% endfor %}
+</section>
+{% endblock %}