<?php include 'header.html'; ?>
<section id="content" class="page-content text-center py-3">
    <div class="row justify-content-center py-3">
        <div class="col-lg-8">
            <div class="card">
                <div class="card-header">
                    <h3>Inscription</h3>
                </div>
                <div class="card-body">
                    <form id="inscriptionForm" method="post" action="inscription.php" enctype="multipart/form-data">
                        <div class="row mb-3">
                            <div class="col-md-6 form-group">
                                <label for="nom" class="labelI">Nom</label>
                                <input type="text" name="nom" id="nom" class="form-control" placeholder="Nom" autocomplete="family-name" minlength="3" maxlength="25" value="<?php echo isset($_POST['nom']) ? htmlspecialchars($_POST['nom'], ENT_QUOTES, 'UTF-8') : ''; ?>" required title="Entrez votre nom de famille.">
                            </div>
                            <div class="col-md-6 form-group">
                                <label for="prenom" class="labelI">Prénom</label>
                                <input type="text" name="prenom" id="prenom" class="form-control" placeholder="Prénom" autocomplete="given-name" minlength="3" maxlength="25" value="<?php echo isset($_POST['prenom']) ? htmlspecialchars($_POST['prenom'], ENT_QUOTES, 'UTF-8') : ''; ?>" required title="Entrez votre prénom.">
                            </div>
                        </div>
                        <div class="form-group mb-3">
                            <label for="pseudo" class="labelI">Pseudo</label>
                            <input name="pseudo" type="text" id="pseudo" class="form-control" placeholder="Pseudo" autocomplete="username" minlength="3" maxlength="25" value="<?php echo isset($_POST['pseudo']) ? htmlspecialchars($_POST['pseudo'], ENT_QUOTES, 'UTF-8') : ''; ?>" required title="Choisissez un pseudonyme.">
                        </div>
                        <div class="form-group mb-3">
                            <label for="email" class="labelI">Adresse e-mail</label>
                            <input type="email" name="email" id="email" class="form-control" placeholder="email@mail.fr" autocomplete="email" minlength="3" maxlength="30" value="<?php echo isset($_POST['email']) ? htmlspecialchars($_POST['email'], ENT_QUOTES, 'UTF-8') : ''; ?>" required title="Entrez une adresse e-mail valide.">
                        </div>
                        <div class="row mb-3">
                            <div class="col-md-6 form-group">
                                <label for="password" class="labelI">Mot de passe</label>
                                <input type="password" name="password" id="password" class="form-control" placeholder="Mot de passe" autocomplete="new-password" minlength="6" maxlength="32" required title="Votre mot de passe doit contenir au moins 6 caractères.">
                            </div>
                            <div class="col-md-6 form-group">
                                <label for="confirm" class="labelI">Confirmer le mot de passe</label>
                                <input type="password" name="confirm" id="confirm" class="form-control" placeholder="Confirmation" autocomplete="new-password" minlength="6" maxlength="32" required title="Répétez votre mot de passe.">
                            </div>
                        </div>
                        <div class="form-group mb-3">
                            <label for="phone" class="labelI">Numéro de téléphone portable</label>
                            <input type="tel" name="phone" id="phone" class="form-control" placeholder="Numéro de téléphone" autocomplete="tel" minlength="10" maxlength="15" value="<?php echo isset($_POST['phone']) ? htmlspecialchars($_POST['phone'], ENT_QUOTES, 'UTF-8') : ''; ?>" required title="Entrez un numéro de téléphone valide.">
                        </div>
                        <div class="form-group mb-3">
                            <label for="localisation" class="labelI">Adresse postale</label>
                            <input type="text" name="localisation" id="localisation" class="form-control" placeholder="Adresse" autocomplete="street-address" minlength="6" maxlength="70" value="<?php echo isset($_POST['localisation']) ? htmlspecialchars($_POST['localisation'], ENT_QUOTES, 'UTF-8') : ''; ?>" required title="Entrez votre adresse postale.">
                        </div>
                        <fieldset class="mb-3"><br>
                            <div class="form-group">
                                <label for="avatar">Photo de profil</label><br>
                                <input type="file" name="avatar" id="avatar" class="form-control-file" accept="image/*;capture=camera" title="Téléchargez une photo de profil.">
                            </div>
                        </fieldset><br>
                        <div class="form-group">
                            <input type="submit" name="action" value="S'inscrire" class="btn btn-primary">
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>
<?php include 'footer.html'; ?>