1
resposta

[Projeto] Solucao Desafio

Basicamente criei um arquivo base.html no templates/usuarios contendo o conteudo repetido de login.html e cadastro.html

Arquivo base.html:

{% load static %}

<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Alura Space</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap" rel="stylesheet">
    <!-- CSS only -->
    <link rel="stylesheet" href="{% static '/styles/style.css' %}">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
</head>

<body>
    {% include 'partials/_menu.html' %}
    {% block content %} {% endblock %}
    {% include 'partials/_footer.html' %}
</body>

</html>

Arquivo de login.html:

{% extends 'usuarios/base.html' %}
{% load static %}
{% block content %}
            <section class="galeria" style="margin-left: 5em">
                <form action="{% url 'login' %}" method="post">
                    {% csrf_token %}
                    <div class="row">
                        {% for field in form.visible_fields %}
                        <div class="col-12 col-lg-12" style="margin-bottom: 10px;">
                            <label  for="{{ field.id_for_label }}" style="color:#D9D9D9; margin-bottom: 5px;">{{field.label}}</label>
                            {{field}}
                        </div>
                        {% endfor %}
                        </div>
                        <div class="col-12 text-center">
                            <button type="submit" class="btn btn-success col-12" style="padding: top 5px;">Logar</button>
                        </div>
                    </div>
                </form>
            </section>
        </main>
    </div>
    {% endblock %}

Arquivo de cadastro.html:

{% load static %}
{% block content %}
            <section class="galeria" style="margin-left: 5em">
                <form action="{% url 'cadastro' %}" method="post">
                    {% csrf_token %}
                    <div class="row">
                        {% for field in form.visible_fields %}
                        <div class="col-12 col-lg-12" style="margin-bottom: 10px;">
                            <label  for="{{ field.id_for_label }}" style="color:#D9D9D9; margin-bottom: 5px;">{{field.label}}</label>
                            {{field}}
                        </div class="alert alert-danger">
                        {% for error in field.errors %}
                        <div>
                            {{error}}
                        </div>
                        {% endfor %}
                        {% endfor %}
                        </div>
                        <div class="col-12 text-center">
                            <button type="submit" class="btn btn-success col-12" style="padding: top 5px;">Cadastrar</button>
                        </div>
                    </div>
                </form>
            </section>
        </main>
    </div>
    {% endblock %}
1 resposta

Bom dia, Guilherme, como vai?

Obrigado por compartilhar seu código com a comunidade Alura!

A sua ideia de criar o arquivo base.html para reutilizar o conteúdo entre as páginas de login e cadastro é uma ótima prática de refatoração. Isso ajuda a manter o código mais limpo e facilita a manutenção do projeto, além de garantir uma maior consistência no layout.

Conte com o apoio do Fórum na sua jornada.

Abraços e bons estudos!