{% extends 'base.html.twig' %}
{% block title %}
meuble design Yamakado classé 
{% endblock %}

{% block nav_container %}
	<h1>
	  {% if category %} 
	  	{{ category.name | capitalize }}
	  {% endif %}
	 </h1>
{% endblock %}
{% block body %}

	
	{% include "product/category_menu.html.twig" with { categories: categories, activeCategory: category } %}
	

   	{% for product in category.products %}
   		<hr/>
       <div class="row">

       		<div class="col-12 col-md-4">
       			   		
				
					<h2>	
						<a href="{{ path('product_show', {id: product.slug }) }}">{{ product.name}} </a>
					</h2>
					<p><small>design <i>{{ product.designer }}</i></small></p>
					

					<div class="d-block  d-lg-none" style="text-align:center; max-width: 95%;">
	
						<div class="carousel gallery">
							{% for image in product.images %}
								{% include 'product/image.html.twig' with {image: image } %}
							{% endfor %}
						</div>
					</div>

					
				
       			<p>{{ product.description }}</p>
       			
       			<p>
       				<a href="{{ path('product_show', {id: product.slug }) }}">Voir détail...</a>
       			</p>    
       			               
			</div>
			<div class="d-none  d-lg-block col-md-8">

				<!-- pc -->
				<div >
					
					{% for image in product.images %}
							{% include 'product/image.html.twig' with {image: image } %}
					{% endfor %}
				</div>

				<!-- mobile -->
				

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


{% endblock %}