{% extends 'base.html.twig' %}
{#Ne pas oublier cette ligne car sinon tailwindcss ne fonctionnera pas !!!#}
{% block title %}
	SymRecipe - Page d'Accueil
{% endblock %}
{% block body %}

	<section class="bg-white dark:bg-gray-800">
		<div class="py-8 px-4 mx-auto max-w-screen-xl text-center lg:py-16 h-screen">
			<h1 class="mb-4 text-4xl font-extrabold tracking-tight leading-none text-gray-900 md:text-5xl lg:text-6xl dark:text-white">Bienvenue sur SymRecipe !</h1>
			<p class="mb-8 text-lg font-normal text-gray-500 lg:text-xl sm:px-16 lg:px-48 dark:text-gray-400">SymRecipe est une application qui va te permettre de créer des recettes à base d'ingrédients que tu auras toi-même créés. Tu pourras partager tes recettes avec la communauté du site, ou bien les garder en privé.</p>
			<hr>
			<p class="text-gray-500 text-lg my-4">Pour commencer, rendez-vous sur la page d'inscription pour utiliser l'application...</p>
			<div class="flex flex-col space-y-4 sm:flex-row sm:justify-center sm:space-y-0 sm:space-x-4">
				<a href="#" class="inline-flex justify-center items-center py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-orange-700 hover:bg-orange-800 focus:ring-4 focus:ring-orange-300 dark:focus:ring-orange-900">
					Inscription
					<svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 14 10">
						<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
					</svg>
				</a>
			</div>
		</div>
	</section>

{% endblock %}