R1 foundation - Phase 1 live build

templates/contact_detail.html

@@ -0,0 +1,25 @@
+{% extends "base.html" %}
+{% block content %}
+<div class="breadcrumb"><a href="/contacts">Contacts</a><span class="sep">/</span><span>{{ item.first_name }} {{ item.last_name or '' }}</span></div>
+<div class="detail-header">
+    <div class="flex items-center justify-between">
+        <h1 class="detail-title">{{ item.first_name }} {{ item.last_name or '' }}</h1>
+        <div class="flex gap-2">
+            <a href="/contacts/{{ item.id }}/edit" class="btn btn-secondary btn-sm">Edit</a>
+            <form action="/contacts/{{ item.id }}/delete" method="post" data-confirm="Delete?" style="display:inline"><button class="btn btn-danger btn-sm">Delete</button></form>
+        </div>
+    </div>
+    <div class="detail-meta mt-2">
+        {% if item.company %}<span class="row-tag">{{ item.company }}</span>{% endif %}
+        {% if item.role %}<span class="detail-meta-item">{{ item.role }}</span>{% endif %}
+    </div>
+</div>
+<div class="card">
+    <div class="form-grid" style="gap:12px">
+        {% if item.email %}<div class="form-group"><div class="form-label">Email</div><a href="mailto:{{ item.email }}">{{ item.email }}</a></div>{% endif %}
+        {% if item.phone %}<div class="form-group"><div class="form-label">Phone</div><a href="tel:{{ item.phone }}">{{ item.phone }}</a></div>{% endif %}
+        {% if item.notes %}<div class="form-group full-width"><div class="form-label">Notes</div><div class="detail-body" style="white-space:pre-wrap">{{ item.notes }}</div></div>{% endif %}
+        {% if item.tags %}<div class="form-group full-width"><div class="form-label">Tags</div><div class="flex gap-2">{% for tag in item.tags %}<span class="row-tag">{{ tag }}</span>{% endfor %}</div></div>{% endif %}
+    </div>
+</div>
+{% endblock %}