@include('components.seo')
<div class="space-y-8">
    <x-client.breadcrumbs :breadcrumb="$breadcrumb"/>
    <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-4 ">
        @foreach($datas as $data)
            <a href="{{route('index.golden-tip' , $data->slug)}}"
               class="relative overflow-hidden rounded-md shadow shadow-amber-400">
                <img
                    class="transition ease-in-out delay-150  hover:-translate-y-1 hover:scale-110  duration-300"
                    src="{{$data->avatar}}" alt="{{$data->name}}">
                <div class="absolute bottom-0 rounded-t-xl p-2 text-gray-50  backdrop-blur-xl w-full">
                    <h2>{{$data->name}}</h2>
                </div>
            </a>
        @endforeach
    </div>

    {{$datas->links()}}
</div>