From 1b40e935a10b43d36d0e1f49d0bcb3c132e69a83 Mon Sep 17 00:00:00 2001
From: Joshua Laymon <joshlaymon@icloud.com>
Date: Wed, 13 Aug 2025 20:34:38 +0000
Subject: [PATCH] Update web/templates/entry_edit.html

first attempt at making this thing look pretty
---
 web/templates/entry_edit.html | 129 ++++++++++++++++++++++++++--------
 1 file changed, 98 insertions(+), 31 deletions(-)

diff --git a/web/templates/entry_edit.html b/web/templates/entry_edit.html
index c869b0e..0924b35 100644
--- a/web/templates/entry_edit.html
+++ b/web/templates/entry_edit.html
@@ -1,34 +1,101 @@
 {% extends "base.html" %}
-{% block title %}Edit Entry - Illustrations DB{% endblock %}
+{% block body_class %}themed-bg{% endblock %}
+{% load static %}
+
 {% block content %}
-  <div class="toolbar">
-    <div class="small">Editing: Record {{ position }} of {{ count }}</div>
-    <div><a class="btn" href="/entry/{{ entry.id }}/">Cancel</a></div>
-  </div>
-  <form method="post">{% csrf_token %}
-    <div class="panel">
-      <h2 style="margin-top:0;">Edit Entry</h2>
-      <div class="row">
-        <div><label>Talk Title</label>{{ form.talk_title }}</div>
-        <div><label>Talk Number</label>{{ form.talk_number }}</div>
-      </div>
-      <div class="row">
-        <div><label>Source</label>{{ form.source }}</div>
-        <div><label>Code</label>{{ form.entry_code }}</div>
-      </div>
-      <label>Subject</label>{{ form.subject }}
-      <label>Illustration</label>{{ form.illustration }}
-      <label>Application</label>{{ form.application }}
-      <div class="row">
-        <div><label>Scripture</label>{{ form.scripture_raw }}</div>
-        <div>
-          <label>Date Added</label>{{ form.date_added }}
-          <label>Date Edited</label>{{ form.date_edited }}
-        </div>
-      </div>
-      <div style="margin-top:16px; display:flex; gap:10px; justify-content:flex-end;">
-        <button class="btn primary" type="submit">Save Changes</button>
-      </div>
+<div class="page">
+
+  <!-- Toolbar -->
+  <div class="result-toolbar">
+    <div class="rt-left">
+      <a class="btn btn-secondary" href="{% url 'entry_view' entry.id %}">← Back to Entry</a>
+      <span class="rt-count">Editing: #{{ entry.id }}</span>
     </div>
-  </form>
-{% endblock %}
+    <div class="rt-right">
+      <a class="btn" href="{% url 'entry_view' entry.id %}">Cancel</a>
+      <button form="edit-form" class="btn btn-primary btn-lg">Save</button>
+    </div>
+  </div>
+
+  <!-- Form Card -->
+  <div class="card form-card">
+    <form id="edit-form" method="post" novalidate>
+      {% csrf_token %}
+
+      <div class="form-grid">
+
+        <!-- Subject -->
+        <div class="field span-2">
+          <label for="id_subject" class="label">Subject</label>
+          <textarea id="id_subject" name="subject" class="input textarea tall-2" placeholder="Comma-separated subjects…">{{ entry.subject }}</textarea>
+          <div class="hint">Examples: <code>Love</code>, <code>Faith</code>, <code>Family</code> (comma-separated tags work nicely)</div>
+        </div>
+
+        <!-- Illustration -->
+        <div class="field span-2">
+          <label for="id_illustration" class="label">Illustration</label>
+          <textarea id="id_illustration" name="illustration" class="input textarea tall-3" placeholder="The story / example…">{{ entry.illustration }}</textarea>
+        </div>
+
+        <!-- Application -->
+        <div class="field span-2">
+          <label for="id_application" class="label">Application</label>
+          <textarea id="id_application" name="application" class="input textarea tall-3" placeholder="How to use it in a talk…">{{ entry.application }}</textarea>
+        </div>
+
+        <!-- Scripture -->
+        <div class="field span-2">
+          <label for="id_scripture_raw" class="label">Scripture</label>
+          <textarea id="id_scripture_raw" name="scripture_raw" class="input textarea" placeholder="e.g., John 13:34,35; Romans 14:4">{{ entry.scripture_raw }}</textarea>
+          <div class="hint">Separate multiple references with semicolons <code>;</code>. These will show as clickable chips.</div>
+        </div>
+
+        <!-- Source -->
+        <div class="field">
+          <label for="id_source" class="label">Source</label>
+          <input id="id_source" name="source" type="text" class="input" value="{{ entry.source|default_if_none:'' }}" placeholder="Publisher / speaker / book…">
+        </div>
+
+        <!-- Talk Title -->
+        <div class="field">
+          <label for="id_talk_title" class="label">Talk Title</label>
+          <input id="id_talk_title" name="talk_title" type="text" class="input" value="{{ entry.talk_title|default_if_none:'' }}" placeholder="Title if any…">
+        </div>
+
+        <!-- Talk Number -->
+        <div class="field">
+          <label for="id_talk_number" class="label">Talk Number</label>
+          <input id="id_talk_number" name="talk_number" type="number" class="input" value="{{ entry.talk_number|default_if_none:'' }}" placeholder="e.g., 72">
+        </div>
+
+        <!-- Code -->
+        <div class="field">
+          <label for="id_entry_code" class="label">Entry Code</label>
+          <input id="id_entry_code" name="entry_code" type="text" class="input" value="{{ entry.entry_code|default_if_none:'' }}" placeholder="Your internal code…">
+        </div>
+
+        <!-- Dates -->
+        <div class="field">
+          <label for="id_date_added" class="label">Date Added</label>
+          <input id="id_date_added" name="date_added" type="date" class="input"
+                 value="{{ entry.date_added|date:'Y-m-d' }}">
+        </div>
+
+        <div class="field">
+          <label for="id_date_edited" class="label">Date Edited</label>
+          <input id="id_date_edited" name="date_edited" type="date" class="input"
+                 value="{{ entry.date_edited|date:'Y-m-d' }}">
+        </div>
+
+      </div>
+
+      <!-- Actions (mobile friendly duplicate at bottom) -->
+      <div class="form-actions">
+        <a class="btn" href="{% url 'entry_view' entry.id %}">Cancel</a>
+        <button class="btn btn-primary">Save</button>
+      </div>
+    </form>
+  </div>
+
+</div>
+{% endblock %}
\ No newline at end of file