You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
Registros/tasks/templates/index.html

93 lines
2.7 KiB

{% extends "base.html" %}
{% block content %}
{% if not user.is_authenticated %}
<style>
/* Fondo con degradado */
body {
background: linear-gradient(to right, #2c3e50, #34495e);
color: #fff;
}
/* Tarjeta de login */
.card {
background-color: #ffffff;
border-radius: 15px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
}
.card-body {
padding: 35px;
}
/* Etiquetas del formulario */
.form-label {
color: #333;
font-weight: bold;
}
/* Inputs con bordes redondeados */
.form-control {
border-radius: 10px;
box-shadow: none;
transition: 0.3s ease;
}
.form-control:focus {
border-color: #5bc0de;
box-shadow: 0px 0px 8px rgba(91, 192, 222, 0.8);
}
/* Botón de inicio de sesión */
.btn-primary {
background-color: #5bc0de;
border-color: #5bc0de;
border-radius: 10px;
font-size: 16px;
letter-spacing: 1px;
font-weight: bold;
}
.btn-primary:hover {
background-color: #39b3d7;
border-color: #39b3d7;
}
/* Enlace de registro */
.text-muted:hover {
color: #5bc0de !important;
}
</style>
<!-- Contenedor principal -->
<div class="container-fluid d-flex justify-content-center align-items-center" style="height: 100vh;">
<div class="card shadow-lg p-4" style="max-width: 400px;">
<div class="card-body">
<h3 class="text-center mb-4" style="color: #333;">Iniciar Sesión</h3>
<form method="post">
{% csrf_token %}
<div class="mb-3">
<label for="username" class="form-label">Nombre de Usuario</label>
<input type="text" class="form-control" id="username" name="username" required>
</div>
<div class="mb-3">
<label for="password" class="form-label">Contraseña</label>
<input type="password" class="form-control" id="password" name="password" required>
</div>
<button type="submit" class="btn btn-primary w-100">
<i class="fas fa-sign-in-alt"></i> Iniciar Sesión
</button>
</form>
<div class="text-center mt-3">
<a href="{% url 'signup' %}" class="text-muted">Registrarse</a>
</div>
</div>
</div>
</div>
{% endif %}
{% endblock %}
{% block footer %}
<footer class="footer mt-auto py-3 bg-dark text-white text-center">
<div class="container">
<span>© 2025 Registro | Todos los derechos reservados</span>
</div>
</footer>
{% endblock %}