add responsive table
This commit is contained in:
@@ -17,18 +17,25 @@
|
||||
<x-ui.table>
|
||||
<x-slot:header>
|
||||
<th>Title</th>
|
||||
<th>Status</th>
|
||||
<th>Location</th>
|
||||
<th>Starts</th>
|
||||
<th class="hidden lg:table-cell">Status</th>
|
||||
<th class="hidden lg:table-cell">Location</th>
|
||||
<th class="hidden md:table-cell">Starts</th>
|
||||
<th>Action</th>
|
||||
</x-slot:header>
|
||||
<x-slot:body>
|
||||
@foreach ($workshops as $workshop)
|
||||
<tr>
|
||||
<td>{{ $workshop->title }}</td>
|
||||
<td>{{ ucwords($workshop->status) }}</td>
|
||||
<td>{{ $workshop->location->name }}</td>
|
||||
<td>{{ \Carbon\Carbon::parse($workshop->starts_at)->format('M j Y, g:i a') }}</td>
|
||||
<td class="flex items-center">
|
||||
<img src="{{ $workshop->hero->thumbnail }}" class="max-h-12 max-w-12 -ml-2 -my-3 mr-3 inline rounded" alt="{{ $workshop->hero->title }}" />
|
||||
<div>
|
||||
<div class="whitespace-normal">{{ $workshop->title }}</div>
|
||||
<div class="lg:hidden text-xs text-gray-500">{{ $workshop->location->name }} ({{ ucwords($workshop->status) }})</div>
|
||||
<div class="md:hidden text-xs text-gray-500">{{ \Carbon\Carbon::parse($workshop->starts_at)->format('j/m/Y g:i a') }}</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="hidden lg:table-cell">{{ ucwords($workshop->status) }}</td>
|
||||
<td class="hidden lg:table-cell">{{ $workshop->location->name }}</td>
|
||||
<td class="hidden md:table-cell">{{ \Carbon\Carbon::parse($workshop->starts_at)->format('M j Y, g:i a') }}</td>
|
||||
<td>
|
||||
<div class="flex justify-center gap-3">
|
||||
<a href="{{ route('admin.workshop.edit', $workshop) }}" class="hover:text-primary-color"><i class="fa-solid fa-pen-to-square"></i></a>
|
||||
|
||||
Reference in New Issue
Block a user