Files
lifeos-dev/templates/contact_detail.html
Michael fbdf986fa8 feat: create new links directly from contact pages
Contact detail: + New Link button redirects to link form with contact context.
Contact create/edit form: inline new link rows (label/url/role) created on submit.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-06 14:44:54 +00:00

74 lines
4.0 KiB
HTML

{% 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>
<!-- Links -->
<div class="card mt-4">
<div class="card-header">
<h2 class="card-title">Links</h2>
</div>
<form action="/contacts/{{ item.id }}/links/add" method="post" class="flex gap-2 items-end" style="padding: 12px; border-bottom: 1px solid var(--border);">
<div class="form-group" style="flex:2; margin:0;">
<label class="form-label">Link</label>
<select name="link_id" class="form-select" required>
<option value="">Select link...</option>
{% for l in all_links %}
<option value="{{ l.id }}">{{ l.label }} — {{ l.url[:40] }}{% if l.url|length > 40 %}...{% endif %}</option>
{% endfor %}
</select>
</div>
<div class="form-group" style="flex:1; margin:0;">
<label class="form-label">Role</label>
<input type="text" name="role" class="form-input" list="link-roles" placeholder="e.g. website, portfolio...">
<datalist id="link-roles">
<option value="website">
<option value="portfolio">
<option value="social">
<option value="documentation">
<option value="reference">
<option value="profile">
<option value="repository">
</datalist>
</div>
<button type="submit" class="btn btn-primary btn-sm">Add</button>
<a href="/links/create?contact_id={{ item.id }}" class="btn btn-ghost btn-sm">+ New Link</a>
</form>
{% for l in links %}
<div class="list-row">
<span class="row-title"><a href="{{ l.url }}" target="_blank">{{ l.label }}</a></span>
<span class="row-meta">{{ l.url[:50] }}{% if l.url|length > 50 %}...{% endif %}</span>
{% if l.role %}<span class="row-tag">{{ l.role }}</span>{% endif %}
<div class="row-actions">
<a href="/links/{{ l.id }}/edit" class="btn btn-ghost btn-xs">Edit</a>
<form action="/contacts/{{ item.id }}/links/{{ l.id }}/remove" method="post" style="display:inline">
<button class="btn btn-ghost btn-xs">Unlink</button>
</form>
</div>
</div>
{% else %}
<div class="text-sm text-muted" style="padding: 12px;">No links</div>
{% endfor %}
</div>
{% endblock %}