UK
apps/caramail-chat / site / blocks / invite.html · commit 6eebcdb
<!-- CaraChat: the invitation (the page "inviteCaramail" of the partner site). Sober, on white: a nickname and one "asv"     field (age / sex / city, as people typed it: "25 h paris"), then straight into the chat at {{BASE}}/. --><section class="carachat-invite" aria-labelledby="carachat-invite-title">  <style>    .carachat-invite { max-width: 520px; margin: 48px auto; padding: 0 16px; font-family: Arial, Helvetica, sans-serif; color: #222; text-align: center; background: #fff; }    .carachat-invite h1 { font-size: 30px; font-weight: bold; margin: 0 0 6px; color: #0000ff; letter-spacing: -0.5px; }    .carachat-invite p { margin: 0 0 22px; font-size: 16px; color: #555; line-height: 1.45; }    .carachat-invite form { display: grid; gap: 10px; }    .carachat-invite input { font: 18px Arial, Helvetica, sans-serif; padding: 12px 14px; border: 1px solid #bbb; border-radius: 6px; background: #fff; color: #111; width: 100%; box-sizing: border-box; }    .carachat-invite input:focus { outline: none; border-color: #0000ff; box-shadow: 0 0 0 3px #e6e6ff; }    .carachat-invite small { color: #888; font-size: 13px; text-align: left; }    .carachat-invite button { font: bold 18px Arial, Helvetica, sans-serif; padding: 13px; border: 0; border-radius: 6px; background: #0000ff; color: #fff; cursor: pointer; }    .carachat-invite button:hover { background: #1a1a8c; }    .carachat-invite .who { margin-top: 18px; font-size: 13px; color: #999; }  </style>  <h1 id="carachat-invite-title">Le tchat Caramail est de retour</h1>  <p>Les salons, les privés, les pseudos en couleur et les smileys d'époque.<br>Gratuit, sans inscription, en un clic.</p>  <form method="get" action="{{BASE}}/" onsubmit="var a=(this.asv.value||'').trim().split(/[\s,\/]+/),age='',sex='1',city=[];      a.forEach(function(w){var l=w.toLowerCase();if(/^\d{1,3}$/.test(l)&&!age)age=l;else if(/^(f|fille|femme|w)$/.test(l))sex='0';else if(/^(h|m|homme|garçon|garcon)$/.test(l))sex='1';else if(w)city.push(w);});      this.age.value=age;this.sex.value=sex;this.city.value=city.join(' ');">    <input name="nickname" required maxlength="20" placeholder="Ton pseudo" autocomplete="nickname" aria-label="Pseudo">    <input name="asv" maxlength="60" placeholder="asv ? ex. : 25 f paris" aria-label="Âge, sexe, ville">    <small>Âge, sexe (f ou h) et ville, comme à l'époque. Facultatif.</small>    <input type="hidden" name="lang" value="fr"><input type="hidden" name="age"><input type="hidden" name="sex" value="1"><input type="hidden" name="city">    <button type="submit">Entrer sur le chat</button>  </form>  <div class="who">Déjà sur le chat en ce moment ? Tape ton pseudo, on t'attend dans le salon.</div></section>