peterstockings/bloodpressure
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove background of readings list on dashboard

Browse Source
This commit is contained in:
Peter Stockings
2024-12-26 16:37:34 +11:00
parent 9ed9aee471
commit 9614567e22
1 changed files with 44 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
app/templates/dashboard.html
View File

@@ -166,63 +166,55 @@
</div>
<!-- Readings Table -->
<div class="bg-white rounded-lg shadow-md overflow-hidden">
<div class="overflow-x-auto">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
{% for reading in readings %}
<a href="{{ url_for('main.edit_reading', reading_id=reading.id) }}"
class="bg-white shadow-md rounded-lg p-4 flex flex-col justify-between relative hover:shadow-lg transition-shadow">
<!-- Timestamp -->
<div class="absolute top-2 right-2 flex items-center text-gray-400 text-xs">
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 mr-1" fill="none" viewBox="0 0 24 24"
stroke="currentColor" stroke-width="1.5">
<path stroke-linecap="round" stroke-linejoin="round"
d="M12 8v4l3 3m9-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0z" />
</svg>
<span title="{{ reading.timestamp.strftime('%d %b %Y, %I:%M %p') }}">
{{ reading.relative_timestamp }}
</span>
</div>
<!-- Blood Pressure -->
<div class="text-sm text-gray-600 mb-2">
<span class="block text-lg font-semibold text-gray-800">Blood Pressure</span>
<span class="text-2xl font-bold text-blue-600">{{ reading.systolic }}</span>
<span class="text-lg text-gray-500">/</span>
<span class="text-xl font-bold text-red-600">{{ reading.diastolic }}</span>
<span class="text-sm text-gray-500">mmHg</span>
</div>
<!-- Heart Rate and Arrow -->
<div class="flex justify-between items-center mt-4">
<div class="text-sm text-gray-600">
<span class="block text-lg font-semibold text-gray-800">Heart Rate</span>
<span class="text-2xl font-bold text-green-600">{{ reading.heart_rate }}</span>
<span class="text-sm text-gray-500">bpm</span>
</div>
<!-- Arrow Icon -->
<div class="text-gray-400 hover:text-gray-600">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="h-5 w-5">
<path stroke-linecap="round" stroke-linejoin="round"
d="M6.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM12.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM18.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z" />
</svg>
</div>
</div>
</a>
{% else %}
<div class="col-span-full text-center text-sm text-gray-500">
No readings found.
</div>
{% endfor %}
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{% for reading in readings %}
<a href="{{ url_for('main.edit_reading', reading_id=reading.id) }}"
class="bg-white shadow-md rounded-lg p-4 flex flex-col justify-between relative hover:shadow-lg transition-shadow">
<!-- Timestamp -->
<div class="absolute top-2 right-2 flex items-center text-gray-400 text-xs">
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 mr-1" fill="none" viewBox="0 0 24 24"
stroke="currentColor" stroke-width="1.5">
<path stroke-linecap="round" stroke-linejoin="round"
d="M12 8v4l3 3m9-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0z" />
</svg>
<span title="{{ reading.timestamp.strftime('%d %b %Y, %I:%M %p') }}">
{{ reading.relative_timestamp }}
</span>
</div>
<!-- Blood Pressure -->
<div class="text-sm text-gray-600 mb-2">
<span class="block text-lg font-semibold text-gray-800">Blood Pressure</span>
<span class="text-2xl font-bold text-blue-600">{{ reading.systolic }}</span>
<span class="text-lg text-gray-500">/</span>
<span class="text-xl font-bold text-red-600">{{ reading.diastolic }}</span>
<span class="text-sm text-gray-500">mmHg</span>
</div>
<!-- Heart Rate and Arrow -->
<div class="flex justify-between items-center mt-4">
<div class="text-sm text-gray-600">
<span class="block text-lg font-semibold text-gray-800">Heart Rate</span>
<span class="text-2xl font-bold text-green-600">{{ reading.heart_rate }}</span>
<span class="text-sm text-gray-500">bpm</span>
</div>
<!-- Arrow Icon -->
<div class="text-gray-400 hover:text-gray-600">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="h-5 w-5">
<path stroke-linecap="round" stroke-linejoin="round"
d="M6.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM12.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM18.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z" />
</svg>
</div>
</div>
</a>
{% else %}
<div class="col-span-full text-center text-sm text-gray-500">
No readings found.
</div>
{% endfor %}
</div>
</div>
{% endblock %}