templates/components/modals/auth.html.twig line 1

Open in your IDE?
  1. <section class="auth-modal-layer" id="authModal" data-auth-screen="login" aria-hidden="true" inert>
  2.   <div class="auth-modal-dialog" role="dialog" aria-modal="true" aria-label="Авторизация">
  3.     <button class="auth-close" type="button" aria-label="Закрыть" data-auth-close>
  4.       <svg viewBox="0 0 16 16" fill="none" aria-hidden="true">
  5.         <path d="m4.5 4.5 7 7m0-7-7 7" stroke="currentColor" stroke-width="2" stroke-linecap="round" />
  6.       </svg>
  7.     </button>
  9.     <img class="auth-logo" src="/assets/logo.svg" alt="PlayPapa" />
  11.     <section class="auth-view auth-view-login" aria-label="Вход">
  12.       <h2>С возвращением!</h2>
  13.       <div class="auth-tabs" role="tablist" aria-label="Авторизация">
  14.         <button class="auth-tab" type="button" role="tab" data-auth-screen-target="login">Вход</button>
  15.         <button class="auth-tab" type="button" role="tab" data-auth-screen-target="register">Регистрация</button>
  16.       </div>
  17.       <form class="auth-form" data-auth-form="login">
  18.         <input type="hidden" name="redirect" value="" data-auth-return />
  19.         <label class="auth-field">
  20.           <img src="/assets/auth-user.svg" alt="" />
  21.           <input type="text" name="login" placeholder="Логин" autocomplete="username" />
  22.         </label>
  23.         <label class="auth-field">
  24.           <img src="/assets/auth-lock.svg" alt="" />
  25.           <input type="password" name="password" placeholder="Пароль" autocomplete="current-password" />
  26.         </label>
  27.         <button class="auth-link auth-forgot" type="button" data-auth-screen-target="recover">Забыли пароль?</button>
  28.         <button class="auth-primary" type="submit">Войти</button>
  29.       </form>
  30.     </section>
  32.     <section class="auth-view auth-view-register" aria-label="Регистрация">
  33.       <h2>Создание аккаунта</h2>
  34.       <div class="auth-tabs" role="tablist" aria-label="Авторизация">
  35.         <button class="auth-tab" type="button" role="tab" data-auth-screen-target="login">Вход</button>
  36.         <button class="auth-tab" type="button" role="tab" data-auth-screen-target="register">Регистрация</button>
  37.       </div>
  38.       <form class="auth-form" data-auth-form="register">
  39.         <input type="hidden" name="redirect" value="" data-auth-return />
  40.         <label class="auth-field">
  41.           <img src="/assets/auth-user.svg" alt="" />
  42.           <input type="text" name="register-login" placeholder="Логин" autocomplete="username" />
  43.         </label>
  44.         <label class="auth-field">
  45.           <img src="/assets/auth-mail.svg" alt="" />
  46.           <input type="email" name="register-email" placeholder="E-mail" autocomplete="email" />
  47.         </label>
  48.         <label class="auth-field">
  49.           <img src="/assets/auth-lock.svg" alt="" />
  50.           <input type="password" name="register-password" placeholder="Пароль" autocomplete="new-password" />
  51.         </label>
  52.         <label class="auth-field">
  53.           <img src="/assets/auth-lock.svg" alt="" />
  54.           <input type="password" name="register-password-repeat" placeholder="Повторите пароль" autocomplete="new-password" />
  55.         </label>
  56.         <label class="auth-consent">
  57.           <input type="checkbox" checked />
  58.           <span aria-hidden="true"></span>
  59.           <b>Я принимаю <a href="#">условия</a> и <a href="#">политику конфиденциальности</a>.</b>
  60.         </label>
  61.         <button class="auth-primary" type="submit">Создать аккаунт</button>
  62.       </form>
  63.     </section>
  65.     <section class="auth-view auth-view-recover" aria-label="Восстановление пароля">
  66.       <button class="auth-back" type="button" data-auth-screen-target="login">
  67.         <svg viewBox="0 0 16 16" fill="none" aria-hidden="true">
  68.           <path d="M10.5 3.5 6 8l4.5 4.5" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" />
  69.         </svg>
  70.         <span>Назад ко входу</span>
  71.       </button>
  72.       <h2>Восстановление пароля</h2>
  73.       <p class="auth-subtitle">Введите e-mail - пришлем ссылку для сброса пароля.</p>
  74.       <form class="auth-form" data-auth-form="recover">
  75.         <label class="auth-field">
  76.           <img src="/assets/auth-mail.svg" alt="" />
  77.           <input type="email" name="recover-email" placeholder="you@mail.ru" autocomplete="email" />
  78.         </label>
  79.         <button class="auth-primary" type="submit">Отправить ссылку</button>
  80.       </form>
  81.     </section>
  83.     <section class="auth-view auth-view-success" aria-label="Письмо отправлено">
  84.       <div class="auth-status auth-status-success"><img src="/assets/auth-check.svg" alt="" /></div>
  85.       <h2>Проверьте почту</h2>
  86.       <p class="auth-message">Мы отправили ссылку для сброса пароля на <strong>you@mail.ru</strong>. Перейдите по ней, чтобы задать новый пароль.</p>
  87.       <button class="auth-text-action" type="button" data-auth-screen-target="recover">Не пришло письмо? Отправить повторно</button>
  88.       <button class="auth-secondary" type="button" data-auth-screen-target="login">Вернуться ко входу</button>
  89.     </section>
  91.     <section class="auth-view auth-view-error" aria-label="Ошибка отправки">
  92.       <div class="auth-status auth-status-error"><img src="/assets/auth-error.svg" alt="" /></div>
  93.       <h2>Не удалось отправить</h2>
  94.       <p class="auth-message">Письмо не отправлено - возможно, неверный адрес или проблема со связью. Проверьте e-mail и попробуйте снова.</p>
  95.       <button class="auth-primary" type="button" data-auth-screen-target="recover">Попробовать снова</button>
  96.       <button class="auth-support" type="button">Написать в поддержку</button>
  97.     </section>
  98.   </div>
  99. </section>