column page custom
The problem is that I wanted to split a page to show 3 sections in a row, but it doesn’t work, even though it worked for me in filamentphp v3.
<div class="p-4 max-w-7xl mx-auto">
<div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-6">
@foreach ($subSpecialties as $sub)
<x-filament::section
class="flex flex-col justify-between border border-gray-300 rounded-2xl shadow-md hover:shadow-lg hover:-translate-y-1 transition duration-300"
icon="heroicon-o-gift">
<x-slot name="heading">
{{ $sub->name }}
</x-slot>
<x-slot name="headerEnd">
<div class="flex flex-col items-start">
<span class="text-lg font-bold text-yellow-400">
{{ $sub->amount ?? '0' }}
</span>
</div>
</x-slot>
<div class="text-gray-500 mt-2">
kikikikkooo
</div>
</x-filament::section>
@endforeach
</div>
</div>
<div class="p-4 max-w-7xl mx-auto">
<div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-6">
@foreach ($subSpecialties as $sub)
<x-filament::section
class="flex flex-col justify-between border border-gray-300 rounded-2xl shadow-md hover:shadow-lg hover:-translate-y-1 transition duration-300"
icon="heroicon-o-gift">
<x-slot name="heading">
{{ $sub->name }}
</x-slot>
<x-slot name="headerEnd">
<div class="flex flex-col items-start">
<span class="text-lg font-bold text-yellow-400">
{{ $sub->amount ?? '0' }}
</span>
</div>
</x-slot>
<div class="text-gray-500 mt-2">
kikikikkooo
</div>
</x-filament::section>
@endforeach
</div>
</div>
