@extends('template')

@section('content')
    <div class="container pt-5 inter h-screen">
        <div class="box mt-5 p-lg-5 p-3">
            <h1 class="text-green-dark">Club Olahraga</h1>
            <div class="wrapper-wrap center" style="justify-content:center  ">
                @foreach ($olga as $item)
                    <div class="card  p-3 box center h-100 m-3 column-sm" style="flex-direction: row; width:450px; ">
                        <div>
                            <p class="text-green">Club</p>
                            <h5 class="text-green-dark">{{ $item->name }}</h5>
                            <p style="font-size:12px; " class="text-green ">{{ $item->club->deskripsi }}</p>
                        </div>
                        <div>

                            <img class="box-photo m-3" src="{{ asset('images/' . $item->photo) }}" alt="">
                        </div>

                    </div>
                @endforeach
            </div>

            <div class="center">

                {{ $olga->links('pagination::bootstrap-4') }}
            </div>
        </div>
    </div>
@endsection