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

Fix for graph view not highlighted when selected and change list card item icon arrow to 3 dots

Browse Source
This commit is contained in:
Peter Stockings
2024-12-26 21:39:36 +11:00
parent 64c1400465
commit 22535c66b7
2 changed files with 17 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
app/static/css/tailwind.css
View File

@@ -648,6 +648,18 @@ video {
top: 1.25rem; top: 1.25rem;
} }
.bottom-0 {
bottom: 0px;
}
.left-0 {
left: 0px;
}
.right-0 {
right: 0px;
}
.z-10 { .z-10 {
z-index: 10; z-index: 10;
} }

10
app/templates/dashboard.html
View File

@@ -82,7 +82,7 @@
</form> </form>
</div> </div>
<div class="max-w-5xl mx-auto" x-data="{ activeView: 'weekly' }"> <div class="max-w-5xl mx-auto" x-data="{ activeView: 'list' }">
<!-- Tabs --> <!-- Tabs -->
<div class="flex border-b mb-4"> <div class="flex border-b mb-4">
<button @click="activeView = 'list'" :class="{'border-blue-600 text-blue-600': activeView === 'list'}" <button @click="activeView = 'list'" :class="{'border-blue-600 text-blue-600': activeView === 'list'}"
@@ -91,7 +91,7 @@
class="px-4 py-2 text-sm font-medium border-b-2">Weekly View</button> class="px-4 py-2 text-sm font-medium border-b-2">Weekly View</button>
<button @click="activeView = 'monthly'" :class="{'border-blue-600 text-blue-600': activeView === 'monthly'}" <button @click="activeView = 'monthly'" :class="{'border-blue-600 text-blue-600': activeView === 'monthly'}"
class="px-4 py-2 text-sm font-medium border-b-2">Monthly View</button> class="px-4 py-2 text-sm font-medium border-b-2">Monthly View</button>
<button @click="activeView = 'graph'" :class="{'border-blue-600 text-blue-600': activeView === 'monthly'}" <button @click="activeView = 'graph'" :class="{'border-blue-600 text-blue-600': activeView === 'graph'}"
class="px-4 py-2 text-sm font-medium border-b-2">Graph View</button> class="px-4 py-2 text-sm font-medium border-b-2">Graph View</button>
</div> </div>
@@ -122,14 +122,14 @@
</div> </div>
<!-- Heart Rate and Arrow --> <!-- Heart Rate and Arrow -->
<div class="flex justify-between items-center mt-4"> <div class="flex justify-between items-center mt-4 relative">
<div class="text-sm text-gray-600"> <div class="text-sm text-gray-600">
<span class="block text-lg font-semibold text-gray-800">Heart Rate</span> <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-2xl font-bold text-green-600">{{ reading.heart_rate }}</span>
<span class="text-sm text-gray-500">bpm</span> <span class="text-sm text-gray-500">bpm</span>
</div> </div>
<!-- Arrow Icon --> <!-- Arrow Icon -->
<div class="text-gray-400 hover:text-gray-600"> <div class="absolute bottom-0 right-0 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" <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"> stroke="currentColor" class="h-5 w-5">
<path stroke-linecap="round" stroke-linejoin="round" <path stroke-linecap="round" stroke-linejoin="round"
@@ -235,7 +235,7 @@
</div> </div>
<!-- Graph Section --> <!-- Graph Section -->
<div x-show="activeView === 'graph'" x-transition.duration.50ms class="space-y-6"> <div x-show="activeView === 'graph'" class="space-y-6">
<!-- Blood Pressure Graph --> <!-- Blood Pressure Graph -->
<div> <div>
<h3 class="text-sm font-semibold text-gray-600 mb-2">Blood Pressure (mmHg)</h3> <h3 class="text-sm font-semibold text-gray-600 mb-2">Blood Pressure (mmHg)</h3>