@extends('layouts.app')
@section('content')
    <!-- Main Container -->
    <main id="main-container">
        <!-- Hero -->
        <div class="bg-image" style="background-image: url('{{asset(\Illuminate\Support\Facades\Storage::url('profile_image/'.\App\Setting::first()->profile_image))}}');">
            <div class="bg-black-50">
                <div class="content content-top content-full text-center">
                    <h1 class=" text-white mb-1 py-5 text-white text-center"><span class="text-primary">{{$word}}</span></h1>
                </div>
            </div>
        </div>
        <!-- END Hero -->

        <!-- Page Content -->
        <div class="content content-full">
            <div class="row items-push row-deck">
                @foreach($data as $class)
                    <div class="col-md-4 animated fadeIn" role="button">
                        <a href="{{route('website.subjects.show',[$class->stage_class_id,$class->id])}}">
                            <div class="options-container fx-item-zoom-in fx-overlay-slide-left">
                                <img class="img-fluid options-item" src="{{asset($class->image)}}" alt="{{$class->name}}">
                                <div class="options-overlay bg-black-90">
                                    <div class="options-overlay-content">
                                        <h2 class="text-primary mb-2">{{$class->name}}</h2>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </div>
                @endforeach
            </div>

            <!-- Pagination -->
        {{--        {{ $data->links() }}--}}
        <!-- END Pagination -->
        </div>
        <!-- END Page Content -->
    </main>
@endsection