@extends("vitrines.base");
@php
    $header = htmlHeader("","","","");
@endphp
@section('content')

<div class="page-wrapper">

    <!-- Preloader -->
    <div class="preloader"></div>
    <!-- Header span -->

    <!-- News Section -->
    <section class="news-section">
        <div class="anim-icons">
            <span class="icon icon-circle-blue wow fadeIn"></span>
            <span class="icon twist-line-1 wow zoomIn"></span>
            <span class="icon twist-line-2 wow zoomIn"></span>
            <span class="icon twist-line-3 wow zoomIn"></span>
        </div>

        <div class="auto-container">
            <div class="sec-title text-center">
                <span class="title">Choisi et vote pour ton candidat !</span>
                <h2>Les candidat(e)s</h2>
            </div>


            <!--Comment Form-->
            <div class="comment-form" style="padding: 0px 0px 30px;">
                 <div class="group-title">
                            <h3>La description du vote ici</h3>
                        </div>
                <form method="post" >
                    <div class="row clearfix">
                        <div class="col-lg-3 col-md-3 col-sm-12 form-group">
                            <input type="text" name="username" placeholder="Recherche par mot clé">
                        </div>
                        <div class="col-lg-2 col-md-3 col-sm-12 form-group">
                            <select name="pays" id="">
                                <option selected="" disabled="">Pays</option>
                                @foreach (config("app.countries") as $country)
                                    <option value="{{ $country }}">{{ $country }}</option>
                                @endforeach
                            </select>
                        </div>

                        <div class="col-lg-2 col-md-3 col-sm-12 form-group">
                            <input type="date" name="email" placeholder="Email">
                        </div>

                        <div class="col-lg-2 col-md-3 col-sm-12 form-group">
                            <button class="theme-btn btn-style-one" type="submit" name="submit-form"><span
                                    class="btn-title">Rechercher</span></button>
                        </div>
                    </div>
                </form>
            </div>

            <div class="row">
                @foreach ($candidates as $candidat)
                    <div class="news-block col-lg-4 col-md-4 col-sm-12 wow fadeInRight pricing-block-two">
                        <div class="inner-box">
                            <div class="price-box">
                                <h4 class="price">{{ $candidat->name }}</h4>
                            </div>
                            <div class="image-box" style="max-height: 425px; overflow:clip">
                                <figure class="image"><a href="{{ route("App#OneCandidate",$candidat->link) }}"><img src="{{ $candidat->photo }}" alt="{{ $candidat->name }}"></a></figure>
                            </div>
                            <div class="lower-content">
                                <ul class="post-info">
                                    {{-- <li><span class="far fa-calendar"></span> 5 Nov 2022</li>
                                    <li><span class="far fa-map"></span> Cotonou</li>
                                    <li><span class="far fa-user"></span> 100 cfa </li> --}}
                                    {{-- Numéro et nombre de votes --}}
                                    <li><i class="fa-solid fa-box-ballot"></i> <h3>{{ $candidat->nbr_vote }} votes</h3> </li>
                                </ul>
                                <h4><a href="#">Candidat(e) N°{{ $candidat->num_candidat }}</a></h4>
                                <div class="btn-box">
                                    <a href="{{ route("App#OneCandidate",$candidat->link) }}" class="read-more">Voter</a>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </section>
    <!--End News Section -->


</div>
<!--End pagewrapper-->

@endsection