{% set active = 'repair' %}


{% extends 'base.html.twig' %}
{% block title %}
	Solution - Micro76
{% endblock %}

{% block stylesheets %}
	<link rel="stylesheet" href="{{ asset('css/diag.css') }}">

{% endblock %}


{% block body %}

	<div class="banner">
		<a href="{{ path('repair.item',{item : categorie | replace({' ' : '_'}) }) }}">
			{{ categorie }}
		</a>
		{% for item in pbs %}
			<i class="fas fa-chevron-right"></i>
			<span>{{ item }}</span>
		{% endfor %}
	</div>

	<main>
		<section class="home">
			{{ categorie.image.display(200,'rounded') }}
			<div class="title">{{ categorie }}</div>
			<a href="{{ link.find(10).href }}" class="link">{{ link.find(10) }}</a>
			<p>
				Bonne Nouvelle, nous pouvons diagnostiquer votre
				<span class="text-blue-500 font-semibold">{{ categorie }}</span>
			</p>
			<p class="infos">Prenez rendez-vous en atelier ou venez sans rendez-vous.</p>
		</section>


		<section class="service">
			<div class="content">
            {% for service in pbs|last.service %}
				{% if service.id in [2,3] %}
					{% set modal = 'data-bs-target=#contactModal data-bs-toggle=modal' %}
				{% endif %}
				<a href="{{ service.link|first.href }}" {{ modal| default('') }}>
					<div class="item">
						<span class="localisation {{ service.localisation.background }}">{{ service.localisation }}</span>
						<div class="d-flex justify-content-center">
							{% if service.hasImage() %}

							{{ service.image.display(100,'ico') }}
                        {% endif %}
                        </div>
                        <p class="title">{{ service.title }}</p>
						<p class="descr">{{ service.description }}
						</p>
						<div>
							{% for link in service.link %}
								<a href="{{ link.href }}" class="link">{{ link }}</a>
							{% endfor %}

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

		<section class="details">
			<h2 class="title">
				> Détails
			</h2>


			<p>


				<b>Contactez-nous par téléphone :</b>
				Vous pouvez nous contacter par téléphone au 02 35 37 45 83.
			</p>
		</section>
	</main>


	{% include 'templates/modals/contact.html.twig'  %}
{% endblock %}