Enhance table styling and layout in report pages

- Updated table header and cell classes to center-align text for better readability in page_19.html.
- Adjusted padding and margins in page_7.html for improved layout and visual consistency.
- Reduced spacing in various sections to create a more compact and organized appearance.
This commit is contained in:
bolade
2025-09-29 11:17:32 +01:00
parent a20f21d288
commit 54e0189301
6 changed files with 208 additions and 207 deletions
+1
View File
@@ -3,3 +3,4 @@ import pandas as pd
pnoe_df = pd.read_csv('data/pnoe_data.csv')
patient_df = pd.read_csv('data/patient_data.csv')
spirometry_df = pd.read_csv('data/spirometry_data.csv')
Binary file not shown.

Before

Width:  |  Height:  |  Size: 113 KiB

After

Width:  |  Height:  |  Size: 108 KiB

Binary file not shown.
+3 -3
View File
File diff suppressed because one or more lines are too long
+196 -196
View File
@@ -18,42 +18,42 @@
<thead>
<tr class="bg-cyan-200">
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Age (M)
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Poor
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Below Average
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Average
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Above Average
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Good
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Excellent
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Athlete
</th>
@@ -62,169 +62,169 @@
<tbody>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
18-25
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
85bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
76-84bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
74-78bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
70-73bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
66-69bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
61-65bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
60-60bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
26-35
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
83bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
77-82bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
73-76bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
69-72bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
65-68bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
60-64bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
55-59bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
36-45
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
85bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
79-84bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
74-78bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
70-73bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
65-69bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
60-64bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
55-59bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
46-55
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
84bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
76-83bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
73-77bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
70-72bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
66-69bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
61-65bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
56-60bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
56-65
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
85bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
78-84bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
74-77bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
70-73bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
65-69bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
60-64bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
50-59bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
65+
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
84bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
77-83bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
73-76bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
70-73bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
65-69bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
60-64bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
55-59bpm
</td>
</tr>
@@ -240,42 +240,42 @@
<thead>
<tr class="bg-cyan-200">
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Age (F)
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Poor
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Below Average
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Average
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Above Average
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Good
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Excellent
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Athlete
</th>
@@ -284,169 +284,169 @@
<tbody>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
18-25
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
81bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
74-81bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
73-78bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
66-69bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
62-65bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
56-61bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
50-55bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
26-35
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
82bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
75-81bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
71-74bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
66-70bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
62-65bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
55-61bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
54-54bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
36-45
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
83bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
76-82bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
71-75bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
67-70bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
63-66bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
57-62bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
47-56bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
46-55
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
84bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
77-83bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
72-76bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
68-71bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
64-67bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
58-63bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
49-57bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
56-65
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
82bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
76-81bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
72-75bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
68-71bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
62-67bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
57-61bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
51-56bpm
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
65+
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
80bpm +
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
74-79bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
70-73bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
66-69bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
62-65bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
56-61bpm
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
52-55bpm
</td>
</tr>
@@ -469,37 +469,37 @@
<thead>
<tr class="bg-cyan-200">
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Age (M)
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Very Poor
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Poor
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Fair
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Good
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Excellent
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Superior
</th>
@@ -508,126 +508,126 @@
<tbody>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
20-29
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
29.0-38.1
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
38.1-44.9
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
44.9-50.2
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
50.2-61.8
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
57.1-66.3
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
66.3+
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
30-39
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
27.2-34.1
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
34.1-39.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
39.6-45.2
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
45.2-51.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
51.6-59.8
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
59.8+
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
40-49
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
24.2-30.5
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
30.5-35.7
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
35.7-40.3
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
40.3-46.7
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
46.7-55.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
55.6+
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
50-59
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
20.9-26.1
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
26.1-30.7
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
30.7-35.1
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
35.1-41.2
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
41.2-50.7
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
50.7+
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
60-69
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
17.4-22.4
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
22.4-26.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
26.6-30.5
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
30.5-36.1
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
36.1-43.0
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
43.0+
</td>
</tr>
@@ -643,37 +643,37 @@
<thead>
<tr class="bg-cyan-200">
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Age (F)
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Very Poor
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Poor
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Fair
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Good
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Excellent
</th>
<th
class="border border-gray-300 p-1 font-bold"
class="border border-gray-300 p-1 font-bold text-center"
>
Superior
</th>
@@ -682,126 +682,126 @@
<tbody>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
20-29
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
21.7-28.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
28.6-34.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
34.6-40.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
40.6-46.5
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
46.5-56.0
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
56.0+
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
30-39
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
19.0-24.1
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
24.1-28.2
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
28.2-32.2
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
32.2-35.7
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
35.7-45.8
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
45.8+
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
40-49
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
17.0-21.3
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
21.3-24.9
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
24.9-28.7
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
28.7-34.0
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
34.0-41.7
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
41.7+
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
50-59
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
16.0-19.1
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
19.1-24.4
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
21.8-27.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
25.2-28.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
28.6-35.9
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
35.9+
</td>
</tr>
<tr>
<td
class="border border-gray-300 p-1 font-medium"
class="border border-gray-300 p-1 font-medium text-center"
>
60-69
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
13.4-16.5
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
16.5-18.9
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
18.9-21.2
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
21.2-24.6
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
24.6-29.4
</td>
<td class="border border-gray-300 p-1">
<td class="border border-gray-300 p-1 text-center">
29.4+
</td>
</tr>
+7 -7
View File
@@ -1,11 +1,11 @@
<div class="w-full page bg-white p-8">
<div class="w-full page bg-white p-4">
<!-- Header -->
<h1 class="text-3xl font-bold mb-6">Lung Analysis</h1>
<h1 class="text-3xl font-bold mb-2">Lung Analysis</h1>
<!-- Spirometry Assessment Section -->
<div class="mb-8">
<div class="mb-2">
<h2 class="text-xl font-semibold mb-4">Spirometry Assessment</h2>
<p class="text-sm text-gray-700 mb-6">
<p class="text-sm text-gray-700 mb-4">
Spirometry is a diagnostic device that assesses how well a person
breathes and how their lungs are functioning. Lung function is
crucial for oxygen delivery during physical activity. Comparing
@@ -24,18 +24,18 @@
</div>
<!-- Indications Box -->
<div class="bg-gray-200 rounded-lg p-4 text-center mb-8">
<div class="bg-gray-200 rounded-lg p-4 text-center mb-2">
<h3 class="font-semibold text-lg mb-2">Indications</h3>
<p class="text-gray-700">{{ indication }}</p>
</div>
</div>
<!-- Respiratory Section -->
<div class="mb-8">
<div class="mb-4">
<h2 class="text-xl font-semibold mb-4 text-center">Respiratory</h2>
<!-- Respiratory Chart -->
<div class="flex justify-center mb-6">
<div class="flex justify-center mb-4">
<img
src="data:image/png;base64,{{ respiratory_analysis_chart }}"
alt="Respiratory Analysis Chart"