User table UI

templates/user/users-table.html

@@ -1,6 +1,7 @@
 {% extends "user/base-users-table.html" %}
 
 {% block after_rank_head %}
+    <th></th>
     <th class="header rank">
         {% if sort_links %}<a href="{{ sort_links.rating }}">{% endif %}
         <span class="rate-group">
@@ -10,19 +11,16 @@
             </svg>
         </span>
         {%- if sort_links %}{{ sort_order.rating }}</a>{% endif %}
-        <th class="fullname-column">{{ _('Full Name') }}</th>
     </th>
 {% endblock %}
 
 {% block after_rank %}
-    <td>{% if user.rating %}{{ rating_number(user) }}{% endif %}</td>
-    <td class="fullname-column"> 
-        {% if user.user.first_name %}
-            <span class="fullname">
-                {{ user.user.first_name }}
-            </span>
-        {% endif %}
-    </td>
+    <td><img style="max-width: none; border-radius: 50%" src="{{ gravatar(user, 45) }}" height="45px" width="45px"></td>
+    <td class="rating-td">{% if user.rating %}{{ rating_number(user) }}{% endif %}</td>
+{% endblock %}
+
+{% block user_data %}
+<span style="color: gray; font-weight: 600">{{ "- (" + user.user.first_name + ")" if user.user.first_name else ''}}</span>
 {% endblock %}
 
 {% block after_point_head %}
@@ -31,8 +29,18 @@
         {{ _('Problems') }}
         {%- if sort_links %}{{ sort_order.problem_count }}</a>{% endif %}
     </th>
+    <th class="about-column">{{ _('About') }}</th>
 {% endblock %}
 
 {% block after_point %}
-    <td>{{ user.problem_count }}</td>
+    <td class="user-problem-count">{{ user.problem_count }}</td>
+    <td>
+        <div class="about-td">
+            {% if user.about %}
+                {% cache 86400 'user_about' user.id MATH_ENGINE %}
+                    {{ user.about|markdown('self-description', MATH_ENGINE)|reference|str|safe }}
+                {% endcache %}
+            {% endif %}
+        </div>
+    </td>
 {% endblock %}