contact-details.html

{{ with .Params.contact_details }}
  {{ if or .website .linkedin .twitter .email .phone }}
    <div class="contacts-details contacts-details--person">
      {{ if or .website .linkedin .twitter .email .phone }}
        <ul>
          {{ with .website }}
            <li>
              <span>{{ i18n "commons.contact.website" }}</span>
              <a href="{{ chomp .value }}" target="_blank" rel="noopener" itemprop="url">{{ chomp .label }}</a>
            </li>
          {{ end }}

          {{ with .linkedin }}
            <li>
              <span>LinkedIn</span>
              <a href="{{ chomp .value }}" target="_blank" rel="noopener" itemprop="url">{{ chomp .label }}</a>
            </li>
          {{ end }}

          {{ with .mastodon }}
            <li>
              <span>Mastodon</span>
              <a href="{{ chomp .value }}" target="_blank" rel="noopener" itemprop="url">{{ chomp .label }}</a>
            </li>
          {{ end }}

          {{ with .twitter }}
            <li>
              <span>Twitter</span>
              <a href="{{ chomp .value }}" target="_blank" rel="noopener" itemprop="url">{{ chomp .label }}</a>
            </li>
          {{ end }}

          {{ with .email }}
            <li>
              <span>{{ i18n "commons.contact.email" }}</span>
              <a href="{{ chomp .value }}" itemprop="email">{{ chomp .label }}</a>
            </li>
          {{ end }}

          {{ with .phone }}
            <li>
              <span>{{ i18n "commons.contact.phone" }}</span>
              <a href="{{ .value }}" itemprop="telephone">{{ .label }}</a>
            </li>
          {{ end }}
        </ul>
      {{ end }}
    </div>
  {{ end }}
{{ end }}