@extends("web.layout.layout")

@section("contenido")

    <main>

        <!-- page title area start -->
        <section class="page__title-area pt-120 pb-90">
            <div class="page__title-shape">
                <img class="page-title-shape-5 d-none d-sm-block" src="assets/img/page-title/page-title-shape-1.png" alt="">
                <img class="page-title-shape-6" src="assets/img/page-title/page-title-shape-6.png" alt="">
                <img class="page-title-shape-7" src="assets/img/page-title/page-title-shape-4.png" alt="">
            </div>
            <div class="container">
                <div class="row">
                    <div class="col-xxl-8 col-xl-8 col-lg-8">
                        <div class="course__wrapper">
                            <div class="page__title-content mb-25">
                                <div class="page__title-breadcrumb">
                                    <nav aria-label="breadcrumb">
                                        <ol class="breadcrumb">
                                            <li class="breadcrumb-item"><a href="{{route("pagina.index")}}">Inicio</a></li>
                                            <li class="breadcrumb-item"><a href="{{route("pagina.circulares")}}">Circulares</a></li>
                                            <li class="breadcrumb-item active" aria-current="page">{{$circular->titulo}}</li>
                                        </ol>
                                    </nav>
                                </div>
                                <span class="page__title-pre">Circular</span>
                            </div>
                            <div class="course__meta-2 d-sm-flex mb-30">
                                <div class="course__teacher-3 d-flex align-items-center mr-70 mb-30">
                                    <div class="course__teacher-thumb-3 mr-15">
                                        <img src="../../logo.png" alt="">
                                    </div>
                                </div>
                                <div class="course__update mr-80 mb-30">
                                    <h5>Fecha:</h5>
                                    <p>{{date("d-m-Y",strtotime($circular->fecha))}}</p>
                                </div>
                            </div>

                            <div class="course__description">
                                <h3>{{$circular->titulo}}</h3>
                                <p style="text-align: justify">{{$circular->descripcion}}</p>

                            </div>

                        </div>
                    </div>
                    <div class="col-xxl-4 col-xl-4 col-lg-4">
                        <div class="course__sidebar pl-70 p-relative">
                            <div class="course__shape">
                                <img class="course-dot" src="assets/img/course/course-dot.png" alt="">
                            </div>

                            <div class="course__sidebar-widget-2 white-bg mb-20">
                                <div class="course__sidebar-course">
                                    <h3 class="course__sidebar-title">Adjuntos</h3>
                                    <ul>
                                        @foreach($circular->media as $media)
                                            <li>
                                                <div class="course__sm d-flex align-items-center mb-30">
                                                    <div class="course__sm-thumb mr-20">
                                                        <a href="{{$media->original_url}}">
                                                            <i class="fas fa-file"></i>
                                                        </a>
                                                    </div>
                                                    <div class="course__sm-content">
                                                        <small><a target="_blank" href="{{$media->original_url}}">{{ \Illuminate\Support\Str::limit($media->file_name, 20, '...') }}</a></small>
                                                    </div>
                                                </div>
                                            </li>
                                        @endforeach
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- page title area end -->




    </main>
@endsection