{% extends "base.html" %}
{% block head %}
  {{ super() }}
  
  <link
      rel="stylesheet"
      href="/assets/extensions/choices.js/public/assets/styles/choices.css"
    />
{% endblock %}
{% block content %}
<section class="user">
  <div class="row">
    <div class="col">
      <div class="card">
        <div class="card-body">
          <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
              <li class="breadcrumb-item"><a href="/members">Leden</a></li>
              <li class="breadcrumb-item active" aria-current="page">
                {{ member.get_name() }}
              </li>
            </ol>
          </nav>
        </div>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col">
        <div class="card ">
          <div class="card-content">
            <div class="card-body">
              <div class="row">
                <div class="col-3">
                  <div class="">
                    <img src="{{ member.get_gravatar() }}" alt="Avatar" style="width: 100%;" />
                  </div>
                </div>
                <div class="col">
                  <form id="user-form" class="form">
                    <h6>Naam</h6>
                    <h4 class="card-title" id="member-name">{{ member.get_name() }}</h4>
                    <hr>
                    <p class="card-text">
                      <h6>E-mailadres</h6>
                      <span id="user-email">{{ member.get_email() }}</span>

                    </p>
                  </form>
                  
                </div>
              </div>
            </div>
          </div>
          <div class="card-footer d-flex justify-content-between">
            
          </div>
        </div>
    </div>
</section>

<script src="/assets/extensions/choices.js/public/assets/scripts/choices.js"></script>
<script src="/assets/static/js/pages/form-element-select.js"></script>




  
{% endblock %}