{% extends 'base.html.twig' %}

{% block title %}{{ cms_page.name }} | {{ parent() }}{% endblock %}

{% block body %}
<div class="breadcrumb-area">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="row breadcrumb_box  align-items-center">
                    <div class="col-lg-6 col-md-6 col-sm-12 text-center text-md-left">
                        <h2 class="breadcrumb-title">Blog</h2>
                    </div>
                    <div class="col-lg-6  col-md-6 col-sm-12">
                        <!-- breadcrumb-list start -->
                        <ul class="breadcrumb-list text-center text-md-right">
                            <li class="breadcrumb-item"><a href="{{ path('default')}}">Accueil</a></li>
                            <li class="breadcrumb-item active">{{ cms_page.name }}</li>
                        </ul>
                        <!-- breadcrumb-list end -->
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="blog-grid pb-100px pt-100px main-blog-page single-blog-page">
    <div class="container">
        <div class="row">
            <div class="col-lg-9 col-md-12">
                <div class="blog-posts ">
                    <div class="single-blog-post blog-grid-post">
                        <div class="blog-post-media">
                            <div class="blog-image single-blog" data-aos="fade-up" data-aos-delay="200">
                                <img src="{{ vich_uploader_asset(cms_page, 'coverImageFile') }}" alt="blog" />
                            </div>
                        </div>
                        <div class="blog-post-content-inner mt-6" data-aos="fade-up" data-aos-delay="200">
                            <div class="blog-athor-date">
                                <a class="blog-date" href="#">{{ cms_page.createdAt|date('d/m/Y') }}</a>
                            </div>
                            <h4 class="blog-title"><a href="{{ path('page_show', {'code': cms_page.code})}}">{{ cms_page.name }}</a></h4>
                            <p>
                                {{ cms_page.description }}
                            </p>
                        </div>
                        <div class="single-post-content">
                            {{ cms_page.content|raw }}
                        </div>
                    </div>
                    <!-- single blog post -->
                </div>
                <div class="blog-single-tags-share d-sm-flex justify-content-between">
                    <div class="blog-single-share d-flex" data-aos="fade-up" data-aos-delay="200">
                        <span class="title">Share:</span>
                        <ul class="social">
                            <li>
                                <a href="#"><i class="icon-social-facebook"></i></a>
                            </li>
                            <li>
                                <a href="#"><i class="icon-social-twitter"></i></a>
                            </li>
                            <li>
                                <a href="#"><i class="icon-social-google"></i></a>
                            </li>
                            <li>
                                <a href="#"><i class="icon-social-instagram"></i></a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- Sidebar Area Start -->
            <div class="col-lg-3 col-md-12  mt-md-50px mt-lm-50px" data-aos="fade-up" data-aos-delay="200">
                <div class="left-sidebar shop-sidebar-wrap">
                    <!-- Sidebar single item -->
                    <div class="sidebar-widget">
                        <h3 class="sidebar-title mt-0">Rechercher</h3>
                        <div class="search-widget">
                            <form action="#">
                                <input placeholder="Parcourez le magasin entier ici ..." type="text" />
                                <button type="submit"><i class="icon-magnifier"></i></button>
                            </form>
                        </div>
                    </div>
                    <!-- Sidebar single item -->
                    <div class="sidebar-widget mt-40px">
                        <h3 class="sidebar-title">Post récent</h3>

                        <div class="recent-post-widget">
                            {% for page in section_blog.cmsPages|slice(0,7) %}
                                <div class="recent-single-post d-flex">
                                    <div class="thumb-side">
                                        <a href="{{ path('page_show', {'code': page.code})}}"><img src="{{ vich_uploader_asset(page, 'imageFile') }}" alt="" /></a>
                                    </div>
                                    <div class="media-side">
                                        <h5>
                                            <a href="{{ path('page_show', {'code': page.code})}}">{{ page.name }}</a>
                                        </h5>
                                        <span class="date">{{ page.createdAt|date('d/m/Y') }}</span>
                                    </div>
                                </div>
                            {% endfor %}
                        </div>
                    </div>
                    <!-- Sidebar single item -->
                </div>
            </div>
            <!-- Sidebar Area End -->
        </div>
    </div>
</div>
{% endblock %}