made ui chnages

This commit is contained in:
bolade
2025-11-26 12:57:11 +01:00
parent 100b47e947
commit 9d61ebb533
8 changed files with 202 additions and 319 deletions
+27 -28
View File
@@ -26,16 +26,16 @@
</div>
</div>
<!-- Metrics Summary Grid -->
<div class="grid grid-cols-2 gap-4 mb-4">
<!-- Metrics Summary Grid: Left and Right as two side-by-side panels, fields as two columns inside each -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
<!-- Left Leg Metrics -->
<div class="bg-blue-50 p-3 rounded-lg border-l-4 border-blue-300">
<div class="bg-blue-50 p-3 rounded-lg border-l-4 border-blue-300 h-full flex flex-col">
<h3 class="text-base font-bold text-gray-900 mb-3 text-center">
Left Leg Analysis
</h3>
<div class="space-y-2">
<div class="bg-white p-2 rounded shadow-sm">
<div class="grid grid-cols-2 gap-3">
<!-- Baseline SmO2 -->
<div class="bg-white p-2 rounded shadow-sm col-span-2 md:col-span-1">
<div class="text-xs font-semibold text-gray-700">
Baseline SmO₂
</div>
@@ -43,8 +43,8 @@
{{ left_baseline_smo2 | default('75.4%') }}
</div>
</div>
<div class="bg-white p-2 rounded shadow-sm">
<!-- Minimum SmO2 -->
<div class="bg-white p-2 rounded shadow-sm col-span-2 md:col-span-1">
<div class="text-xs font-semibold text-gray-700">
Minimum SmO₂
</div>
@@ -55,8 +55,8 @@
{{ left_minimum_lap | default('Lap 6') }}
</div>
</div>
<div class="bg-white p-2 rounded shadow-sm">
<!-- Oxygen Drop -->
<div class="bg-white p-2 rounded shadow-sm col-span-2 md:col-span-1">
<div class="text-xs font-semibold text-gray-700">
Oxygen Drop
</div>
@@ -67,12 +67,12 @@
{{ left_drop_percentage | default('8% decrease') }}
</div>
</div>
<div class="bg-white p-2 rounded shadow-sm">
<!-- Recovery -->
<div class="bg-white p-2 rounded shadow-sm col-span-2 md:col-span-1">
<div class="text-xs font-semibold text-gray-700">
Recovery
</div>
<div class="text-xs text-gray-500">"Optimal >100%"</div>
<div class="text-xs text-gray-500">Optimal &gt;100%</div>
<div class="text-base font-bold text-green-600">
{{ left_recovery_percentage | default('109%') }}
</div>
@@ -81,13 +81,13 @@
</div>
<!-- Right Leg Metrics -->
<div class="bg-purple-50 p-3 rounded-lg border-l-4 border-purple-300">
<div class="bg-purple-50 p-3 rounded-lg border-l-4 border-purple-300 h-full flex flex-col">
<h3 class="text-base font-bold text-gray-900 mb-3 text-center">
Right Leg Analysis
</h3>
<div class="space-y-2">
<div class="bg-white p-2 rounded shadow-sm">
<div class="grid grid-cols-2 gap-3">
<!-- Baseline SmO2 -->
<div class="bg-white p-2 rounded shadow-sm col-span-2 md:col-span-1">
<div class="text-xs font-semibold text-gray-700">
Baseline SmO₂
</div>
@@ -95,8 +95,8 @@
{{ right_baseline_smo2 | default('82.9%') }}
</div>
</div>
<div class="bg-white p-2 rounded shadow-sm">
<!-- Minimum SmO2 -->
<div class="bg-white p-2 rounded shadow-sm col-span-2 md:col-span-1">
<div class="text-xs font-semibold text-gray-700">
Minimum SmO₂
</div>
@@ -107,8 +107,8 @@
{{ right_minimum_lap | default('Lap 6') }}
</div>
</div>
<div class="bg-white p-2 rounded shadow-sm">
<!-- Oxygen Drop -->
<div class="bg-white p-2 rounded shadow-sm col-span-2 md:col-span-1">
<div class="text-xs font-semibold text-gray-700">
Oxygen Drop
</div>
@@ -119,12 +119,12 @@
{{ right_drop_percentage | default('11% decrease') }}
</div>
</div>
<div class="bg-white p-2 rounded shadow-sm">
<!-- Recovery -->
<div class="bg-white p-2 rounded shadow-sm col-span-2 md:col-span-1">
<div class="text-xs font-semibold text-gray-700">
Recovery
</div>
<div class="text-xs text-gray-500">"Optimal >100%"</div>
<div class="text-xs text-gray-500">Optimal &gt;100%</div>
<div class="text-base font-bold text-blue-600">
{{ right_recovery_percentage | default('97%') }}
</div>
@@ -143,10 +143,9 @@
</p>
<p>
<strong
>{{ recovery_assessment | default('Excellent recovery
capacity') }}</strong
>
<strong>
{{ recovery_assessment | default('Excellent recovery capacity') }}
</strong>
- both legs recovered well
</p>
<p>