From c6ca569415e5179d6f499d226695a58e3516e34a Mon Sep 17 00:00:00 2001 From: David Itehua Xalamihua Date: Mon, 28 Apr 2025 14:45:50 -0600 Subject: [PATCH] mod visits views --- README.md | 1 + static/b_about-us/about-us.css | 12 +- static/c_solutions/solutions.css | 92 ++++++++++----- static/g_login/see_hide_pswd.css | 28 +++++ static/g_login/see_hide_pswd.js | 12 ++ static/h_tmp_user/a_home/get_contact_data.js | 118 +++++++++++++++++-- static/h_tmp_user/change_pswd.js | 21 +++- templates/b_about-us/about-us.html | 10 +- templates/g_login/login.html | 10 +- templates/h_tmp_usr/a_home.html | 64 +++++++++- templates/h_tmp_usr/f_change_pswd.html | 18 ++- 11 files changed, 317 insertions(+), 69 deletions(-) create mode 100644 static/g_login/see_hide_pswd.css create mode 100644 static/g_login/see_hide_pswd.js diff --git a/README.md b/README.md index 7f06177..f2f0f94 100644 --- a/README.md +++ b/README.md @@ -25,6 +25,7 @@ exit ``` # Añade las variables de entorno del proyecto al archivo envars + - si tienes problemas con las variables de entorno deberás de comentarlas y reiniciar apache, una vez reiniciado deberas descomentar las variables de entorno y volver a reiniciar apache ```bash sudo nano /etc/apache2/envvars ``` diff --git a/static/b_about-us/about-us.css b/static/b_about-us/about-us.css index d1ea372..db7b604 100644 --- a/static/b_about-us/about-us.css +++ b/static/b_about-us/about-us.css @@ -122,30 +122,30 @@ main { /* Tablets (768px - 1023px) */ @media (min-width: 768px) and (max-width: 1023px) { - + /* main { background-color: red; } */ main { - min-height: 130vh; + min-height: 150vh; } .expanding-panels { grid-template-columns: repeat(2, 1fr); .panel { - height: 64vh; + height: 75vh; } } } /* Laptops (1024px - 1439px) */ @media (min-width: 1024px) and (max-width: 1439px) { - + /* main { background-color: pink; } */ main { - height: 100vh; + height: 170vh; } .expanding-panels { grid-template-columns: repeat(2, 1fr); .panel { - height: 50vh; + min-height: 80vh; } } } diff --git a/static/c_solutions/solutions.css b/static/c_solutions/solutions.css index abfc6d0..13d9803 100644 --- a/static/c_solutions/solutions.css +++ b/static/c_solutions/solutions.css @@ -69,64 +69,92 @@ main { /* Smartphones (hasta 767px) */ @media (max-width: 767px) { + main { - min-height: 100vh; - background-size: auto 15%; + place-items: start; + min-height: 80vh; + background-size: 65% auto; border-radius: 15px; padding: 1em; /* Añadido para espacio interno */ } - + .parent { - width: 100% !important; - padding: 1em; /* Reducido el padding para móviles */ - + width: 100%; + padding: 1em; display: grid; - grid-template-columns: 1fr; /* Solo una columna en móviles */ - grid-template-rows: repeat(6, minmax(120px, 1fr)); /* Altura mínima garantizada */ - gap: 1em; /* Espacio reducido para móviles */ + grid-template-columns: repeat(2, 1fr); + grid-auto-rows: minmax(120px, auto); /* Renglones automáticos */ + gap: 1em; } - /* Asegurar que todos los divs sean visibles */ .parent div { - min-height: 120px; /* Altura mínima garantizada */ - width: 100% !important; + min-height: 120px; + width: 100%; background-size: contain; background-position: center; background-repeat: no-repeat; - border: 2px solid rgba(255, 255, 255, 0.5); /* Borde más visible */ + border: 2px solid rgba(255, 255, 255, 0.5); } - /* Posicionamiento específico para móviles */ - .ii-i { - grid-row: 4; /* Posición ajustada */ - } - - .ii-ii { - grid-row: 5; /* Posición ajustada */ - grid-column: 1; /* Reset para móviles */ - } + .ii-ii { + grid-column: 1 / span 2; /* Ocupa las dos columnas */ + grid-row: 3; /* Está en la tercera fila */ + justify-self: center; /* Centrado dentro de las dos columnas */ + width: 60%; + margin-top: 1em; + } + + } /* Tablets (768px - 1023px) */ @media (min-width: 768px) and (max-width: 1023px) { - .parent { - width: 100% !important; - height: 50vw; - gap: 2em; + main { + place-items: start; + min-height: 50vh; + background-size: auto 45%; + border-radius: 15px; + padding: 1em; } - main { - background-size: 50% auto; /* 30% del ancho del contenedor */ - height: 50vh; + .parent { + width: 100%; + padding: 1em; + display: grid; + grid-template-columns: repeat(3, 1fr); /* 3 columnas */ + grid-template-rows: repeat(2, minmax(120px, auto)); /* 2 filas */ + gap: 1em; + } + + .parent div { + min-height: 120px; + width: 100%; + background-size: contain; + background-position: center; + background-repeat: no-repeat; + border: 2px solid rgba(255, 255, 255, 0.5); + } + + /* Ajustes específicos de posición */ + + /* Primeros tres divs no necesitan ajuste, fluyen normalmente */ + + .ii-i { + grid-column: 1; /* Columna 1 */ + grid-row: 2; /* Fila 2 */ + } + + .ii-ii { + grid-column: 3; /* Columna 3 */ + grid-row: 2; /* Fila 2 */ } } /* Laptops (1024px - 1439px) */ @media (min-width: 1024px) and (max-width: 1439px) { - .parent { width: 100% !important; height: 65vw; @@ -134,8 +162,8 @@ main { } main { - background-size: 65% auto; /* 30% del ancho del contenedor */ - height: 65vh; + background-size: 50% auto; /* 30% del ancho del contenedor */ + height: 80vh; } } diff --git a/static/g_login/see_hide_pswd.css b/static/g_login/see_hide_pswd.css new file mode 100644 index 0000000..4e107c0 --- /dev/null +++ b/static/g_login/see_hide_pswd.css @@ -0,0 +1,28 @@ +.password-wrapper { + position: relative; +} + +.password-wrapper input { + width: 100%; + padding: 8px 35px 8px 10px; +} + +.password-toggle { + position: absolute; + right: 10px; + top: 50%; + transform: translateY(-50%); + cursor: pointer; + background: none; + border: none; + color: #666; +} + +input::-ms-reveal, +input::-ms-clear { + display: none; +} + +input::-webkit-credentials-auto-fill-button { + display: none !important; +} \ No newline at end of file diff --git a/static/g_login/see_hide_pswd.js b/static/g_login/see_hide_pswd.js new file mode 100644 index 0000000..4948a92 --- /dev/null +++ b/static/g_login/see_hide_pswd.js @@ -0,0 +1,12 @@ +const toggleBtn = document.getElementById('toggleBtn'); +const passwordField = document.getElementById('password'); + +toggleBtn.addEventListener('click', () => { + if (passwordField.type === 'password') { + passwordField.type = 'text'; + toggleBtn.innerHTML = ''; + } else { + passwordField.type = 'password'; + toggleBtn.innerHTML = ''; + } +}); \ No newline at end of file diff --git a/static/h_tmp_user/a_home/get_contact_data.js b/static/h_tmp_user/a_home/get_contact_data.js index 92cfcd5..10e01fc 100644 --- a/static/h_tmp_user/a_home/get_contact_data.js +++ b/static/h_tmp_user/a_home/get_contact_data.js @@ -30,19 +30,111 @@ async function get_contact_data(btn) { estatus: data[11] ?? "Sin Estatus" }; - modalBody.innerHTML = ` -

