website-v2/templates/users/profile.html

{% extends "users/profile_base.html" %}

{% load static %}

{% block content %}
  <div class="py-0 px-3 mb-3 md:flex md:py-6 md:px-0">

    <div class="hidden w-full md:block md:w-1/4">
      <ul class="py-8 space-y-4">
        <li><a href="#stats" class="text-orange">Stats</a></li>
        <li><a href="#badges">Badges</a></li>
        <li><a href="#libraries-authored">Libraries Authored</a></li>
        <li><a href="#libraries-maintained">Libraries Maintained</a></li>
      </ul>
    </div>

    <div class="w-full md:w-3/4">
      <div class="py-6 border-b border-slate">
        <h3 id="stats">Stats</h3>

        <div class="grid grid-cols-1 gap-8 my-4 md:grid-cols-3">
          <div>
            <h5>Number of Posts</h5>
            5,043
          </div>
          <div>
            <h5>Number of Replies</h5>
            12,340
          </div>
          <div>
            <h5>Number of Reviews</h5>
            236
          </div>
        </div>
      </div>

      <div class="py-6 border-b border-slate">
        <h3 id="badges">Badges</h3>

        <div class="grid grid-cols-1 gap-8 my-4 md:grid-cols-3">
          <div>
            <h4>Author</h4>
            <p>
              Ut vehicula fermentum mi, a bibendum nunc sagittis ac.
            </p>
            <div class="text-gold">
              <svg class="inline-block mr-2 fill-gold" width="33" height="25" viewBox="0 0 33 25" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M17.875 19.1647V22H24.75V24.75H8.25V22H15.125V19.1647C12.4667 18.8295 10.0221 17.5357 8.25 15.5262C6.47788 13.5166 5.50005 10.9293 5.5 8.25V0H27.5V8.25C27.5 10.9293 26.5221 13.5166 24.75 15.5262C22.9779 17.5357 20.5333 18.8295 17.875 19.1647Z"/>
                <rect width="2.75" height="6.875"/>
                <rect x="30.25" width="2.75" height="6.875"/>
              </svg>
              Gold
            </div>
          </div>

          <div>
            <h4>Author</h4>
            <p>
              Ut vehicula fermentum mi, a bibendum nunc sagittis ac.
            </p>
            <div class="text-bronze">
              <svg class="inline-block mr-2 fill-bronze" width="33" height="25" viewBox="0 0 33 25" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M17.875 19.1647V22H24.75V24.75H8.25V22H15.125V19.1647C12.4667 18.8295 10.0221 17.5357 8.25 15.5262C6.47788 13.5166 5.50005 10.9293 5.5 8.25V0H27.5V8.25C27.5 10.9293 26.5221 13.5166 24.75 15.5262C22.9779 17.5357 20.5333 18.8295 17.875 19.1647Z"/>
                <rect width="2.75" height="6.875"/>
                <rect x="30.25" width="2.75" height="6.875"/>
              </svg>
              Bronze
            </div>
          </div>

          <div>
            <h4>Author</h4>
            <p>
              Ut vehicula fermentum mi, a bibendum nunc sagittis ac.
            </p>
            <div class="text-silver">
              <svg class="inline-block mr-2 fill-silver" width="33" height="25" viewBox="0 0 33 25" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M17.875 19.1647V22H24.75V24.75H8.25V22H15.125V19.1647C12.4667 18.8295 10.0221 17.5357 8.25 15.5262C6.47788 13.5166 5.50005 10.9293 5.5 8.25V0H27.5V8.25C27.5 10.9293 26.5221 13.5166 24.75 15.5262C22.9779 17.5357 20.5333 18.8295 17.875 19.1647Z"/>
                <rect width="2.75" height="6.875"/>
                <rect x="30.25" width="2.75" height="6.875"/>
              </svg>
              Silver
            </div>
          </div>

          <div>
            <h4>Author</h4>
            <p>
              Ut vehicula fermentum mi, a bibendum nunc sagittis ac.
            </p>
            <div class="text-gold">
              <svg class="inline-block mr-2 fill-gold" width="33" height="25" viewBox="0 0 33 25" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M17.875 19.1647V22H24.75V24.75H8.25V22H15.125V19.1647C12.4667 18.8295 10.0221 17.5357 8.25 15.5262C6.47788 13.5166 5.50005 10.9293 5.5 8.25V0H27.5V8.25C27.5 10.9293 26.5221 13.5166 24.75 15.5262C22.9779 17.5357 20.5333 18.8295 17.875 19.1647Z"/>
                <rect width="2.75" height="6.875"/>
                <rect x="30.25" width="2.75" height="6.875"/>
              </svg>
              Gold
            </div>
          </div>
        </div>
      </div>

      <div class="py-6 border-b border-slate">
        <h3 id="libraries-authored" class="mb-3">Libraries Authored</h3>

        {% for library in authored %}
          {% include 'users/_library.html' with library=library %}
        {% empty %}
          <p>No Libraries Authored</p>
        {% endfor %}
      </div>

      <div class="py-6 border-b border-slate">
        <h3 id="libraries-maintained" class="mb-3">Libraries Maintained</h3>

        {% for library_version in maintained %}
          {% include 'users/_library_version.html' with library_version=library_version %}
        {% empty %}
          <p>No Libraries Authored</p>
        {% endfor %}
      </div>
    </div>
  </div>
{% endblock %}