import {faUser, faUsers} from "@fortawesome/free-solid-svg-icons";
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";

export const Home = () => {
    return <>
        <div className="container">
            <div style={{textAlign: "center", margin: "2em"}}>
                <h1 className="text-green-800 text-4xl">Bienvenue sur l’intranet de la Fédération France Soft Armored Fighting</h1>
            </div>
            <div className="row" style={{marginTop: "3em"}}>
                <div className="col" style={{backgroundColor: "#FFFFFF79", padding: "0", borderRadius: "3em 3em 1em 1em", margin: "1em"}}>
                    <div className="align-content-center"
                         style={{textAlign: "center", backgroundColor: "#FFFFFF79", padding: "1em 1em 0em 1em", borderRadius: "3em 3em 0 0"}}>
                        <h2><FontAwesomeIcon icon={faUser} size="2xl"/></h2>
                        <h2>Pour les licenciés</h2>
                    </div>
                    <p style={{padding: "0.5em 1em 0.5em 1em"}}>
                        Vous y retrouverez toutes vos informations ainsi que l'état de votre inscription à la fédération. Vous pouvez également
                        télécharger votre attestation d'inscription, vous inscrire aux compétitions ainsi que consulter vos résultats sous réserve que
                        le club organisateur les ait renseignés. <br/>
                        <br/>
                        Lors de votre première inscription, vous recevrez un email contenant vos informations d'identification, ce mail sera envoyé
                        une fois votre licence validée par le secrétariat.
                    </p>
                </div>
                <div className="col" style={{backgroundColor: "#FFFFFF79", padding: "0", borderRadius: "3em 3em 1em 1em", margin: "1em"}}>
                    <div className="align-content-center"
                         style={{textAlign: "center", backgroundColor: "#FFFFFF79", padding: "1em 1em 0em 1em", borderRadius: "3em 3em 0 0"}}>
                        <h2><FontAwesomeIcon icon={faUsers} size="2xl"/></h2>
                        <h2>Pour les clubs</h2>
                    </div>
                    <p style={{padding: "0.5em 1em 0.5em 1em"}}>
                        C'est ici que vous pouvez prendre les licences fédérales pour vos adhérents, que vous pouvez demander ou renouveler votre
                        affiliation, renseigner vos horaires, lieux d'entraînement et réseaux sociaux qui seront par la suite affichés sur
                        le site ffsaf.fr.<br/>
                        Vous aurez par ailleurs la possibilité de publier des formulaires d'inscriptions pour vos compétitions ainsi
                        que d'enregistrer les résultats.<br/><br/>
                        Vous n'êtes pas encore affilié à la fédération ? Cliquez <a href="/affiliation">içi</a> pour faire votre première demande.
                    </p>
                </div>
            </div>
        </div>
        <div style={{
            backgroundImage: "url('home_back.jpg')",
            backgroundRepeat: "no-repeat",
            backgroundAttachment: "fixed",
            backgroundSize: "cover",
            backgroundPosition: "center",
            position: "absolute",
            height: "100vh",
            width: "100vw",
            top: 0,
            left: 0,
            zIndex: -2
        }}>
        </div>
    </>
};
