@extends('layouts.user')

@section('title', 'Edukasi')

@section('content')


<form method="GET" action="{{ route('user.edukasi') }}" class="mb-4">
    <div class="input-group">
        <input type="text" 
               name="search" 
               class="form-control" 
               placeholder="Cari edukasi..."
               value="{{ request('search') }}">
        <button class="btn btn-primary">Cari</button>
    </div>
</form>

<div class="row">

    @forelse($edukasis as $e)
    <div class="col-md-4 mb-4">
        <div class="card shadow-sm h-100">

           
            @if($e->gambar)
                <img src="{{ asset('uploads/'.$e->gambar) }}" 
                     class="card-img-top" 
                     style="height:200px; object-fit:cover;">
            @endif

            <div class="card-body d-flex flex-column">
                <h5>{!! $e->judul !!}</h5>

                <p class="text-muted flex-grow-1">
                    {!! \Illuminate\Support\Str::limit($e->isi, 120) !!}
                </p>

                <a href="{{ route('user.edukasi.detail', $e->id) }}" 
                   class="btn btn-primary btn-sm">
                    Baca Selengkapnya
                </a>
            </div>

        </div>
    </div>

    @empty
        
        <div class="col-12">
            <div class="alert alert-info text-center">
                Edukasi tidak ditemukan.
            </div>
        </div>
    @endforelse

</div>

@endsection