diff --git a/python-total/dia_16/README.md b/python-total/dia_16/README.md index 02b80f9..2794ed2 100644 --- a/python-total/dia_16/README.md +++ b/python-total/dia_16/README.md @@ -1271,6 +1271,117 @@ Nos queda así: ## 16.24. - Terminar el sitio +Vamos a tareas_form.html para poner un enlace que permita volver al inicio: +```html +
+ 🡠 Volver +
+``` +- Le agregamos una flecha con un icono html. +- En el input del boton incluimos la clase creada al botón de la página principal. + +El formulario completo lo metemos en un div con otra clase para darle estilo: +```html +{% extends 'base/principal.html' %} +{% block content %} + +
+ ← Volver +
+ +
+
+ {% csrf_token %} + {{form.as_p}} + +
+
+ +{% endblock content %} +``` + +A darle estilo: +```css +.cuerpo-tarjeta { + padding: 10px 20px; +} +``` + +Queda así: + +![](../img/dia16_48.png) + +Vamos a tarea_confirm_delete.html y copiamos lo que hemos hecho anteriormente para volver. Y encapsulamos el form en un div con la misma clase que antes, también en el input de submit: +```html +{% extends 'base/principal.html' %} +{% block content %} +
+ ← Volver +
+
+
+ {% csrf_token %} +

Vas a eliminar esta tarea: "{{tarea}}"

+ +
+
+{% endblock content %} +``` + +Ya tiene el estilo, lo único que le doy otro color al botón: + +![](../img/dia16_49.png) + + +Ahora le toca a login.html. Creamos el div de la clase barra_superio pero sin volver, esta vez ponemos el h1 de la página. Metemos el form y la pregunta ¿Tienes cuenta? en un div con clase cuerpo-tarjeta y, por último, le damos la clase al input submit: +```html +{% extends 'base/principal.html' %} +{% block content %} +
+

Ingresar

+
+
+
+ {% csrf_token %} + {{form.as_p}} + +
+

¿No tienes cuenta?Registrate

+
+{% endblock content %} +``` + +Queda así: + +![](../img/dia16_50.png) + +En registro.html es igual. Pero además, vamos a modificar el form por defecto poniendo uno a uno los inputs para que no se vea el texto aclaratorio y le damos una aclaración de estilo al input submit para separar el botón del último input: +```html +{% extends 'base/principal.html' %} +{% block content %} +
+

Registro

+
+
+
+ {% csrf_token %} + + {{form.username}} + + {{form.password1}} + + {{form.password2}} + +
+

Ya tienes cuenta? Login

+
+{% endblock content %} +``` + +Y queda así: + +![](../img/dia16_51.png) + ## Ficheros y documentación - [mi_web](mi_web/) - [web_Python_Total](web_Python_Total/) diff --git a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/login.html b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/login.html index 11307ac..3d42766 100644 --- a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/login.html +++ b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/login.html @@ -1,16 +1,23 @@ {% extends 'base/principal.html' %} {% block content %} -

Ingresar

+
+

Ingresar

+
-
- {% csrf_token %} - {{form.as_p}} +
- + + {% csrf_token %} + {{form.as_p}} - + + + + +

¿No tienes cuenta? Registrate

+ +
-

¿No tienes cuenta?Registrate

{% endblock content %} diff --git a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/principal.html b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/principal.html index 7a4e3e0..a405245 100644 --- a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/principal.html +++ b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/principal.html @@ -122,12 +122,16 @@ .boton { text-decoration: none; color: #fff; - background-color: #4CAF50; + background-color: #b22493; padding: 10px 15px; border-radius: 5px; cursor: pointer; } + .cuerpo-tarjeta { + padding: 10px 20px; + } + diff --git a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/registro.html b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/registro.html index 0debf49..b74d3ac 100644 --- a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/registro.html +++ b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/registro.html @@ -1,16 +1,30 @@ {% extends 'base/principal.html' %} {% block content %} -

Registro

+
+

Registro

+
-
- {% csrf_token %} - {{form.as_p}} +
+ + + {% csrf_token %} - + + {{form.username}} - + + {{form.password1}} -

Ya tienes cuenta?Login

+ + {{form.password2}} + + + + + +

Ya tienes cuenta? Login

+ +
{% endblock content %} diff --git a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/tarea_confirm_delete.html b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/tarea_confirm_delete.html index 8dc84e9..d7b0bc6 100644 --- a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/tarea_confirm_delete.html +++ b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/tarea_confirm_delete.html @@ -1,12 +1,15 @@ {% extends 'base/principal.html' %} {% block content %} +
+ ← Volver +
-Volver - -
- {% csrf_token %} -

Vas a eliminar esta tarea: "{{tarea}}"

- -
+
+
+ {% csrf_token %} +

Vas a eliminar esta tarea: "{{tarea}}"

+ +
+
{% endblock content %} diff --git a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/tarea_form.html b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/tarea_form.html index 797488e..e3943e9 100644 --- a/python-total/dia_16/mi_web/src/proyecto/base/templates/base/tarea_form.html +++ b/python-total/dia_16/mi_web/src/proyecto/base/templates/base/tarea_form.html @@ -1,14 +1,16 @@ {% extends 'base/principal.html' %} {% block content %} -

Formulario de tareas

+
+ ← Volver +
-Volver - -
- {% csrf_token %} - {{form.as_p}} - -
+
+
+ {% csrf_token %} + {{form.as_p}} + +
+
{% endblock content %} diff --git a/python-total/img/dia16_48.png b/python-total/img/dia16_48.png new file mode 100644 index 0000000..9fdfe79 Binary files /dev/null and b/python-total/img/dia16_48.png differ diff --git a/python-total/img/dia16_49.png b/python-total/img/dia16_49.png new file mode 100644 index 0000000..2a16f83 Binary files /dev/null and b/python-total/img/dia16_49.png differ diff --git a/python-total/img/dia16_50.png b/python-total/img/dia16_50.png new file mode 100644 index 0000000..f8dd276 Binary files /dev/null and b/python-total/img/dia16_50.png differ diff --git a/python-total/img/dia16_51.png b/python-total/img/dia16_51.png new file mode 100644 index 0000000..b90a443 Binary files /dev/null and b/python-total/img/dia16_51.png differ