styling reports table

main
Zynh0722 2023-11-05 08:38:15 -08:00
parent 79fd0f680e
commit cb6e9d1889
1 changed files with 38 additions and 30 deletions

View File

@ -6,38 +6,46 @@
@:base_html({ @:base_html({
@:return_to_main_html() <div class="fixed right-0 top-0 pr-4 pt-4">
@:return_to_main_html()
</div>
<table> <h1 class="text-4xl underline text-center pt-4 pb-6">
<thead> Shift Reports
<tr> </h1>
<th>Shift ID</th>
<th>Shift Start</th>
<th>Shift End</th>
</tr>
</thead>
<tbody>
@for shift in shifts {
<tr> <div class="flex">
<td>@shift.id</td> <table class="m-auto table-auto w-4/5">
<td>@shift.start.format("%Y-%m-%d %H:%M:%S")</td> <thead>
<td> <tr>
@if let Some(end) = shift.end { <th>Shift ID</th>
@end.format("%Y-%m-%d %H:%M:%S") <th>Shift Start</th>
} else { <th>Shift End</th>
Currently Open </tr>
} </thead>
</td> <tbody>
<td hx-boost="true"> @for shift in shifts {
<a href="/shifts/@shift.id/report">
<button type="button">View Shift</button>
</a>
</td>
</tr>
} <tr class="odd:bg-neutral-200">
</tbody> <td class="text-center">@shift.id</td>
</table> <td class="text-center">@shift.start.format("%Y-%m-%d %H:%M:%S")</td>
<td class="text-center">
@if let Some(end) = shift.end {
@end.format("%Y-%m-%d %H:%M:%S")
} else {
Currently Open
}
</td>
<td hx-boost="true" class="flex justify-end">
<a href="/shifts/@shift.id/report">
<button type="button" class=" text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5">View Shift</button>
</a>
</td>
</tr>
}
</tbody>
</table>
</div>
}) })