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

{% block title %}Liste des catégories{% endblock %}


{% block stylesheets %}
    {{parent()}}
    <link rel="stylesheet" href=" {{asset('css/view-data.css')}} ">
{% endblock %}

{% block body %}
	{# affichage du formulaire #}
    {{ render(controller("App\\Controller\\Admin\\AdminController::navbarLeftAdmin")) }}

	<div class="main-view">
		<h1 class="view-title">
            Liste des catégories 
            <a href="{{ path('category_add')}}">
                <div class="btn-add-title ">
                    <img class ="img-45" src="{{asset('img/png/add.png')}}" alt="">
                </div>
            </a>
        </h1>

        <div class="display-flex-wrap category-content">
            {% for category in categories %}
                    <div class="width-33">
                        <div class="view-cat-title">
                            <div class="title-category">
                                <img class ="img-25 dot-green" src="{{asset('img/svg/dot-green.svg')}}" alt="">
                                <img class ="img-25 dot-green-hover" src="{{asset('img/svg/dot-green-hover.svg')}}" alt="">
                                <a href="{{ path('creation_view_by_category', {catId : category.id})}}">{{ category.name }}</a>
                            </div>

                            <div class="button-manage">
                                <a href="{{ path('sub_category_add', {id : category.id})}}"><div><img class ="img-45" src="{{asset('img/png/add.png')}}" alt=""></div></a>
                            </div>
                        </div>

                        {% for subCategory in category.subCategories %}
                            <div class="line-view-data">
                                <a class="link-sub-category" href="{{ path('creation_view_by_subcategory', {subCatId : subCategory.id})}}">
                                    <div class="title-sub-category">
                                        {# <img class ="img-15 dot-green" src="{{asset('img/svg/dot-green.svg')}}" alt="">
                                        <img class ="img-15 dot-green-hover" src="{{asset('img/svg/dot-green-hover.svg')}}" alt="">  #}
                                        {{ subCategory.name }}
                                    </div>
                                </a>
                            </div>
                        {% endfor %}
                    </div>
            {% endfor %}
        </div>
	</div>


{% endblock %}