{{ template "headersMenu.html" . }}


<section class="flex relative justify-center items-center py-36  lg:h-screen" id="home">
    <div class="container">
        <div class="grid lg:grid-cols-12 md:grid-cols-2 gap-[30px] items-center">
            <div class="col-span-12 lg:col-span-3 hover:col-span-6">
                <div class="text-center ltr:md:text-left rtl:md:text-right">
                    <h1 class="text-2xl font-bold leading-normal lg:leading-normal lg:text-4xl"> {{"Rechercher" | t}}</h1>
                    <div class="mt-1 mb-3 subcribe-form">
                        <form class="relative w-full" method="get" action="/list">
                            <input type="text" id="subcribe" name="q" class="pt-4 ltr:pr-40 rtl:pl-40 pb-4 ltr:pl-6 rtl:pr-6 w-full h-[50px] outline-none text-black dark:text-white rounded-lg border-2 bg-white dark:bg-slate-900 shadow dark:shadow-gray-800" placeholder="{{ "Rechercher" | t }}...">
                            <button type="submit" class="btn absolute top-[2px] ltr:right-0 rtl:left-0 h-[46px] bg-indigo-600 hover:bg-indigo-700 text-white border-0" style="border-radius:0 10px 10px 0; margin-right:2px"><i class="fa fa-search"></i></button>
                        </form>
                    </div>
                </div>
            </div>
            <div class="col-span-12 lg:col-span-9">

                <div class="grid lg:grid-cols-12 md:grid-cols-2 gap-[30px] items-center">
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/list" up-follow class="text-center ease-in-out group block overflow-hidden relative p-6 text-left rounded-lg border-2 border-gray-400 hover:border-black hover:border-indigo-700 shadow transition-all duration-500   dark:shadow-gray-800 h-[200px] hover:shadow-md dark:hover:shadow-gray-700 hover:bg-indigo-600 hover:text-white bg-white dark:bg-slate-900">
                            <i class="mt-5 fa-thin fa-4x fa-qrcode"></i>
                            <div class="mt-3 content">
                                <h2 class="text-xl font-semibold title">{{ "QRCodes" | t }}</h2>
                            </div>
                        </a>
                    </div>
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/list/design" up-follow class="text-center ease-in-out group block overflow-hidden relative p-6 text-left rounded-lg border-2 border-gray-400 hover:border-black hover:border-indigo-700 shadow transition-all duration-500   dark:shadow-gray-800 h-[200px] hover:shadow-md dark:hover:shadow-gray-700 hover:bg-indigo-600 hover:text-white bg-white dark:bg-slate-900">
                            <i class="mt-5 fa-thin fa-4x fa-brush"></i>
                            <div class="mt-3 content">
                                <h2 class="text-xl font-semibold title">{{ "Gabarits" | t }}</h2>
                            </div>
                        </a>
                    </div>
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/list/api" up-follow class="text-center ease-in-out group block overflow-hidden relative p-6 text-left rounded-lg border-2 border-gray-400 hover:border-black hover:border-indigo-700 shadow transition-all duration-500   dark:shadow-gray-800 h-[200px] hover:shadow-md dark:hover:shadow-gray-700 hover:bg-indigo-600 hover:text-white bg-white dark:bg-slate-900">
                            <i class="mt-5 fa-thin fa-4x fa-cogs"></i>
                            <div class="mt-3 content">
                                <h2 class="text-xl font-semibold title">{{ "Automatisations" | t }}</h2>
                            </div>
                        </a>
                    </div>
                </div>

            </div>
        </div>
    </div>
</section>


