@extends('front.app')
@section('content')
    <link href="https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.core.css" rel="stylesheet">
    <section class="wrapper">
        <div class="container pt-6 pb-14 pb-md-0">
            <h1 class="display-5 mx-md-n5 mx-lg-0 mb-3 text-center">
                {{ @$page->title }}
            </h1>

            <div class="mt-1 ql-editor">
                {!! @$page->content !!}
            </div>

            @if(isset($employees) && $employees->isNotEmpty())
                <h3 class=" mx-md-n5 mx-lg-0 mb-3 text-center mt-6">{{ trans('module.despre_noi_text_bottom') }}</h3>

                <div class="d-flex flex-wrap gap-3 justify-content-center consilieriCards mb-10">
                    @foreach ($employees as $employee)
                        <a href="{{ url('despre-noi/angajatii-primariei') }}?name={{ urlencode($employee->name) }}">
                            <div class="card justify-between cardConsilieri ">
                                @if ($employee->image_id)
                                    <img class="card-img-top" src="{{ asset($employee->image->original) }}" alt="{{ asset('front/img/consilieri/no-poza.gif')}}">
                                @else
                                    <img class="card-img-top" src="{{ asset('front/img/consilieri/no-poza.gif') }}">
                                @endif

                                <div class="card-body p-2">
                                    <h5 class="card-title">{{ $employee->name }}</h5>
                                    <p style="color: #343f52;" class="card-text text-center">{{ $employee->work_type }}</p>
                                </div>
                            </div>
                        </a>
                    @endforeach
                </div>
            @endif
        </div>
    </section>
@endsection