{% extends "base.html.j2" %}
{% import "materialize/wtf.html.j2" as wtf %}

{% block page_content %}
    <div class="container">
        <div class="row">
          <div class="col s12">
            <div class="card">
              <div class="card-content">
                <div class="row">
                  <div class="col s1"></div>
                  <div class="col s3">
                    {% if about_me %}
                    <img src="{{ user_image }}" alt="user-image" class="circle responsive-img" style="margin-top:50px;">
                    {% else %}
                    <img src="{{ user_image }}" alt="user-image" class="circle responsive-img">
                    {% endif %}
                  </div>
                  <div class="col s1"></div>
                  <div class="col s7">
                    <h3>{{ user_name }}</h3>
                    <div class="chip">Last seen: {{ last_seen }}</div>
                    {% if location %}
                    <p><span class="material-icons" style="margin-right:20px; margin-top:20px;">location_on</span><i>{{ location }}</i></p>
                    {% endif %}
                    <p></p>
                    <br>
                    {% if about_me%}
                    <div class="card">
                      <div class="card-content">
                        <span class="card-title">About me</span>
                        <p>{{ about_me }}</p>
                      </div>
                    </div>
                    {% endif %}
                  </div>
                </div>
                <div class="row">
                  <div class="col s1"></div>
                  <div class="col s6">
                    <table>
                      {% if full_name %}
                      <tr>
                        <td><span class="material-icons">person</span></td>
                        <td>{{ full_name }} </td>
                      </tr>
                      {% endif %}
                      {% if email %}
                      <tr>
                        <td><span class="material-icons">email</span></td>
                        <td>{{ email }}</td>
                      </tr>
                      {% endif %}
                      {% if website %}
                      <tr>
                        <td><span class="material-icons">laptop</span></td>
                        <td><a href="{{ website }}">{{ website }}</a></td>
                      </tr>
                      {% endif %}
                      {% if organization %}
                      <tr>
                        <td><span class="material-icons">business</span></td>
                        <td>{{ organization }}</td>
                      </tr>
                      {% endif %}
                    </table>
                    <br>
                    <p><i>Member since: {{ member_since }}</i></p>
                    <p></p>
                    <br>
                    <a class="waves-effect waves-light btn-small" href="{{ url_for('settings.settings') }}">Edit profile</a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col s6">
          
          </div>

        </div>
    </div>
{% endblock page_content %}