feature: login and my page

2026-07-02 15:42:47 +07:00
parent c993f848cb
commit 89790539b7
41 changed files with 1062 additions and 769 deletions
@@ -0,0 +1,34 @@
+@props(['rank', 'name', 'team', 'avatar', 'score', 'isCurrent' => false, 'unit' => 'điểm'])
+
+<div class="flex items-center justify-between py-3 border-b border-gray-50 last:border-0 hover:bg-gray-50 rounded-xl px-3 transition-colors {{ $isCurrent ? 'bg-blue-50/50' : '' }}">
+    <div class="flex items-center gap-3">
+        <!-- Rank -->
+        <div class="w-6 flex justify-center items-center">
+            @if($rank == 1)
+                <span class="text-xl">👑</span>
+                <span class="absolute text-[10px] font-bold text-amber-500 translate-y-3">1</span>
+            @elseif($rank == 2)
+                <span class="text-[14px] text-gray-500 font-bold">2</span>
+            @elseif($rank == 3)
+                <span class="text-[14px] text-gray-500 font-bold">3</span>
+            @else
+                <span class="text-[14px] font-bold {{ $isCurrent ? 'text-blue-600' : 'text-gray-400' }}">{{ $rank }}</span>
+            @endif
+        </div>
+        
+        <!-- Avatar & Info -->
+        <div class="flex items-center gap-3 ml-1">
+            <img src="{{ $avatar }}" alt="{{ $name }}" class="w-9 h-9 rounded-full object-cover shadow-sm">
+            <div class="flex flex-col">
+                <span class="text-[13px] font-bold {{ $isCurrent ? 'text-gray-900' : 'text-gray-800' }} leading-tight mb-0.5">{{ $name }}</span>
+                <span class="text-[11px] text-gray-400 font-medium">{{ $team }}</span>
+            </div>
+        </div>
+    </div>
+    
+    <!-- Score -->
+    <div class="text-[13px]">
+        <span class="font-extrabold {{ $isCurrent ? 'text-blue-600' : 'text-gray-700' }}">{{ number_format($score, 0, ',', '.') }}</span>
+        <span class="text-gray-400 font-medium ml-0.5">{{ $unit }}</span>
+    </div>
+</div>