templates/pages/droits.html.twig line 1

{% extends 'layout/layout.html.twig' %}
{% trans_default_domain 'front_messages' %}

{% block title %}Exercez vos droits | Regalo{% endblock %}
{% block stylesheets %}
    {{ parent() }}
    {{ encore_entry_link_tags('homepage') }}
    <style>
    .form-droits{
        width: 100%!important;
        gap: 20px;
        padding: 20px;
        & input{
            width: 100%!important;
            padding: 10px;
            margin: 20px 0;
            border: 1px solid var(--card-header-link);
            border-radius: 5px;
        }
         & select{
            width: 100%!important;
            padding: 10px;
            margin: 20px 0;
            border: 1px solid var(--card-header-link);
            border-radius: 5px;
        }
        & button{
            width: fit-content!important;
            padding: 10px 25px;
            margin: 10px 0;
            border: 1px solid var(--card-header-link);
            border-radius: 5px;
            background-color: var(--card-header-link);
            color: white;
            cursor: pointer;
        }
        & label {
            font-size: 1rem;
            font-weight: bold;
        }
    }
       .exercez {
            margin-bottom: 50px;
            margin-top: 50px;
        }

        .content h1, .content h2 {
            color: black;
        }

    </style>

{% endblock %}
{% block bodyclass %}{% if not app.user %}regalo{% endif %} droits{% endblock %}
{% block content %}

        <header>
            <div class="container-home">
                <nav class="regalo_navbar">
                    <a href="/" class="logo"></a>
                </nav>
                <h1 class="title">Exercez vos droits</h1>
            </div>
        </header>

        <main>
            <div class="container-home">
                <div class="content">
                    <h2 class="exercez">Formulaire de demande</h2>
                    <p>Veuillez utiliser ce formulaire pour exercer vos droits concernant vos données personnelles. Nous nous engageons à traiter votre demande dans les plus brefs délais.</p>
                    {{ form_start(form, { 'attr': { 'class': 'form-droits' } }) }}
                       
                        <div >
                            {{ form_label(form.email) }}
                            {{ form_widget(form.email) }}
                            {{ form_errors(form.email) }}
                        </div>
                        <div class="form-group">
                            {{ form_label(form.request_type) }}
                            {{ form_widget(form.request_type) }}
                            {{ form_errors(form.request_type) }}
                        </div>
                        <div>
                            {{ form_widget(form.submit) }}
                        </div>
                    {{ form_end(form) }}
                </div>
            </div>
        </main>

    <script>
        var app = {
            init: function () {
                app.title = document.querySelectorAll('.faq-title');

                for (var i = 0; i < app.title.length; ++i) {
                    app.title[i].addEventListener('click', app.togglefaq);
                }

                app.Register = document.querySelector('.register');
                app.BtnRegister = document.querySelector('.button-register');
                app.BtnRegister.addEventListener('click', app.FuncRegister);

                app.Login = document.querySelector('.login');
                app.BtnLogin = document.querySelector('.button-login-link');
                app.BtnLogin.addEventListener('click', app.FuncLogin);
            },

            FuncRegister: function(event){
                app.Register.style.display = 'block';
                app.Login.style.display = 'none';
            },

            FuncLogin: function(event){
                app.Register.style.display = 'none';
                app.Login.style.display = 'block';
            },

            togglefaq: function(event){
                var clicked = event.target;
                let classes = clicked.classList;
                classes.toggle('open');
            }
        };

        document.addEventListener('DOMContentLoaded', app.init);
    </script>
{% endblock %}