@extends('layouts.pagina')
@section('css')
<link rel="stylesheet" href="{{ asset('css/comunicados.css') }}">

@endsection
@section('head')
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@endsection
@section('contenido')
<div class="container-xl" >
    <div class="reglon">
        <h3 class="titulo mt-4">Comunicados</h3>  
    </div>
    <div class="row row-cards">
        @foreach($comunicados as $comunicado)
            <div class="col-sm-6 col-lg-4">
                <a href="{{url('/comunicado/'.$comunicado->id)}}">
                    <div class="card card-sm comunicado" style="background-image:linear-gradient( to bottom, rgb(8 18 13 / 50%), rgb(7 7 49 / 50%) ), url('{{$comunicado->ruta}}')">                                       
                        <div class="card-body">
                            <div style="text-align: center;width: 100%;color: white;">
                                <h2 style="bottom: 25px;position: absolute;width: 100%;">{{$comunicado->titulo}}</h2>
                            </div>
                        </div>
                    </div>
                </a>
            </div>
        @endforeach
    </div>
</div>
@endsection