{% extends 'common/layout.html.twig' %}

{% block content %}
<div class='container rubriquelist mt-5'>
	<h1>{{ 'Rubriques'|trans }}</h1>
	{# <div class="card-columns"> #}
	<div class="row">
    {% for rubrique in rubriques %}
    	<div class="col-12 col-md-6 mb-2">
	    	<div class="card mb-2">
				<div class="card-header" style='cursor:pointer;'><h2>{{rubrique.name}}</h2></div>
				<div class="card-body">
					<div class="card-text">
			    		{{rubrique.content|raw}}
			    	</div>
				</div>
				{% if rubrique.prestataires|length > 0 %}
					<div class="card-text mx-auto text-center">
						<h5><a href="#" class="card-text mt-3" style='cursor:pointer;' data-toggle="collapse" data-target="#collapsepresta{{rubrique.id}}" aria-expanded="false" aria-controls="collapsepresta{{rubrique.id}}">
							{{rubrique.prestataires|length}} {{'prestataires'|trans}}
						</a></h5>
					</div>
		    		<ul class="list-group list-group-flush collapse" id="collapsepresta{{rubrique.id}}">
		    		{% for presta in rubrique.prestataires %}
	                  <li class="list-group-item">
	                  	<a href='{{ path('show_prestataire', {'slug': presta.slug}) }}'>{{presta.__toString()}}</a>
	                  	{% if presta.description|length > 0 %}
	                  		<div class='ml-2'>
			                  	{{presta.description|truncate(50, true, '...')}}
				            </div>
				        {% endif %}
	                  </li>
	                  {% endfor %}
	                </ul>
		    	{% endif %}
			</div>
		</div>
    {% endfor %}
</div>
{% endblock %}