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

{% block title %} Signup | Site{% endblock %}

{% block main %}

    <div class="contain:sm">

        <h1 class="mt-30 mb-2">Quel est votre statut relationnel ? </h1>

        {{ form_start(form, { 
                'attr' : { 
                    'class': '' 
                } 
            }) 
        }}
                 
            <ul class="naked mt-2">

                <li>
                    <label 
                        class="sl-radio-card"
                    >
                        <img width="85" src="{{ absolute_url(asset('icons/linkedin.svg')) }}" alt="asdf" loading="lazy" decoding="async">
                        <span>En couple</span>
                        <input 
                            type="radio"
                            name="{{ field_name(form.relationship) }}" 
                            value="2"
                            {{ field_value(form.relationship) in [2 , ''] ? "checked" : "" }}
                        >
                    </label>
                </li>

                <li class="mt-1">
                    <label 
                        class="sl-radio-card"
                    >
                        <img width="85" src="{{ absolute_url(asset('icons/linkedin.svg')) }}" alt="asdf" loading="lazy" decoding="async">
                        <span>Célibataire</span>
                        <input 
                            type="radio"
                            name="{{ field_name(form.relationship) }}" 
                            value="1"
                            {{ field_value(form.relationship) == 1 ? "checked" : "" }}
                        >
                    </label>
                </li>
            </ul>

            <div class="fixed-ctas">
                <div class="contain:sm">
                    <button type="submit" class="btn w-100">
                        Rejoindre la communauté
                    </button>
                </div>
            </div>
            

        {{ form_widget(form._token) }}
        {{ form_end(form, {'render_rest': false}) }}

    </div>
    
{% endblock %}