feat: resolve linter warnings, optimize tables scroll behavior with top scroll sync, and extract reusable table macros

This commit is contained in:
2026-05-31 06:03:54 +05:00
parent 478d5f3c17
commit 58c929dd38
15 changed files with 718 additions and 325 deletions
+2 -2
View File
@@ -15,7 +15,7 @@
{% if let Some(err) = error %}
<div class="mb-6 p-4 rounded-xl bg-rose-500/10 border border-rose-500/20 text-rose-400 text-sm flex items-start gap-2.5">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-5 h-5 flex-shrink-0 mt-0.5">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-5 h-5 shrink-0 mt-0.5">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z" />
</svg>
<span>{{ err }}</span>
@@ -24,7 +24,7 @@
{% if let Some(msg) = success %}
<div class="mb-6 p-4 rounded-xl bg-emerald-500/10 border border-emerald-500/20 text-emerald-400 text-sm flex items-start gap-2.5">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-5 h-5 flex-shrink-0 mt-0.5">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-5 h-5 shrink-0 mt-0.5">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 0 1-1.043 3.296 3.745 3.745 0 0 1-3.296 1.043A3.745 3.745 0 0 1 12 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 0 1-3.296-1.043 3.745 3.745 0 0 1-1.043-3.296A3.745 3.745 0 0 1 3 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 0 1 1.043-3.296 3.746 3.746 0 0 1 3.296-1.043A3.746 3.746 0 0 1 12 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 0 1 3.296 1.043 3.746 3.746 0 0 1 1.043 3.296A3.745 3.745 0 0 1 21 12Z" />
</svg>
<span>{{ msg }}</span>
+8 -10
View File
@@ -26,15 +26,14 @@
</div>
<!-- User List -->
<div class="bg-[#1e293b]/40 backdrop-blur-xl border border-slate-900 rounded-3xl p-6 shadow-xl overflow-hidden">
<div class="overflow-x-auto">
<table class="min-w-full divide-y divide-slate-800 text-left text-sm text-slate-300">
<thead>
{{ ui::table_container_open(id="users-table", has_top_scroll=false, max_height="auto") }}
<table class="min-w-full divide-y divide-slate-800 text-left text-sm text-slate-300 relative">
<thead class="shadow-[0_1px_0_0_rgba(255,255,255,0.05)]">
<tr class="text-xs font-bold text-slate-400 uppercase tracking-wider">
<th scope="col" class="px-6 py-4">Username</th>
<th scope="col" class="px-6 py-4">Role</th>
<th scope="col" class="px-6 py-4">Created At</th>
<th scope="col" class="px-6 py-4 text-right">Actions</th>
<th scope="col" class="sticky top-0 z-10 px-6 py-4 bg-[#162031]">Username</th>
<th scope="col" class="sticky top-0 z-10 px-6 py-4 bg-[#162031]">Role</th>
<th scope="col" class="sticky top-0 z-10 px-6 py-4 bg-[#162031]">Created At</th>
<th scope="col" class="sticky top-0 z-10 px-6 py-4 bg-[#162031] text-right">Actions</th>
</tr>
</thead>
<tbody class="divide-y divide-slate-800">
@@ -97,8 +96,7 @@
{% endif %}
</tbody>
</table>
</div>
</div>
{{ ui::table_container_close(id="users-table", has_top_scroll=false) }}
<div class="mt-6 text-center text-sm text-slate-400">
<a href="/auth/password" class="font-medium text-sky-400 hover:underline">← Back to Account Settings</a>