@extends('template.portal.layout')
@section('content-body')
    <div class="portlet light">
        <div class="portlet-title">
            <h3 class="titulo-default text-center"> Directorio </h3>
        </div>
        <div class="portlet-body">
            @if(!empty($autoridades) && count($autoridades) > 0)
            <div class="directorio-container" style="max-width: 900px; margin: 0 auto;">
                <div class="row">
                    @foreach($autoridades as $autoridad)
                        <div class="col-lg-6">
                            <div style="display: flex; padding-top:20px">
                                <div style="max-width:120px; width: 100%; overflow:hidden;margin-right: 15px; flex-shrink: 0;">
                                    <img src="{{ asset($autoridad['urlimagen']) }}"  style="width:100%;">
                                </div>
                                <div>
                                    <div class="autoridad nombre">{{ $autoridad['nombre'] }}</div>
                                    <div class="autoridad cargo">{{ $autoridad['cargo'] }}</div>
                                    <div class="dot-ellipsis dot-height-60">
                                        <p style="font-size: 15px;text-align: justify;margin-bottom:0">{{ $autoridad['descripcion'] }}</p>
                                    </div>
                                    <a href="{{ url('directorio/detalle',['id' => $autoridad['slug']]) }}" style="font-size: 16px">Leer m&aacute;s >></a>
                                </div>
                            </div>
                        </div>
                    @endforeach
                    <div class="text-center">
                        {{ $autoridades->links() }}
                    </div>
                </div>
            </div>
            @else
                <label class="no-existen">No existen autoridades</label>
            @endif
        </div>
    </div>
@endsection