steve
/
mybuddy
mirror of https://github.com/snachodog/mybuddy.git
1
0
Fork 0
Code Issues 3 Packages Projects 1 Releases Wiki Activity

Create a mockup of a couple of days of sleep data using progress bars.

This commit is contained in:
Christopher Charbonneau Wells 2017-08-21 20:10:00 -04:00
parent faaa67995f
commit 4e7f80cd2e
1 changed files with 42 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
reports/templates/reports/sleep.html
View File

@ -3,5 +3,46 @@
{% block title %}Sleep Report - {{ object }}{% endblock %}
{% block content %}
Sleep report for {{ object }}.
<div>
Sleep report for {{ object }}.
</div>
<div class="pull-left p-1">
<strong>8 Aug</strong>
</div>
<div class="progress" style="height: 32px; border-radius: 0;">
<div class="progress-bar" role="progressbar" style="width: 5%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 2%"></div>
<div class="progress-bar" role="progressbar" style="width: 15%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 6%"></div>
<div class="progress-bar" role="progressbar" style="width: 3%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 10%"></div>
<div class="progress-bar" role="progressbar" style="width: 5%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 2%"></div>
<div class="progress-bar" role="progressbar" style="width: 15%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 6%"></div>
<div class="progress-bar" role="progressbar" style="width: 3%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 10%"></div>
<div class="progress-bar" role="progressbar" style="width: 8%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 10%"></div>
</div>
<div class="pull-left p-1">
<strong>7 Aug</strong>
</div>
<div class="progress" style="height: 32px; border-radius: 0;">
<div class="progress-bar" role="progressbar" style="width: 5%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 2%"></div>
<div class="progress-bar" role="progressbar" style="width: 3%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 10%"></div>
<div class="progress-bar" role="progressbar" style="width: 5%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 2%"></div>
<div class="progress-bar" role="progressbar" style="width: 15%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 6%"></div>
<div class="progress-bar" role="progressbar" style="width: 3%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 10%"></div>
<div class="progress-bar" role="progressbar" style="width: 8%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 10%"></div>
<div class="progress-bar" role="progressbar" style="width: 15%; background: none;"></div>
<div class="progress-bar bg-info" role="progressbar" style="width: 6%"></div>
</div>
{% endblock %}