← back to Stars of Design

views/public/dwclient.ejs

81 lines

<%- include('../partials/head', { title: title, meta_desc_override: typeof meta_desc_override !== 'undefined' ? meta_desc_override : undefined }) %>
<%- include('../partials/header') %>

<main class="designer">
  <article class="profile wrap">

    <header class="profile-head">
      <div class="profile-photo">
        <img src="<%= profile.headshot %>" alt="<%= profile.full_name %>" loading="lazy" decoding="async" style="width:200px;height:200px;border-radius:50%;object-fit:cover;border:1px solid var(--line,#2a2620)">
      </div>
      <div class="profile-meta">
        <h1>
          <%= profile.full_name %>
          <% if (profile.claimed) { %><span class="chip gold" style="font-size:11px;letter-spacing:0.12em;margin-left:8px">VERIFIED</span><% } %>
        </h1>

        <% if (profile.role) { %>
          <p class="lede">
            <%= profile.role %><% if (profile.firm) { %> · <%= profile.firm.name %><% } %>
          </p>
        <% } %>

        <% if (profile.city || profile.state) { %>
          <p class="muted"><%= [profile.city, profile.state].filter(Boolean).join(', ') %></p>
        <% } %>

        <% if (profile.areas && profile.areas.length) { %>
          <h3 style="font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-faint,#7a706a);margin:24px 0 8px">Areas served</h3>
          <ul class="tags">
            <% profile.areas.forEach(function(a) { %><li><%= a %></li><% }); %>
          </ul>
        <% } %>

        <% var hasLinks = profile.links && (profile.links.linkedin || profile.links['firm-site'] || profile.links.instagram); %>
        <% if (hasLinks) { %>
          <h3 style="font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-faint,#7a706a);margin:24px 0 8px">Links</h3>
          <ul class="link-list" style="list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:12px">
            <% (profile.links['firm-site'] || []).slice(0,2).forEach(function(u) { %>
              <li><a href="<%= u %>" rel="nofollow noopener noreferrer" target="_blank">Website ↗</a></li>
            <% }); %>
            <% (profile.links.linkedin || []).slice(0,2).forEach(function(u) { %>
              <li><a href="<%= u %>" rel="nofollow noopener noreferrer" target="_blank">LinkedIn ↗</a></li>
            <% }); %>
            <% (profile.links.instagram || []).slice(0,2).forEach(function(u) { %>
              <li><a href="<%= u %>" rel="nofollow noopener noreferrer" target="_blank">Instagram ↗</a></li>
            <% }); %>
          </ul>
        <% } %>

        <% if (!profile.claimed) { %>
          <p style="margin-top:32px">
            <a href="/submit" class="btn primary">Claim this profile →</a>
          </p>
        <% } %>
      </div>
    </header>

    <% if (profile.firm) { %>
      <section style="margin-top:48px">
        <h2 class="muted" style="font-size:11px;letter-spacing:0.18em;text-transform:uppercase">Firm</h2>
        <p>
          <strong><%= profile.firm.name %></strong>
          <% if (profile.firm.founded_year) { %> · est. <%= profile.firm.founded_year %><% } %>
          <% if (profile.firm.size_band) { %> · <%= profile.firm.size_band %> people<% } %>
        </p>
      </section>
    <% } %>

    <% if (profile.bio) { %>
      <section style="margin-top:32px">
        <h2 class="muted" style="font-size:11px;letter-spacing:0.18em;text-transform:uppercase">Bio</h2>
        <p class="prose"><%= profile.bio %></p>
      </section>
    <% } %>

    <p style="margin-top:64px"><a href="/clients" class="muted">← Back to all DW clients</a></p>
  </article>
</main>

<%- include('../partials/footer') %>