This commit is contained in:
salam committed 2026-09-12 20:23:51 +02:00
1 parent 0fac77d556
commit d45d458023
4 files changed
+61 -61

No files matched your search

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 540 KiB

@@ -24,73 +24,73 @@
</div> </div>
</div> </div>
</div> </div>
<div class="bg-green-500 border-2 mx-3 p-3 rounded col-span-5 grid grid-cols-7 grid-rows-5 gap-2 bg-cover bg-center bg-no-repeat aspect-7/5" <div class="drop-shadow-2xl mx-3 p-3 rounded col-span-5 grid grid-cols-7 grid-rows-5 gap-2 bg-cover bg-center bg-no-repeat aspect-7/5"
style="background-image: url({{ asset('images/soccerfield-cleand.jpg') }});"> style="background-image: url({{ asset('images/soccerfield-af.jpg') }});">
@foreach ($beschriftung as $boxNumber => $benennung) @foreach ($beschriftung as $boxNumber => $benennung)
@if ($benennung) @if ($benennung)
@if (in_array($boxNumber, $lineup)) @if (in_array($boxNumber, $lineup))
<div x-data="{ isOver: false }" @dragover.prevent="isOver = true" <div x-data="{ isOver: false }" @dragover.prevent="isOver = true"
@dragenter.prevent="isOver = true" @dragleave.prevent="isOver = false" @dragenter.prevent="isOver = true" @dragleave.prevent="isOver = false"
@drop.prevent=" @drop.prevent="
isOver = false; isOver = false;
const rawData = $event.dataTransfer.getData('text/plain'); const rawData = $event.dataTransfer.getData('text/plain');
if (rawData) { if (rawData) {
const elementData = JSON.parse(rawData); const elementData = JSON.parse(rawData);
$wire.dispatch('element-dropped-in-box', { elementData: elementData, boxNumber: {{ $boxNumber }} }); $wire.dispatch('element-dropped-in-box', { elementData: elementData, boxNumber: {{ $boxNumber }} });
} }
" "
:class="isOver ? 'border-red-500 bg-white/20 ring-2 ring-red-500/50 scale-[1.02]' : :class="isOver ? 'border-red-500 bg-white/20 ring-2 ring-red-500/50 scale-[1.02]' :
@if (in_array($benennung, ['SW', 'DR', 'DC', 'DL'])) 'border-gray-800 bg-green-500/40' @if (in_array($benennung, ['SW', 'DR', 'DC', 'DL'])) 'border-gray-800 bg-green-500/40'
@elseif (in_array($benennung, ['DM', 'MR', 'MC', 'ML', 'AM'])) @elseif (in_array($benennung, ['DM', 'MR', 'MC', 'ML', 'AM']))
'border-gray-800 bg-blue-500/40' 'border-gray-800 bg-blue-500/40'
@else @else
'border-gray-800 bg-amber-500/40' @endif" 'border-gray-800 bg-amber-500/40' @endif"
class="border-2 rounded-xl transition-all px-1 pt-0 flex flex-col justify-start transform inset-shadow-sm inset-shadow-white/50 shadow-lg"> class="border-2 rounded-xl transition-all px-1 pt-0 flex flex-col justify-start transform inset-shadow-sm inset-shadow-white/50 shadow-lg">
<!-- Box Header --> <!-- Box Header -->
<div class="grid grid-cols-6 items-center"> <div class="grid grid-cols-6 items-center">
<div></div> <div></div>
<div <div
class="w-10 2xl:w-16 text-center mx-auto bg-black text-white p-0.5 2xl:p-1 text-md 2xl:text-xl font-black rounded-b col-span-4"> class="w-10 2xl:w-16 text-center mx-auto bg-black text-white p-0.5 2xl:p-1 text-md 2xl:text-xl font-black rounded-b col-span-4">
{{ $benennung }} {{ $benennung }}
</div>
@if ($boxes[$boxNumber])
<x-filament::icon-button icon="heroicon-m-trash" color="black"
class="dark:[&_svg]:text-black" size="sm"
wire:click="clearBox({{ $boxNumber }})" />
@endif
</div> </div>
<!-- Box Inhalt -->
@if ($boxes[$boxNumber]) @if ($boxes[$boxNumber])
<x-filament::icon-button icon="heroicon-m-trash" color="black" <div draggable="true"
class="dark:[&_svg]:text-black" size="sm" x-on:dragstart="e => {
wire:click="clearBox({{ $boxNumber }})" /> e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('text/plain', JSON.stringify({ id: {{ $boxes[$boxNumber]['id'] }} }));
}"
class="cursor-grab active:cursor-grabbing bg-black border border-black hover:border-blue-500 text-white p-0.5 2xl:p-1 m-0.5 rounded leading-4 2xl:leading-5 text-ms">
{{ $boxes[$boxNumber]['name'] }}
</div>
@endif @endif
</div> </div>
@else
<!-- Box Inhalt --> <div x-data="{ isOver: false }" @dragover.prevent="isOver = true"
@if ($boxes[$boxNumber]) @dragenter.prevent="isOver = true" @dragleave.prevent="isOver = false"
<div draggable="true" @drop.prevent="
x-on:dragstart="e => { isOver = false;
e.dataTransfer.effectAllowed = 'copy'; const rawData = $event.dataTransfer.getData('text/plain');
e.dataTransfer.setData('text/plain', JSON.stringify({ id: {{ $boxes[$boxNumber]['id'] }} })); if (rawData) {
}" const elementData = JSON.parse(rawData);
class="cursor-grab active:cursor-grabbing bg-black border border-black hover:border-blue-500 text-white p-0.5 2xl:p-1 m-0.5 rounded leading-4 2xl:leading-5 text-ms"> $wire.dispatch('element-dropped-in-box', { elementData: elementData, boxNumber: {{ $boxNumber }} });
{{ $boxes[$boxNumber]['name'] }} }
</div> "
@endif class="border rounded-xl transition-all pt-0 flex flex-col justify-start shadow-2xs invisible">
</div> </div>
@endif
@else @else
<div x-data="{ isOver: false }" @dragover.prevent="isOver = true" <div></div>
@dragenter.prevent="isOver = true" @dragleave.prevent="isOver = false"
@drop.prevent="
isOver = false;
const rawData = $event.dataTransfer.getData('text/plain');
if (rawData) {
const elementData = JSON.parse(rawData);
$wire.dispatch('element-dropped-in-box', { elementData: elementData, boxNumber: {{ $boxNumber }} });
}
"
class="border rounded-xl transition-all pt-0 flex flex-col justify-start shadow-2xs invisible">
</div>
@endif @endif
@else @endforeach
<div></div> </div>
@endif
@endforeach
</div>
</div> </div>
</div> </div>