| <!DOCTYPE html> |
| <html> |
| <head> |
| <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"> |
| <title>Bem-vindo!</title> |
|
|
| <script> |
| function mostrarPerfis() { |
| document.getElementById('existing-profiles').classList.remove('hidden'); |
| document.getElementById('formulario-perfil').classList.add('hidden'); |
| document.getElementById('link-ja-tenho').classList.add('hidden'); |
| document.getElementById('link-criar').classList.remove('hidden'); |
| document.getElementById('titulo-criar-perfil').classList.add('hidden'); |
| } |
| </script> |
|
|
| </head> |
| <body> |
| |
| <form class="chat-box" method="POST"> |
| <h1 id="titulo-criar-perfil">Vamos criar seu perfil?</h1> |
|
|
| <div class="small-link" id="link-ja-tenho"> |
| <a href="#" onclick="mostrarPerfis(); return false;">Já tenho perfil</a> |
| </div> |
|
|
| <div class="small-link hidden" id="link-criar"> |
| <a href="/">Criar perfil</a> |
| </div> |
|
|
| <div id="existing-profiles" class="hidden"> |
| <h1>Selecione um perfil</h1> |
| {% if profiles %} |
| <ul> |
| {% for id, data in profiles.items() %} |
| <li><a href="/perfil/{{ id }}">{{ data.name or "Usuário " ~ id }}</a></li> |
| {% endfor %} |
| </ul> |
| {% else %} |
| <p>Não há perfis cadastrados.</p> |
| {% endif %} |
| </div> |
|
|
| <div id="formulario-perfil"> |
| <label for="name">Seu nome:</label> |
| <input type="text" id="name" name="name" required><br><br> |
| |
| <p>Quais gêneros de livros você gosta?</p> |
|
|
| <div class="genre-grid"> |
| {% for genre in genres %} |
| <label class="genre-label" for="{{ genre }}"> |
| <input type="checkbox" id="{{ genre }}" name="preferences" value="{{ genre }}"> |
| {{ genre.title() }} |
| </label> |
| {% endfor %} |
| </div> |
| |
| <br> |
| <button type="submit">Começar</button> |
|
|
| </div> |
|
|
| </form> |
|
|
| </body> |
| </html> |
|
|