${contact.fecha} - ${contact.fecha_hora}

-

${contact.nombre} ${contact.apellido}

-

${contact.correo}

-

${contact.estado}

-

${contact.telefono}

-

${contact.tamano_empresa}

-

${contact.rol_contacto}

-

${contact.tipo_industria}

-

${contact.estatus}

-

${contact.comentarios}

- `; - + // modalBody.innerHTML = ` + //

${contact.fecha} - ${contact.fecha_hora}

+ //

${contact.nombre} ${contact.apellido}

+ //

${contact.correo}

+ //

${contact.estado}

+ //

${contact.telefono}

+ //

${contact.tamano_empresa}

+ //

${contact.rol_contacto}

+ //

${contact.tipo_industria}

+ //

${contact.estatus}

+ //

${contact.comentarios}

+ // `; + modalBody.innerHTML = ` +
+
+ + + + + + + + + +
+ +
+ + + + + + + +
+
+ +
+ +
+`; } catch (error) { console.error('Error al obtener datos:', error); } diff --git a/static/h_tmp_user/change_pswd.js b/static/h_tmp_user/change_pswd.js index 5950f68..290ef12 100644 --- a/static/h_tmp_user/change_pswd.js +++ b/static/h_tmp_user/change_pswd.js @@ -9,7 +9,8 @@ document.addEventListener('DOMContentLoaded', function () { lengt10: (pwd) => pwd.length >= 10, atl1num: (pwd) => /\d/.test(pwd), atl1mayusc: (pwd) => /[A-Z]/.test(pwd), - atl1chrspe: (pwd) => /[!"#$%&\/()=?¡]/.test(pwd) + // atl1chrspe: (pwd) => /[!@"#$%&\/()=?¡]/.test(pwd) + atl1chrspe: (pwd) => /[!@#$%&*()_+\-=[\]{};':"\\|,.<>\/?¡¿]/.test(pwd) }; newPswdInput.addEventListener('input', function () { @@ -27,4 +28,22 @@ document.addEventListener('DOMContentLoaded', function () { simpleNotification("Error", "La contraseña no cumple con todos los requisitos indicados.", "error"); } }); +}); + + +// ver contraseñas +const toggleButtons = document.querySelectorAll('.password-toggle'); + +toggleButtons.forEach(btn => { + btn.addEventListener('click', () => { + const passwordInput = btn.previousElementSibling; + + if (passwordInput.type === 'password') { + passwordInput.type = 'text'; + btn.innerHTML = ''; + } else { + passwordInput.type = 'password'; + btn.innerHTML = ''; + } + }); }); \ No newline at end of file diff --git a/templates/b_about-us/about-us.html b/templates/b_about-us/about-us.html index ad6b470..b63c2cc 100644 --- a/templates/b_about-us/about-us.html +++ b/templates/b_about-us/about-us.html @@ -11,9 +11,9 @@ {% block body %} -
+
-
+

¿Quiénes Somos?

@@ -27,7 +27,7 @@
-
+

Misión

@@ -40,7 +40,7 @@
-
+

Visión

@@ -53,7 +53,7 @@
-
+

Valores

diff --git a/templates/g_login/login.html b/templates/g_login/login.html index 8581547..21af38e 100644 --- a/templates/g_login/login.html +++ b/templates/g_login/login.html @@ -3,6 +3,7 @@ {% block css %} + {% endblock css %} {% block navbar %} @@ -34,8 +35,9 @@
-
+
{{ form.password(class_="form-control", placeholder="L4_c0ntr4z3ñ4", autocomplete="on") }} +
- {% endblock body %} {% block js %} - {% include 'z_comps/if_flash.html' %} - - {% include 'z_comps/aos_script.html' %} + + {% endblock js %} \ No newline at end of file diff --git a/templates/h_tmp_usr/a_home.html b/templates/h_tmp_usr/a_home.html index 51a8cda..f282e8f 100644 --- a/templates/h_tmp_usr/a_home.html +++ b/templates/h_tmp_usr/a_home.html @@ -73,6 +73,68 @@
+ + +