@extends('layout.landing')
@section('title', 'Krojač Biznis | Novosti iz Krojačeve škole i sveta eLearninga')
@section('html-class')
    class="landing-page"
@endsection

@section('content')
<div class="page-wrapper">
    <!-- header-not-logged-in -->
    @include('front.partials.landing._header-not-logged-in')
    <!-- container end -->
    @include('front.partials.novosti._landing-top-section')
    
    <!-- listing-content-section -->
    <div class="listing-content-section">
        <div class="container">
            @if($posts->total() == 0)
                <div class="row py-5">
                    <div class="col-lg-10 offset-lg-1">
                        <div class="no-enrolled-courses">
                            <h1>Trenutno nema objava</h1>
                            <!-- button-holder end -->
                        </div>
                        <!-- no-enrolled-courses end -->
                    </div>
                    <!-- cole end -->
                </div>
                <!-- row end -->
            @endif
            @if($posts->total() > 0)
                <div class="row">
                    <div class="col-12">
                        <div class="row gx-lg-5">
                            @foreach ($posts as $post)
                                <!-- listing-item -->
                                @include('front.partials.novosti._listing-item-box')
                                <!-- listing-item end -->
                            @endforeach
    
                            @include('front.novosti._index-pagination')
                            
                        </div>
                        <!-- row end -->
                    </div>
                    <!-- col end -->
                </div>
                <!-- row end -->
            @endif
        </div>
        <!-- container end -->
    </div>
    <!-- listing-content-section end -->
    
    <!-- landing-bottom-section -->
    @include('front.partials.landing._bottom-section')
    <!-- landing-bottom-section end -->
    @include('front-inc._footer')
    

</div>

@endsection

@section('add-scripts')
    @parent
    <script>
        const setPerPageElement = document.querySelectorAll('.selectShowItems');
        setPerPageElement.forEach((setPerPage) => {
            setPerPage.addEventListener('change', (e) => {
                const perPage = e.target.value;

                const params = route().params;
                params.page = 1;
                params.perPage = perPage;

                window.location = route(route().current(), params);
            });
        });
    </script>
@endsection