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

{% block title %}{% endblock %}

{% block body %}
    <div class="tab-content">
        <div class="stats flex-row justify-between">
            <div class="stats__item">
                <h4>Actualités publiées</h4>
                <div class="stats__item__number-stat flex-row align-end">
                    <span class="number">3</span>
                    {# <div class="stat stat-up"><img src="{{ asset('images/icons/admin/arrow-up-diagonal.svg') }}" alt=""> + 5%</div>  #}
                </div>
            </div>

            <div class="stats__item">
                <h4>Thématique</h4>
                <div class="stats__item__number-stat flex-row align-end">
                    <span class="number">7</span>
                    {# <div class="stat stat-up"><img src="{{ asset('images/icons/admin/arrow-up-diagonal.svg') }}" alt=""> + 2%</div>  #}
                </div>
            </div>

            <div class="stats__item">
                <h4>Actions mise en place</h4>
                <div class="stats__item__number-stat flex-row align-end">
                    <span class="number">20</span>
                    {# <div class="stat stat-down"><img src="{{ asset('images/icons/admin/arrow-down-diagonal.svg') }}" alt=""> - 12%</div>  #}
                </div>
            </div>
        </div>
        <div class="calendar-wrapper">
            {% include('admin/components/_calendar.html.twig') %}
        </div>

        <div class="pages-list">
            <div class="pages-list__header">
                <h2>Toutes les actions</h2>
            </div>
            <div class="pages-list__body">
                <div class="head-list">
                    <div class="col-5">
                        <span>Nom de l'action</span>
                    </div>
                    <div class="col-5">
                        <span>Dernière modification</span>
                    </div>
                    <div class="col-2">
                        <span>Action</span>
                    </div>
                </div>
                <div class="pages-list__body__list">
                    {% include('admin/pages/_page-list.html.twig') %}
                </div>
            </div>
        </div>
        <!-- End pages list -->

        <!-- Last video -->
        <div class="last-video flex-column" data-controller="swiper-video">
            <div class="title-action flex-row align-center justify-between">
                <h2>Lorem ipsum</h2>
                <a href="">
                    <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <g id="Group 59">
                            <rect id="Rectangle 19" x="0.744659" y="8.1519" width="1.09459" height="13.3131" rx="0.547297" transform="rotate(-90 0.744659 8.1519)" fill="#6A48C8"/>
                            <rect id="Rectangle 20" x="6.83383" y="0.928062" width="1.09459" height="13.3131" rx="0.547297" fill="#6A48C8"/>
                        </g>
                    </svg>
                </a>
            </div>
            <div class="carousel-video swiper">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="video">
                        </div>
                    </div>
                    <div class="swiper-slide">
                    </div>
                </div>
            </div>
        </div>
        <!-- End last video -->

        <!-- Google Analytics -->
        <div class="go-to-analytics flex-column">
            <div class="icon">
                <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <g id="Icons / stats">
                        <path id="Vector" d="M18.3334 18.5417H4.16669C2.67181 18.5417 1.45835 17.3282 1.45835 15.8333V1.66666C1.45835 1.55512 1.55514 1.45833 1.66669 1.45833C1.77824 1.45833 1.87502 1.55512 1.87502 1.66666V15.8333C1.87502 17.0968 2.90324 18.125 4.16669 18.125H18.3334C18.4449 18.125 18.5417 18.2218 18.5417 18.3333C18.5417 18.4449 18.4449 18.5417 18.3334 18.5417Z" fill="black" stroke="#6A48C8" stroke-width="0.833333"/>
                        <path id="Vector_2" d="M12.4415 10.6748V10.675L12.4534 10.6747C12.8688 10.6628 13.2442 10.4719 13.5082 10.1623C13.5084 10.1621 13.5085 10.1619 13.5087 10.1617L17.3316 5.69753C17.4074 5.61157 17.5373 5.5997 17.6286 5.67453C17.7138 5.75094 17.7247 5.88103 17.6488 5.97194C17.6486 5.97223 17.6483 5.97252 17.6481 5.97282L13.8259 10.4361C13.8258 10.4363 13.8256 10.4365 13.8255 10.4366C13.4839 10.8326 12.9931 11.0706 12.4778 11.0917C11.9531 11.1048 11.4423 10.9109 11.0786 10.5477C11.0783 10.5474 11.0781 10.5471 11.0778 10.5469L10.296 9.75677L10.296 9.75677L10.2945 9.75521C10.0048 9.46554 9.61882 9.31341 9.21296 9.32501C8.79752 9.33688 8.42216 9.52776 8.1581 9.83748C8.15796 9.83764 8.15781 9.83781 8.15767 9.83798L4.34103 14.2949C4.2839 14.3528 4.21946 14.3748 4.16654 14.3748C4.11865 14.3748 4.06708 14.3569 4.03058 14.3262C3.94437 14.2499 3.93299 14.119 4.00928 14.0277C4.00952 14.0274 4.00975 14.0272 4.00999 14.0269L7.83213 9.56356C7.83228 9.56339 7.83243 9.56322 7.83258 9.56304C8.17414 9.16712 8.66494 8.92907 9.18023 8.90796C9.70532 8.89486 10.2165 9.08908 10.5802 9.4528L11.3719 10.2445C11.6674 10.54 12.0528 10.6748 12.4415 10.6748Z" fill="black" stroke="#6A48C8" stroke-width="0.833333"/>
                    </g>
                </svg>
            </div>

            <h2>Accéder à Google Analytics</h2>
            <a href="https://analytics.google.com" target="_blank">
                Aller sur le site
                <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <g id="Icons / arrow-right">
                        <path id="Vector" d="M16.5545 10.3545L16.908 10.0009L16.5545 9.64736L11.9378 5.03069L11.9378 5.03069C11.9163 5.00916 11.903 4.97842 11.903 4.94257C11.903 4.90672 11.9163 4.87599 11.9378 4.85446C11.9593 4.83293 11.9901 4.81966 12.0259 4.81966C12.0618 4.81966 12.0925 4.83293 12.114 4.85446L17.1724 9.9128C17.1939 9.93433 17.2072 9.96506 17.2072 10.0009C17.2072 10.0368 17.1939 10.0675 17.1724 10.089L12.114 15.1474C12.0994 15.162 12.0853 15.1705 12.0725 15.1757C12.0591 15.181 12.0436 15.1842 12.0259 15.1842C12.0082 15.1842 11.9927 15.181 11.9794 15.1757C11.9665 15.1705 11.9525 15.162 11.9378 15.1474C11.9163 15.1258 11.903 15.0951 11.903 15.0592C11.903 15.0234 11.9163 14.9927 11.9378 14.9711L16.5545 10.3545Z" fill="black" stroke="#6A48C8"/>
                        <path id="Vector_2" d="M16.9417 10.125H2.91669C2.88654 10.125 2.85526 10.1127 2.82962 10.0871C2.80397 10.0614 2.79169 10.0301 2.79169 10C2.79169 9.96985 2.80397 9.93857 2.82962 9.91293C2.85526 9.88728 2.88654 9.875 2.91669 9.875H16.9417C16.9718 9.875 17.0031 9.88728 17.0288 9.91293C17.0544 9.93857 17.0667 9.96985 17.0667 10C17.0667 10.0301 17.0544 10.0614 17.0288 10.0871C17.0031 10.1127 16.9718 10.125 16.9417 10.125Z" fill="black" stroke="#6A48C8"/>
                    </g>
                </svg>
            </a>
        </div>
        <!-- End Google Analytics -->

        <!-- Last actuality -->
        <div class="list" data-controller="filter-actuality">
            <h2>Les dernières actualités</h2>
            <div class="list__filter">

            </div>

            <div class="list__head row flex-row align-center justify-between">
                <div class="col-4">
                    <span>Titre de l'actualité</span>
                </div>
                <div class="col-2">
                    <span>Status</span>
                </div>
                <div class="col-1">
                    <span>Catégorie</span>
                </div>
                <div class="col-2">
                    <span>Date de publication</span>
                </div>
                <div class="col-2">
                    <span>Date de modification</span>
                </div>
                <div class="col-1">
                    <span>Actions</span>
                </div>
            </div>
            <div class="separator"></div>
            <div class="list__body">

            </div>
        </div>
        <!-- End last actuality -->
    </div>
{% endblock %}