{% extends 'base.html' %}

{% block title %}Mode d'emploi{% endblock %}

{% block content %}
{% load static %}

<p class="desktop-hidden mobile-content-title">
    {% block content_title %}La Chariotte - mode d'emploi{% endblock %}
  </p>
<div class="box">
    <p>Comment marche la Chariotte et qu'est-ce qu'on peut y faire ? Voilà toutes les réponses à vos questions :</p>
    <ul>
        <li><a href="#creer_compte">Créer un compte</a></li>
        <li><a href="#creer_commande_groupee">Créer une commande groupée</a></li>
        <li><a href="#ajouter_prodtuits">Ajouter des produits à une commande groupée</a></li>
    </ul>
</div>

<div class="box" id="creer_compte">
    <p class="title">Créer un compte</p>
    <p>Cliquez sur “Créer un compte”.</p>
    <img src="{% static 'img/notice/create_account.jpg' %}"/>
    <p>Remplissez toutes les informations du formulaire, puis cliquez sur valider.</p>
    <img src="{% static 'img/notice/create_account_form.jpg' %}"/>
    <p>Vous pouvez maintenant vous connecter.</p>
</div>

<div class="box" id="creer_commande_groupee">
    <p class="title">Créer une commande groupée</p>
    <p>En ayant un compte (nécessaire seulement pour les organisateurs!), vous aurez accès à une page de gestion des commandes groupées en cliquant sur le menu “Mes commandes groupées”.</p>
    <img src="{% static 'img/notice/my_grouped_orders.jpg' %}"/>
    <p>C’est depuis cette page que vous pourrez créer une nouvelle commande en cliquant sur le bouton “Créer une nouvelle commande groupée” : </p>
    <img src="{% static 'img/notice/create_grouped_order.jpg' %}"/>
    <p>Quelques informations vous seront alors demandées  :</p>
    <img src="{% static 'img/notice/create_grouped_order_form.jpg' %}"/>
    <p>En cliquand sur "Suivant", votre commande groupée sera validée.</p>

</div>
{% endblock %}