@extends('backend.layouts.master')
@section('content')
    <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.jssocials/1.4.0/jssocials.css" />

    <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.jssocials/1.4.0/jssocials-theme-minima.css" />

    <script type="text/javascript" src="https://cdn.jsdelivr.net/jquery.jssocials/1.4.0/jssocials.min.js"></script>
    <script src="/front/js/OwlCarousel2-2.2.1/owl.carousel.min.js"></script>

    <!-- SINGLE NOTICIA -->
    <section class="singleNoticia mt-4">
        <!-- #print && container -->
        <div id="print" class="container">
            <!-- ccbreadcrumb -->
            <div class="ccbreadcrumb" data-aos="fade-down">
                <!-- breadcrumb -->
                <ul class="breadcrumb">
                    <li><a href="/">Início /</a></li>
                 
                    <li><a href="/noticias">Todas Notícias /</a></li>
                </ul>
            </div>
<!-- noticia-container -->
<div class="noticia-container d-flex flex-column flex-md-row align-items-start" data-aos="fade-up">
    @if($notice->image)
        <div class="noticia-image me-md-3">
            <a class="fancybox" title="" rel='group1' href="{{$notice->getImage('default')}}">
                <img src="{{$notice->getImage('notice_detail')}}" alt="">
            </a>
            <div class="legenda">Foto:{{$notice->photographer}}</div>
        </div>
    @endif

    <div class="text-dark">
        <h2>{!! $notice->title !!}</h2>
        <div class="noticia-data">{{$notice->date_show}}</div>
          
        <p> {!! $notice->content_long !!} </p>
       

        </div>
    </section>
<!-- galeriaFotos [Bootstrap Carousel] -->
<div class="container mt-5 mb-5">
    <h3 class="mt-3 mb-3">Galeria de fotos</h3>
    <div class="row">
        @foreach($notice->images as $key => $item)
        <div class="col-md-4 mb-4"> <!-- 4 cards por linha em telas médias e maiores -->
            <div class="card">
                <a rel='group1' href="{!! asset("uploads/gallery/$item->id/$item->image") !!}" class="fancybox">
                    <img class="card-img-top" src="{{$item->getImage('notice')}}" alt="Imagem de galeria">
                </a>
            </div>
        </div>
        @endforeach
    </div>
</div>



@endsection