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

{% block title 'Nous rejoindre' %}

{% block body %}
    <div class="container-fluid banner banner-join-us">
        <div class="text-banner text-center">
            <h1 class="text-white">Nous rejoindre</h1>
        </div>
    </div>

    <div class="wow">
        <div class="text-center">
            <p class="under-banner president-words reveal">"Parce qu'un petit geste, une action peut faire beaucoup.<br>
                Nous vous remercions."<p>
        </div>
    </div>

    <!-- if validation form is ok -->
        {% for message in app.flashes('success') %}
            <div class="alert alert-success">
                {{ message }}
            </div>
        {% endfor %}

    <div class="container">

        <div class="row my-5">
            <h2 class="text-center">Vous souhaitez nous rejoindre en tant que ?</h2>
        </div>

        <div class="row">
            <div class="col joinForm">
                <!-- create members button -->
                <form method="post" action="{{ path('inscription.membres') }}" style="display: inline-block">
                    <input type="hidden" name="_method" value="MEMBER">
                    <input type="hidden" name="_token" value="{{ csrf_token('addMember') }}">
                    <button class="btn btn-primary reveal-left-2" style="width: 32vw; height: 10vh; font-size: 1.5em">Particulier</button>
                </form>

                <!-- create structures button -->
                <form method="post" action="{{ path('inscription.structures') }}" style="display: inline-block">
                    <input type="hidden" name="_method" value="STRUCTURES">
                    <input type="hidden" name="_token" value="{{ csrf_token('addStructures') }}">
                    <button class="btn btn-primary reveal-right-3 ml-4" style="width: 32vw; height: 10vh; font-size: 1.5em">Structure*</button>
                </form>
                <p>*Les structures peuvent être une société, association, collectivité, ect...</p>
            </div>
            </div>
        <div class="row mb-5 mx-5">
            <div class="col">
                <p>L'adhésion est gratuite, elle vous permet de nous montrer votre soutien et de recevoir nos notifications et invitations à nos divers événements.</p>
            </div>
        </div>

    </div>

{% endblock %}