Files
neonail-database/resources/views/user-nail-polishes/index.blade.php
2026-06-13 10:19:44 +02:00

114 lines
4.5 KiB
PHP
Executable File
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
@extends('layouts.app')
@section('title', 'Meine Sammlung NeoNail DB')
@section('content')
{{-- Page Hero --}}
<div class="page-hero d-flex flex-column flex-md-row align-items-md-center justify-content-md-between gap-3">
<div>
<h1>💅 Meine Sammlung</h1>
<p>Verwalten Sie Ihre persönliche Nagellack-Sammlung</p>
</div>
<div class="d-flex gap-2 flex-wrap">
<a href="{{ route('user-nail-polishes.create') }}" class="btn btn-success">
<i class="fas fa-plus me-2"></i>Neuen Lack
</a>
<a href="{{ route('user-nail-polishes.available') }}" class="btn btn-glass">
<i class="fas fa-search me-2"></i>Verfügbare Lacke
</a>
</div>
</div>
{{-- Search + Count --}}
<div class="d-flex align-items-center gap-3 mb-4">
<div class="search-wrap flex-grow-1">
<form method="GET" action="{{ route('user-nail-polishes.index') }}">
<i class="fas fa-search search-icon"></i>
<input type="text" name="search" class="form-control search-input"
placeholder="Nach Name oder Nummer suchen…"
value="{{ $search }}" autocomplete="off">
@if($search)
<a href="{{ route('user-nail-polishes.index') }}" class="search-clear" title="Zurücksetzen">
<i class="fas fa-times"></i>
</a>
@endif
<button type="submit" class="search-submit">Suchen</button>
</form>
</div>
<span class="count-chip">
<i class="fas fa-layer-group"></i>
{{ $nailPolishes->total() }} {{ $nailPolishes->total() === 1 ? 'Lack' : 'Lacke' }}
</span>
</div>
{{-- Grid --}}
@if($nailPolishes->count() > 0)
<div class="row g-3">
@foreach($nailPolishes as $nailPolish)
<div class="col-6 col-md-4 col-lg-3">
<div class="card np-card h-100">
@if($nailPolish->image_path)
<img src="{{ Storage::url($nailPolish->image_path) }}"
class="np-img" alt="{{ $nailPolish->name }}" loading="lazy">
@else
<div class="np-placeholder">
<i class="fas fa-palette"></i>
</div>
@endif
<div class="card-body d-flex flex-column">
<div class="flex-grow-1">
<div class="np-name">{{ $nailPolish->name }}</div>
<div class="np-number">Nr. {{ $nailPolish->number }}</div>
@if($nailPolish->manufacturer)
<span class="np-brand">{{ $nailPolish->manufacturer->name }}</span>
@endif
</div>
<div class="mt-3">
<form method="POST" action="{{ route('user-nail-polishes.remove', $nailPolish) }}"
onsubmit="return confirm('Lack aus der Sammlung entfernen?')">
@csrf
<button type="submit" class="btn btn-outline-danger btn-sm w-100">
<i class="fas fa-trash-alt me-1"></i>Entfernen
</button>
</form>
</div>
</div>
</div>
</div>
@endforeach
</div>
@if($nailPolishes->hasPages())
<div class="d-flex justify-content-center mt-5">
{{ $nailPolishes->appends(['search' => $search])->links() }}
</div>
@endif
@else
<div class="empty-state">
<div class="empty-icon">
<i class="fas fa-palette"></i>
</div>
<h4>{{ $search ? 'Keine Ergebnisse' : 'Sammlung ist noch leer' }}</h4>
<p>
@if($search)
Keine Lacke gefunden, die {{ $search }}" entsprechen.
@else
Fügen Sie Ihren ersten NeoNail-Lack hinzu!
@endif
</p>
<div class="d-flex gap-2 justify-content-center flex-wrap">
<a href="{{ route('user-nail-polishes.create') }}" class="btn btn-success">
<i class="fas fa-plus me-2"></i>Ersten Lack hinzufügen
</a>
<a href="{{ route('user-nail-polishes.available') }}" class="btn btn-glass">
<i class="fas fa-search me-2"></i>Verfügbare Lacke durchsuchen
</a>
</div>
</div>
@endif
@endsection