@extends('academia.dashboard')

@section('content')

@if($banner->count())
<div class="mb-3 ms-n3 me-n3">
    <div class="swiper slider-academia">
        <div class="swiper-wrapper">
        
         @for($i=0; $i<$banner->count(); $i++)
         <div class="swiper-slide">
             <img src="{{ asset('anuncios/banner/'.$banner[$i]->imagen) }}" class="swiper-gl-image">
         </div>
         @endfor


        </div>
    </div>
</div>
@endif


<div class="row mt-4">
    <div class="col-12">
        <div class="d-flex justify-content-center">
            <div class="col-md-11 col-12">
                
                <div class="col-12">
                    <div class="row">

                        @foreach($blog as $blo)
                            <div class="col-md-3 col-12 mb-4">
                                <div class="card">
                                                
                                    <img src="{{ asset('recursos/blog/'.$blo->imagen) }}" class="card-img-top">
                                                
                                    <div class="card-body">
                                    
                                        <h4 class="text-dark text-truncate fw-bold"> {{$blo->titulo}} </h4>   
                                        <h6 class="text-secondary mt-2 mb-2">{!! $blo->text_corto !!}</h6>
                                        <a href="{{ route('academia-blog-anuncio', ['id' => $blo->id]) }}" class="fw-bold">
                                        	Leer más <i class="fa-solid fa-arrow-right ms-1"></i>
                                        </a>
                                                
                                    </div>
                                                
                                </div>
                            </div>
                        @endforeach

                    </div>    
                </div>

            </div>
        </div>
    </div>
</div>            	

@endsection 


@push('script')
<script type="text/javascript">
    
const swiper2 = new Swiper('.slider-academia', {
  modules: [SwiperGL],
  speed: 1000,
  effect: 'gl',
  loop: true,
  gl: {
    shader: 'random',
  },
  autoplay: {
        delay: 2500,
        disableOnInteraction: false,
      },
  navigation: {
    prevEl: '.swiper-button-prev',
    nextEl: '.swiper-button-next',
  },
});

</script>
@endpush