<section class="flex relative justify-center items-center py-40 lg:h-screen" id="home">
    <div class="container">
        <div class="col-span-12 lg:col-span-4 hover:col-span-6">
            <div class="text-center ltr:md:text-left rtl:md:text-right">
                <div class="mt-6 mb-3 subcribe-form">
                    <form class="relative w-full" method="get" action="/list">
                        <input type="text" id="subcribe" name="q" class="pt-4 ltr:pr-40 rtl:pl-40 pb-4 ltr:pl-6 rtl:pr-6 w-full h-[50px] outline-none text-black dark:text-white rounded-lg border-2 bg-white dark:bg-slate-900 shadow dark:shadow-gray-800" placeholder="{{ "Rechercher" | t }}...">
                        <button type="submit" class="btn absolute top-[2px] ltr:right-0 rtl:left-0 h-[46px] bg-indigo-600 hover:bg-indigo-700 border-gray-400 hover:border-black dark:border-white hover:border-indigo-700 text-white rounded-lg border-2"><i class="fa fa-search"></i></button>
                    </form>
                </div>
            </div>
        </div>
        <div class="grid lg:grid-cols-12 md:grid-cols-2 gap-[30px] mt-10 items-center">
            <div class="float-right col-span-12 lg:col-span-3">
                {{ "Ici vos médias" | t }}
            </div>
            <div class="col-span-12 lg:col-span-9">
                <div class="grid lg:grid-cols-12 md:grid-cols-2 gap-[30px] items-center">
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/list" up-follow class="block overflow-hidden relative p-6 text-center bg-white rounded-lg border-2 border-gray-400 hover:border-black shadow transition-all duration-500 ease-in-out group dark:shadow-gray-800 h-[200px] hover:shadow-md dark:hover:shadow-gray-700 dark:bg-slate-900 hover:bg-indigo-600 hover:text-white dark:border-white hover:border-indigo-700">
                            <i class="mt-5 fa-thin fa-4x fa-qrcode"></i>
                            <div class="mt-3 content">
                                <h2 class="text-xl font-semibold title">{{ "QRCodes" | t }}</h2>
                            </div>
                        </a>
                    </div>
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/stats" up-follow class="block overflow-hidden relative p-6 text-center bg-white rounded-lg border-2 border-gray-400 hover:border-black shadow transition-all duration-500 ease-in-out group dark:shadow-gray-800 h-[200px] hover:shadow-md dark:hover:shadow-gray-700 dark:bg-slate-900 hover:bg-indigo-600 hover:text-white dark:border-white hover:border-indigo-700">
                            <i class="mt-5 fa-thin fa-4x fa-chart-line"></i>
                            <div class="mt-3 content">
                                <h2 class="text-xl font-semibold title">{{ "Statistiques" | t }}</h2>
                            </div>
                        </a>
                    </div>
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/bots" up-follow class="block overflow-hidden relative p-6 text-center bg-white rounded-lg border-2 border-gray-400 hover:border-black shadow transition-all duration-500 ease-in-out group dark:shadow-gray-800 h-[200px] hover:shadow-md dark:hover:shadow-gray-700 dark:bg-slate-900 hover:bg-indigo-600 hover:text-white dark:border-white hover:border-indigo-700">
                            <i class="mt-5 fa-thin fa-4x fa-cog"></i>
                            <div class="mt-3 content">
                                <h2 class="text-xl font-semibold title">{{ "Automatisations" | t }}</h2>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="mt-3 grid lg:grid-cols-12 md:grid-cols-2 gap-[30px] items-center">
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/list/downloads" up-follow class="block overflow-hidden relative p-6 text-center bg-white rounded-lg border-gray-400 shadow transition-all duration-500 ease-in-out border-2 hover:border-black group dark:shadow-gray-800 hover:shadow-md dark:hover:shadow-gray-700 dark:bg-slate-900 hover:bg-indigo-600 hover:text-white dark:border-white hover:border-indigo-700">
                            <div class="content">
                                <h2 class="text-xl font-semibold title">{{ "Téléchargements" | t }}</h2>
                            </div>
                        </a>
                    </div>
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/list/print" up-follow class="block overflow-hidden relative p-6 text-center bg-white rounded-lg border-gray-400 shadow transition-all duration-500 ease-in-out border-2 hover:border-black group dark:shadow-gray-800 hover:shadow-md dark:hover:shadow-gray-700 dark:bg-slate-900 hover:bg-indigo-600 hover:text-white dark:border-white hover:border-indigo-700">
                            <div class="content">
                                <h2 class="text-xl font-semibold title">{{ "Impressions" | t }}</h2>
                            </div>
                        </a>
                    </div>
                    <div class="col-span-6 lg:col-span-4">
                        <a href="/help" up-follow class="block overflow-hidden relative p-6 text-center bg-white rounded-lg border-gray-400 shadow transition-all duration-500 ease-in-out border-2 hover:border-black group dark:shadow-gray-800 hover:shadow-md dark:hover:shadow-gray-700 dark:bg-slate-900 hover:bg-indigo-600 hover:text-white dark:border-white hover:border-indigo-700">
                            <div class="content">
                                <h2 class="text-xl font-semibold title">{{ "Support technique" | t }}</h2>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

{{ template "footer.html" . }}