fix: perbaiki navigasi mobile — semua menu tetap inline seperti referensi
This commit is contained in:
@@ -1,36 +1,44 @@
|
||||
@extends('public.layout')
|
||||
|
||||
@section('title', 'Kegiatan')
|
||||
|
||||
@section('content')
|
||||
|
||||
<h1 class="text-3xl font-bold mb-2">Kegiatan</h1>
|
||||
<p class="text-gray-500 mb-10">Dokumentasi kegiatan organisasi Persegi</p>
|
||||
<section class="max-w-6xl mx-auto px-6 py-24">
|
||||
<p class="text-xs font-semibold text-gray-400 uppercase tracking-widest mb-4 flex items-center gap-2">
|
||||
<span class="w-4 h-px bg-gray-400 inline-block"></span> Kegiatan
|
||||
</p>
|
||||
<h1 class="text-5xl font-bold mb-16">Semua kegiatan</h1>
|
||||
|
||||
<div class="grid md:grid-cols-3 gap-6">
|
||||
@forelse($kegiatan as $item)
|
||||
<a href="{{ route('kegiatan.detail', $item) }}" class="bg-white rounded-xl shadow hover:shadow-md transition p-5 block">
|
||||
<div class="text-xs text-green-600 font-semibold mb-1">
|
||||
{{ $item->start_date->format('d M Y') }}
|
||||
@if($item->start_date->ne($item->end_date))
|
||||
— {{ $item->end_date->format('d M Y') }}
|
||||
@endif
|
||||
</div>
|
||||
<h3 class="font-bold text-gray-800 mb-2">{{ $item->title }}</h3>
|
||||
<p class="text-sm text-gray-500 line-clamp-3">{{ $item->description }}</p>
|
||||
@if($item->executed_at)
|
||||
<span class="mt-3 inline-block text-xs bg-green-100 text-green-700 px-2 py-1 rounded-full">Terlaksana</span>
|
||||
@else
|
||||
<span class="mt-3 inline-block text-xs bg-yellow-100 text-yellow-700 px-2 py-1 rounded-full">Akan Datang</span>
|
||||
@endif
|
||||
</a>
|
||||
@empty
|
||||
<p class="text-gray-400 col-span-3">Belum ada kegiatan.</p>
|
||||
@endforelse
|
||||
</div>
|
||||
<div class="grid md:grid-cols-3 gap-6">
|
||||
@forelse($kegiatan as $item)
|
||||
<a href="{{ route('kegiatan.detail', $item) }}" class="group border border-gray-100 rounded-xl overflow-hidden hover:border-gray-300 transition">
|
||||
<div class="bg-gray-900 p-6 font-mono text-xs text-green-400 leading-relaxed">
|
||||
<div class="flex gap-1 mb-3">
|
||||
<span class="w-2 h-2 rounded-full bg-red-500"></span>
|
||||
<span class="w-2 h-2 rounded-full bg-yellow-500"></span>
|
||||
<span class="w-2 h-2 rounded-full bg-green-500"></span>
|
||||
</div>
|
||||
<p class="text-gray-500">// {{ $item->start_date->format('d M Y') }}</p>
|
||||
<p class="text-white mt-1 line-clamp-2">{{ $item->title }}</p>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<h3 class="font-bold mb-2 group-hover:underline underline-offset-2">{{ $item->title }}</h3>
|
||||
<p class="text-sm text-gray-500 line-clamp-2">{{ $item->description }}</p>
|
||||
<div class="flex items-center justify-between mt-3">
|
||||
@if($item->executed_at)
|
||||
<span class="text-xs bg-gray-100 text-gray-600 px-2 py-0.5 rounded-full">Terlaksana</span>
|
||||
@else
|
||||
<span class="text-xs bg-gray-100 text-gray-600 px-2 py-0.5 rounded-full">Akan datang</span>
|
||||
@endif
|
||||
<span class="text-xs text-gray-400">see more →</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@empty
|
||||
<p class="text-gray-400 col-span-3">Belum ada kegiatan.</p>
|
||||
@endforelse
|
||||
</div>
|
||||
|
||||
<div class="mt-10">
|
||||
{{ $kegiatan->links() }}
|
||||
</div>
|
||||
<div class="mt-12">{{ $kegiatan->links() }}</div>
|
||||
</section>
|
||||
|
||||
@endsection
|
||||
|
||||
Reference in New Issue
Block a user