61 lines
2.5 KiB
HTML
61 lines
2.5 KiB
HTML
{% extends 'base.html' %}
|
|
{% block content %}
|
|
<div class="row container section">
|
|
<div class="col s12 m12 l12">
|
|
{% if user.first_name or user.last_name %}
|
|
<h2 class="header center-align">{{ user.first_name }} {{ user.last_name }}</h2>
|
|
{% else %}
|
|
<h2 class="header center-align">{{ user.username }}</h2>
|
|
{% endif %}
|
|
<div class="card horizontal" style="width:100%;">
|
|
<div class="card-image">
|
|
<img src="/media/{{ user.profile.icon }}">
|
|
</div>
|
|
<div class="card-stacked">
|
|
<div class="card-content">
|
|
<span class="card-title" style="font-weight: bold">Description</span>
|
|
<p style="font-size: 18px;text-align: justify">I am a very simple man. I am good at processing small bits of
|
|
information.
|
|
I am convenient because I require little food to function effectively.</p><br>
|
|
<span class="card-title" style="font-weight: bold">Challenges completed</span>
|
|
<ul>
|
|
{% for challenge in challenges %}
|
|
<li><a class="darklink"
|
|
href="/challenge/{{ challenge.challenge.id }}">{{ challenge.challenge.name }}</a></li>
|
|
{% empty %}
|
|
<li>User has not completed any challenges</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col s1 m1 l1">
|
|
<i class="material-icons" style="font-size: 20px;padding-left:50%;">flash_on</i>
|
|
</div>
|
|
<div class="col s9 m9 l10">
|
|
<div class="progress" style="background-color: #f1f1f1;width:100%;">
|
|
<div class="determinate" style="width: 30%; background-color:#ffc107;"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col s1 m1 l1">
|
|
<span style="color: #ffc107;">3</span>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col s1 m1 l1">
|
|
<i class="material-icons" style="font-size: 20px;padding-left:50%">computer</i>
|
|
</div>
|
|
<div class="col s9 m19 l10">
|
|
<div class="progress" style="background-color: #f1f1f1;width:100%">
|
|
<div class="determinate" style="width: 70%; background-color:#3498db;"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col s1 m1 l1">
|
|
<span style="color:#3498db;">7</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|