WikiLerni/front/public/themes/default/compte.html

176 lines
11 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Mettre à jour votre compte, votre abonnement...">
<meta name="robots" content="noindex">
<title>Mon compte</title>
<script src="/JS/polyfill.app.js" defer></script>
<script src="/JS/accountUser.app.js" defer></script>
<link rel="shortcut icon" href="/img/favicon.ico">
<link rel="stylesheet" href="/themes/default/CSS/pure-min.css">
<link rel="stylesheet" href="/themes/default/CSS/grids-responsive-min.css">
<link rel="stylesheet" href="/themes/default/CSS/wikilerni.css">
<link rel="canonical" href="https://www.wililerni.com/compte.html">
</head>
<body>
<header class="pure-g menu">
<div class="pure-u-1 pure-u-lg-1-8 menu-heading">
<a class="pure-menu-heading" href="/">WikiLerni</a>
</div>
<div class="pure-u-1 pure-u-lg-7-8">
<ul class="pure-g">
<li class="pure-menu-item pure-u-1 pure-u-lg-1-4">
<a class="pure-menu-link" href="/">Accueil</a>
</li>
<li class="pure-menu-item pure-u-1 pure-u-lg-1-4">
<a class="pure-menu-link" href="/connexion.html" id="accountHeadLink">Mon compte</a>
</li>
<li class="pure-menu-item pure-u-1 pure-u-lg-1-4">
<a class="pure-menu-link" href="/a-propos.html">À propos</a>
</li>
<li class="pure-menu-item pure-u-1 pure-u-lg-1-4">
<a class="pure-menu-link" href="/contact.html">Contact</a>
</li>
</ul>
</div>
</header>
<section id="main-content" class="needJS">
<div class="pure-menu pure-menu-horizontal">
<a href="/accueil.html" class="pure-menu-heading pure-menu-link">Mon WikiLerni</a>
<ul id="classement" class="pure-menu-list">
<li class="pure-menu-item"><a class="pure-menu-link" href="/compte.html#infos" title="Email, mot de passe">Mes informations</a></li>
<li class="pure-menu-item"><a href="/compte.html#subscribe" class="pure-menu-link">Mon abonnement</a></li>
<li class="pure-menu-item"><a href="/sortie.html" class="pure-menu-link">Me déconnecter</a></li>
</ul>
</div>
<div class="content">
<h2 class="content-head is-center" id="infos">Votre compte WikiLerni</h2>
<div class="pure-g">
<div class="l-box-lrg pure-u-1">
<div id="message"></div>
<form class="pure-form pure-form-aligned" id="accountUpdate" method="POST">
<fieldset>
<div class="pure-control-group">
<label for="name">Nom ou pseudo</label>
<input id="name" type="text" name="name">
<span class="pure-form-message-inline"></span>
</div>
<div class="pure-control-group">
<label for="email">Email</label>
<input id="email" type="email" name="email">
<span class="pure-form-message-inline" id="emailMessage"></span>
</div>
<div class="pure-control-group">
<label for="newPassword">Nouveau mot de passe</label>
<input id="newPassword" type="password" name="newPassword">
<span class="pure-form-message-inline" id="newPasswordMessage"><b class="information">Laisser vide sauf si vous souhaitez le changer.</b></span>
</div>
<div class="pure-controls">
Par défaut un nouveau quiz vous est proposé tous les jours. Vous pouvez préciser ci-dessous les jours souhaités :
<ul class="pure-g">
<li class="pure-u-1 pure-u-lg-1-7"><!-- grille ne fonctionne pas ?! -->
<label for="d2">
<input type="checkbox" id="d2" name="d2" value="true" /> Lundi
</label>
</li>
<li class="pure-u-1 pure-u-lg-1-7">
<label for="d3">
<input type="checkbox" id="d3" name="d3" value="true" /> Mardi
</label>
</li>
<li class="pure-u-1 pure-u-lg-1-7">
<label for="d4">
<input type="checkbox" id="d4" name="d4" value="true" /> Mercredi
</label>
</li>
<li class="pure-u-1 pure-u-lg-1-7">
<label for="d5">
<input type="checkbox" id="d5" name="d5" value="true" /> Jeudi
</label>
</li>
<li class="pure-u-1 pure-u-lg-1-7">
<label for="d6">
<input type="checkbox" id="d6" name="d6" value="true" /> Vendredi
</label>
</li>
</li>
<li class="pure-u-1 pure-u-lg-1-7">
<label for="d7">
<input type="checkbox" id="d7" name="d7" value="true" /> Samedi
</label>
</li>
<li class="pure-u-1 pure-u-lg-1-7">
<label for="d1">
<input type="checkbox" id="d1" name="d1" value="true" /> Dimanche
</label>
</li>
</ul>
</div>
<div class="pure-controls">
<label for="noticeOk" class="pure-checkbox">
<input type="checkbox" id="noticeOk" name="noticeOk" value="true" /> Je souhaite recevoir les nouveaux quizs par email.
</label>
<label for="newsletterOk" class="pure-checkbox">
<input type="checkbox" id="newsletterOk" name="newsletterOk" value="true" /> J'accepte de recevoir d'autres messages ponctuels de WikiLerni (nouvelles fonctionnalités ...).
</label>
<label for="deleteOk" class="pure-checkbox error">
<input type="checkbox" id="deleteOk" name="deleteOk" value="true" /> Je souhaite supprimer mon compte utilisateur
</label>
<button type="submit" class="pure-button pure-button-primary" id="submitDatas">Valider</button>
</div>
</fieldset>
</form>
<div id="response"></div>
<h3 id="subscribe">Votre abonnement</h3>
<div id="subscribeIntro"></div>
<p>Le coût de l'abonnement dépend de la durée pour laquelle vous vous engagez.</p>
<p>Merci de sélectionnez l'offre qui vous convient et de valider les C.G.V.<br>Un bouton vous permettra ensuite d'effectuer votre paiement.</p>
<ul>
<li><input type="checkbox" id="180Ok" name="180Ok" value="true" /> Je m'engage pour 180 jours</li>
<li><input type="checkbox" id="365Ok" name="365Ok" value="true" /> Je m'engage pour 365 jours</li>
<li><input type="checkbox" id="CGVOk" name="CGVOk" value="true" /> J'ai lu et accepte les <a href="/cgv.html">Conditions Générales de Vente</a>.</li>
</ul>
<div id="WPBtn180" class="needJS"><script>document.write("ici apparaîtra un bouton de paiement pour les 180 jours")</script></div>
<div id="WPBtn365" class="needJS"><script>document.write("ici apparaîtra un bouton de paiement pour les 365 jours")</script></div>
<div id="WPNone" class="needJS"><p><b>Merci de sélectionné l'offre qui vous convient.</b></p></div>
<h3 id="godfather">Les utilisateurs que vous avez parrainés</h3>
<p>Vous pouvez parrainer d'autres utilisateurs. Pour ce faire, demandez-leur de saisir lors de l'inscription votre adresse e-mail <strong id="godfatherEmail"></strong> ou encore le code suivant : <strong id="godfatherCode"></strong> (en gardant les majuscules/minuscules).</p>
<p>À chaque fois qu'un utilisateur que vous avez parrainé <b>souscrit un abonnement payant</b>, son abonnement comme le vôtre <b>se trouve prolongé gratuitement de 30 jours</b>. Ceci reste valable tant que cet utilisateur garde son compte WikiLerni.</p>
<p id="godchilds"><b>Pour l'instant aucune personne ne s'est inscrite en vous désignant comme "parrain".</b></p>
</div>
</div>
</div>
</section>
<footer class="footer l-box is-center">
<ul class="pure-g">
<li class="pure-u-1 pure-u-lg-1-5">
<a href="/mentions-legales.html">Crédits</a>
</li>
<li class="pure-u-1 pure-u-lg-1-5">
<a href="/mentions-legales.html">Mentions légales</a>
</li>
<li class="pure-u-1 pure-u-lg-1-5">
<a href="/donnees.html">Données personnelles</a>
</li>
<li class="pure-u-1 pure-u-lg-1-5">
<a href="/cgu.html">C.G.U.</a>
</li>
<li class="pure-u-1 pure-u-lg-1-5">
<a href="/cgv.html">C.G.V.</a>
</li>
</ul>
</footer>
</body>
</html>