67 lines
3.3 KiB
PHP
67 lines
3.3 KiB
PHP
<div class="mt-5 w-full mx-auto flex flex-col gap-5">
|
|
<h1 class="font-bold text-3xl mx-2 sm:mx-0">Lists</h1>
|
|
<x-ui.card>
|
|
<div class="w-full flex flex-col gap-2">
|
|
@if ($errors->any())
|
|
<div class="alert alert-danger">
|
|
<ul>
|
|
@foreach ($errors->all() as $error)
|
|
<li class="text-red-500">{{ $error }}</li>
|
|
@endforeach
|
|
</ul>
|
|
</div>
|
|
@endif
|
|
|
|
<form class="flex flex-col max-w-lg gap-2" wire:submit.prevent="addList">
|
|
<label class="font-bold" for="list_name">Add List</label>
|
|
<div class="flex">
|
|
<input name="list_name" placeholder="List Name"
|
|
class="flex-1 w-full text-black bg-white p-2 rounded rounded-r-none"
|
|
type="text"
|
|
wire:model.live="form.name">
|
|
<button type="submit" class="bg-green-400 text-white px-4 py-2 rounded rounded-l-none">Add</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="w-full flex flex-col gap-5">
|
|
<h2 class="text-2xl font-bold">Your Lists</h2>
|
|
@if(!$lists->isEmpty())
|
|
<ul class="w-full flex flex-col gap-3">
|
|
@foreach($lists as $list)
|
|
<li class="flex justify-between items-center p-4 bg-gray-700/50 rounded-lg hover:bg-gray-600/50 transition-colors">
|
|
<a class="text-xl hover:text-amber-200 transition-colors" href="/lists/{{$list->id}}" wire:navigate>{{$list->name}}</a>
|
|
@if((bool)$list->is_public === true)
|
|
<i class="fa fa-earth text-green-400" title="Public" aria-label="Public"></i>
|
|
@else
|
|
<i class="fa fa-lock text-gray-400" title="Private" aria-label="Private"></i>
|
|
@endif
|
|
</li>
|
|
@endforeach
|
|
</ul>
|
|
@else
|
|
<span class="text-gray-400">No lists found.</span>
|
|
@endif
|
|
</div>
|
|
|
|
<div class="w-full flex flex-col gap-5">
|
|
<h2 class="text-2xl font-bold">Shared With You</h2>
|
|
@if(!$sharedLists->isEmpty())
|
|
<ul class="w-full flex flex-col gap-3">
|
|
@foreach($sharedLists as $list)
|
|
<li class="flex justify-between items-center p-4 bg-gray-700/50 rounded-lg hover:bg-gray-600/50 transition-colors">
|
|
<a class="text-xl hover:text-amber-200 transition-colors" href="/lists/{{$list->id}}" wire:navigate>{{$list->name}}</a>
|
|
@if((bool)$list->is_public === true)
|
|
<i class="fa fa-earth text-green-400" title="Public" aria-label="Public"></i>
|
|
@else
|
|
<i class="fa fa-lock text-gray-400" title="Private" aria-label="Private"></i>
|
|
@endif
|
|
</li>
|
|
@endforeach
|
|
</ul>
|
|
@else
|
|
<span class="text-gray-400">No lists found.</span>
|
|
@endif
|
|
</div>
|
|
</x-ui.card>
|
|
</div>
|