feat: sidebar + top bar game layout with dark crime theme

This commit is contained in:
Doar Mihai
2026-06-28 02:58:28 +03:00
parent 2a6c495d87
commit 195688da25
3 changed files with 143 additions and 181 deletions
@@ -1,48 +1,32 @@
@php
$character = auth()->user()->character;
@endphp
@php $character = auth()->user()->character; @endphp
<div class="flex items-center space-x-3 text-sm">
{{-- HP --}}
<div class="flex items-center space-x-1 bg-syndicate-800 border border-syndicate-700 rounded px-2 py-1">
<span class="text-red-400">❤</span>
<span class="text-gray-300">{{ $character->health }}<span class="text-gray-600">/{{ $character->max_health }}</span></span>
</div>
<div class="flex items-center space-x-4 text-sm">
<!-- Energy Bar -->
<div class="flex items-center space-x-2">
{{-- Energy --}}
<div class="flex items-center space-x-1 bg-syndicate-800 border border-syndicate-700 rounded px-2 py-1">
<span class="text-yellow-400">⚡</span>
<div class="w-20 bg-gray-600 rounded-full h-2">
<div
class="bg-yellow-400 h-2 rounded-full transition-all duration-300"
style="width: {{ $character->energy_percentage }}%"
></div>
</div>
<span>{{ $character->energy }}/{{ $character->max_energy }}</span>
<span class="text-gray-300">{{ $character->energy }}<span class="text-gray-600">/{{ $character->max_energy }}</span></span>
</div>
<!-- Health Bar -->
<div class="flex items-center space-x-2">
<span class="text-red-400">❤️</span>
<div class="w-20 bg-gray-600 rounded-full h-2">
<div
class="bg-red-400 h-2 rounded-full transition-all duration-300"
style="width: {{ $character->health_percentage }}%"
></div>
</div>
<span>{{ $character->health }}/{{ $character->max_health }}</span>
{{-- Cash --}}
<div class="flex items-center space-x-1 bg-syndicate-800 border border-syndicate-700 rounded px-2 py-1">
<span class="text-gold-400">$</span>
<span class="text-gray-300">{{ number_format($character->money) }}</span>
</div>
<!-- Money -->
<div class="flex items-center space-x-1">
<span class="text-green-400">💰</span>
<span>${{ number_format($character->money) }}</span>
{{-- Level --}}
<div class="bg-syndicate-700 text-gray-300 rounded px-2 py-1 text-xs font-medium">
Lv.{{ $character->level }}
</div>
<!-- Level -->
<div class="flex items-center space-x-1">
<span class="text-blue-400">📈</span>
<span>Lv. {{ $character->level }}</span>
</div>
<!-- Status -->
@if($character->status !== 'active')
<span class="px-2 py-1 text-xs rounded {{ $character->status === 'in_hospital' ? 'bg-red-500' : 'bg-yellow-500' }}">
{{ ucfirst(str_replace('_', ' ', $character->status)) }}
{{-- Non-active status badge --}}
@if($character->status !== \App\Enums\CharacterStatus::ACTIVE)
<span class="px-2 py-1 text-xs rounded {{ $character->status->color() }}">
{{ $character->status->label() }}
</span>
@endif
</div>