`public/panels/profiles.html`

28 lines
<div id="prof-banner"></div>

<div class="grid" style="grid-template-columns:minmax(280px,340px) 1fr;align-items:start">

  <!-- Left: search + recent list -->
  <div class="card" id="prof-list-card">
    <h2>Find a contact</h2>
    <div class="muted" style="font-size:12px">Search email, name, company, role or tag.</div>
    <div style="margin-top:12px">
      <input id="prof-q" placeholder="e.g. atelier-noir, grasscloth, principal" autocomplete="off">
    </div>
    <div class="row" style="margin-top:8px;justify-content:space-between;align-items:center">
      <span class="muted" id="prof-list-meta" style="font-size:12px">—</span>
      <button class="btn ghost" id="prof-list-refresh" style="padding:5px 11px;font-size:12px">Refresh</button>
    </div>
    <div id="prof-list" class="loading" style="margin-top:12px">Loading contacts…</div>
  </div>

  <!-- Right: 360 profile card -->
  <div class="card" id="prof-detail-card">
    <div id="prof-detail-empty" class="muted" style="padding:30px 0;text-align:center">
      Pick a contact on the left to see their 360° profile.
    </div>
    <div id="prof-detail" style="display:none"></div>
  </div>

</div>