{% extends 'front.html.twig' %}
{% block title %}{{ 'page.new.detail.title' |trans }} {% endblock %}
{% block stytesheets %}
    {{ parent() }}
{% endblock %}
{% block body %}
    <!-- breadcrumb area start -->
    <section class="breadcrumb-area" id="home">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="breadcrumb-area-content">
                        <h2>{{ new.title }}</h2>
                        <ul>
                            <li><a href="{{ path('front_home') }}">{{ 'title.Ac' |trans }}</a></li>
                            <li><a href="{{ path('news_front') }}">{{ 'page.new.detail.title2'|trans }}</a></li>
                            <li class="active"><a href="#">{{ 'title.detail'|trans }}</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="ptb-100">
        <div class="container">
            <div class="row">
                <div class="col-lg-8">
                    <div class="blog-details">
                        <div class="row">
                            <div class="col-lg-12">
                                <!-- hero area start -->
                                <section style="margin-top: -20px;" id="home">
                                    <div id="carouselExampleIndicators2" class="carousel slide" data-ride="carousel">
                                        <div class="carousel-inner">

                                            {% if galleries < 1 %}
                                                <img class="d-block w-100"
                                                     src="{{ asset('uploads/galleries/emptyImage.png') }}"
                                                     alt="First slide"
                                                     style="width: 100%; height: 540px; object-fit: cover;">
                                            {% else %}
                                                {% for gallery in new.gallerie %}
                                                    <div class="carousel-item {% if loop.index == 1 %}active{% endif %}">
                                                        {#                                                    {% if new.gallerie|length <1 %}#}
                                                        {% if galleries <1 %}
                                                            <img class="d-block w-100"
                                                                 src="{{ asset('uploads/galleries/emptyImage.png') }}"
                                                                 alt="First slide"
                                                                 style="width: 100%; height: 540px; object-fit: cover;">
                                                        {% else %}

                                                            <img class="d-block w-100"
                                                                 src="{{ asset('uploads/galleries/'~gallery.path) }}"
                                                                 alt="First slide"
                                                                 style="width: 100%; height: 540px; object-fit: cover;">


                                                        {% endif %}
                                                    </div>
                                                {% endfor %}
                                            {% endif %}

                                        </div>
                                        <a class="carousel-control-prev" href="#carouselExampleIndicators2"
                                           role="button" data-slide="prev">
                                            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                            <span class="sr-only">Previous</span>
                                        </a>
                                        <a class="carousel-control-next" href="#carouselExampleIndicators2"
                                           role="button" data-slide="next">
                                            <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                            <span class="sr-only">Next</span>
                                        </a>
                                    </div>
                                </section>
                                <ol class="carousel-indicators" style="margin-top: 10px;position: unset;">
                                    {% if galleries >0%}
                                        {% for gallery in new.gallerie %}
                                            <li data-target="#carouselExampleIndicators2" data-slide-to="{{ loop.index - 1 }}"
                                                {% if loop.index == 1 %}class="active"{% endif %} style="width: 70px;height: auto;">
                                                <img class="d-block w-100 img-fluid" src="{{ asset('uploads/galleries/'~gallery.path) }}" style="height: 39px;">
                                            </li>
                                        {% endfor %}
                                    {% endif %}
                                </ol>
                                <!-- hero area end -->
                            </div>
                        </div>
                        {% if app.request.locale == 'ar' %}

                            <a href="{{ path('news_front_detail',{'token':new.token}) }}">
                                <h4 class="widget-rtl post-title ">{{ new.title }}</h4></a>
                            <div class="widget-rtl post-author">
                                <a href="#"><i class="icofont icofont-user"></i>{{ new.category.name }}</a>
                                <a href="#"><i
                                            class="icofont icofont-sunny-day-temp"></i>{{ new.createdAt|date('d-m-Y') }}
                                </a>     <p>
                                    {{ new.content|raw }}
                                </p>
                            </div>


                        {% else %}

                            <a href="{{ path('news_front_detail',{'token':new.token}) }}"><h4
                                        class="post-title">{{ new.title }}</h4></a>
                            <div class="post-author">
                                <a href="#"><i class="icofont icofont-user"></i>{{ new.category.name }}</a>
                                <a href="#"><i class="icofont icofont-sunny-day-temp"></i>{{ new.createdAt|date('d-m-Y') }}
                                </a>
                            </div>
                            <p style="text-align: justify">{{ new.content|raw }}</p>
                        {% endif %}

                        <!-- Social media -->
                        <div class="row">
                            <div class="col-sm-12 col-md-12 col-lg-12">
                                <button class="btn theme-btn theme-btn8 share_facebook" data-url="{{ app.request.schemeAndHttpHost ~ app.request.requestUri }}" style="background-color: #1a468d;">
                                    {{ 'social.media.partager' | trans }} <i class="icofont icofont-social-facebook"></i>
                                </button>
                                <button class="btn theme-btn theme-btn8 share_twitter" data-url="{{ app.request.schemeAndHttpHost ~ app.request.requestUri }}" style="background-color: rgb(29, 161, 242);">
                                    {{ 'social.media.partager' | trans }} <i class="icofont icofont-social-twitter"></i>
                                </button>
                            </div>
                        </div>
                    </div>
                </div>


                <div class="col-lg-4">
                    <div class="sidebar">
                        <div class="sidebar-widget">
                            {% if app.request.locale == 'ar' %}

                                <h4 class="widget-rtl">{{ 'page.index.new1' |trans }} {{ 'page.index.new2' | trans }}</h4>
                                {% for new in news %}
                                    <div class="widget-post">


                                        <div class="widget-post-img">
                                            {% if new.gallerie|length <1 %}
                                                <a href="{{ path('news_front_detail',{'token':new.token}) }}">
                                                    <img src="{{ asset('uploads/galleries/emptyImage.png') }}"
                                                         alt="News"></a>
                                            {% else %}
                                                {% for gallery in new.gallerie %}
                                                    {% if loop.index == 1 %}
                                                        <a href="{{ path('news_front_detail',{'token':new.token}) }}">
                                                            <img src="{{ asset('uploads/galleries/'~gallery.path) }}"
                                                                 alt="widget"
                                                                 style="width: 100%; object-fit: cover; height: 56px;">
                                                        </a>
                                                    {% endif %}
                                                {% endfor %}
                                            {% endif %}
                                        </div>
                                        <div class="widget-post-info widget-rtl">
                                            <p class="padding-right"><a href="{{ path('news_front_detail',{'token':new.token}) }}" style="font-weight: 600; font-size: 14px;">{{ new.title }} </a></p>
                                            <span class="styleDAte"><i class="icofont icofont-calendar"></i> {{ new.createdAt|date('d m Y') }}</span>
                                        </div>
                                    </div>
                                {% endfor %}
                            {% else %}

                                <h4>{{ 'page.index.new1' |trans }} {{ 'page.index.new2' | trans }}</h4>
                                {% for new in news %}
                                    <div class="widget-post">
                                        <div class="widget-post-img">
                                            {% if new.gallerie|length <1 %}
                                                <a href="{{ path('news_front_detail',{'token':new.token}) }}">
                                                    <img class="imgNewsFrontDetail" src="{{ asset('uploads/galleries/emptyImage.png') }}"
                                                         alt="News"></a>
                                            {% else %}
                                                {% for gallery in new.gallerie %}
                                                    {% if loop.index == 1 %}
                                                        <a href="{{ path('news_front_detail',{'token':new.token}) }}">
                                                            <img class="imgNewsFrontDetail" src="{{ asset('uploads/galleries/'~gallery.path) }}"
                                                                 alt="widget">
                                                        </a>
                                                    {% endif %}
                                                {% endfor %}
                                            {% endif %}
                                        </div>
                                        <div class="widget-post-info">
                                            <p><a href="{{ path('news_front_detail',{'token':new.token}) }}"
                                                  style="font-weight: 600; font-size: 14px;">{{ new.title }}</a></p>
                                            <span><i class="icofont icofont-calendar"></i> {{ new.createdAt|date('d m Y') }}</span>
                                        </div>
                                    </div>
                                {% endfor %}
                            {% endif %}





                        </div>
                        {#<div class="sidebar-widget widget-quote">
                            <h4><i class="icofont icofont-book-alt"></i> Request a quote</h4>
                            <p>Get professional guidance for creating and management of successful business.</p>
                            <a href="{{ path('front_contact') }}" class="theme-btn theme-btn6">Contact Us</a>
                        </div>#}
                    </div>
                </div>
            </div>
        </div>
    </section>
{% endblock %}
{% block javascripts %}
    {{ parent() }}
    {% include "@FrontBundle/News/assets.html.twig" %}

    <!-- Social media JS -->
    <script src="{{ asset('js/social_media.js') }}"></script>
{% endblock %}