Merge branch 'nicolas' into dev

frontend/static/componentes/pagina.js

@@ -101,7 +101,7 @@ class Pagina {
 			</div>
 			<div id="columna-principal" class="column is-5">
 				${new Breadcrumb(this.#ruta).render()}
-				${new Titulo('h1', 4, this.titulo, 'ml-3rem', 'titulo-principal').render()}
+				${new Titulo('h1', 4, this.titulo, 'm-3rem', 'titulo-principal').render()}
 				${this.partes ? this.partes.map((p) => p.render()).join("") : ''}
 				
 			</div>
@@ -118,12 +118,12 @@ class Pagina {
 			<div><img src="/logo-negativo.png"></div>
 			<div>
 				<ul>
-				<!-- TODO Refactor: que estos 3 links no se repitan acá y en Encabezado, DRY
-				<!--TODO UX Poner como una columna a la izquierda, porque se supone que tenga 3 items.-->
 					<li><a href="/">Inicio</a></li>
 					<li><a href="/quienes-somos">Quiénes Somos</a></li>
 					<li><a href="/manual">Ayuda</a></li>
 				</ul>
+			</div>
+			<div>
 				${new Navegacion(this.#sesion?.usuario).render()}
 			</div>
 			<div id="footer-enlaces-externos">

frontend/static/componentes/tabla.js

@@ -33,6 +33,7 @@ class Tabla {
 		// TODO	Feature: Conseguir la cantidad de páginas. Quizá con otra consulta...
 		let tabla = document.getElementById(this.#id);
 		let fieldset = tabla.querySelector('tfoot fieldset');
+		fieldset.className = 'fieldset-paginacion';
 
 		fetch(this.#endpointPaginacion, {
 			credentials: 'include',
@@ -111,9 +112,11 @@ class Tabla {
 
 	generarElementosPaginacion() {
 		// TODO Refactor: Hacer new Boton() (y elemento texto?)
-		return `<button class="fa-solid fa-caret-left" name=accion value=-1 ` + (this.pagina == 1 ? ' disabled' : '') + `></button>
-		<span>${this.pagina} / ${this.cantidadDePaginas}</span>
-		<button class="fa-solid fa-caret-right" name=accion value=1 `+ (this.pagina == this.cantidadDePaginas ? ' disabled' : '') + `></button>`;
+		return `<button class="boton-paginacion fa-solid fa-caret-left" name=accion value=-1 ` + (this.pagina == 1 ? ' disabled' : '') + `></button>
+		<div class="accion-boton">Anterior</div>
+		<span class="paginas">Página ${this.pagina} de ${this.cantidadDePaginas}</span>
+		<div class="accion-boton">Siguiente</div>
+		<button class="boton-paginacion fa-solid fa-caret-right" name=accion value=1 `+ (this.pagina == this.cantidadDePaginas ? ' disabled' : '') + `></button>`;
 	}
 
 	render() {

frontend/static/main.scss

@@ -581,20 +581,24 @@ footer#footer{
 	}
 
 	ul{
-		display: grid;
-		gap: .5rem;
-		grid-template-columns: 1fr 1fr;
-
+		font-size: 0.9rem;
+		li{
+			margin-bottom: 0.5rem;
+		}
 		a{
 			color: white;
 		}
 	}
 
 	#footer-enlaces-externos{
+		display: flex;
 		margin: auto;
 		text-align: center;
+		flex-direction: column;
 
 		a{
+			font-size: 0.9rem;
+			font-weight: 300;
 			margin: .5rem;
 			display: inline-block;
 			text-decoration: underline;
@@ -858,8 +862,9 @@ form > fieldset{
 .notification{
 	text-align: center;
 }
-.ml-3rem{
+.m-3rem{
 	margin-left: 3rem;
+	margin-right: 3rem;
 }
 .olvide-contrasenia{
 
@@ -948,4 +953,40 @@ tbody{
 	display: flex;
     margin: 1rem 3rem;
     justify-content: right;
+}
+
+.fieldset-paginacion{
+	width: 100%;
+	margin: 1rem 0 0;
+	align-items: center;
+    padding: 10px;
+    background: #f2f2f2;
+	button.boton-paginacion{
+		border-radius: 100%;
+		border: none;
+		padding: 10px 12px;
+		background-color: white;
+		color: #485fc7;
+		&:disabled{
+			color: #f2f2f2;
+			cursor: no-drop;
+			&:hover{
+				cursor: default;
+				background-color: white;
+			}
+		}
+		&:hover{
+			cursor: pointer;
+			background-color: rgba(0, 0, 0, 0.2);;
+		}
+	}
+	.accion-boton{
+		text-transform: uppercase;
+		font-size: 0.7rem;
+		color: #485fc7;
+		font-weight: 700;
+	}
+	.paginas{
+		color: gray;
+	}
 }

frontend/static/pantallas/perfil-propio-info.js

@@ -12,7 +12,7 @@ function crearPagina(ruta, sesion){
             new ChipUsuario(sesion.usuario, true, true),
             new Boton({
               titulo: "Cambiar Contraseña",
-              classes: "button is-link is-small is-rounded botonAgregar ml-3rem my-5",
+              classes: "button is-link is-small is-rounded botonAgregar m-3rem my-5",
               dataTarget: "modal-cambiar-contraseña",
               type: "button",
               id: "botonCambiarContraseña",

frontend/static/scripts/pregunta-viendo.js

@@ -11,6 +11,12 @@ modalElemento.addEventListener("submit", () => {
     modalElemento.classList.remove("is-active");
 });
 
+var formulario = document.getElementById('nueva-respuesta');
+var mensaje = document.createElement('div');
+mensaje.className = 'mensaje-respuesta';
+mensaje.textContent = 'Ten en cuenta que todos los usuarios de la plataforma podrán ver tu respuesta';
+formulario.querySelector('textarea').insertAdjacentElement('beforebegin', mensaje);
+
 
 let noBorrado = document.getElementById("botonBorrar");
 if (noBorrado) {

frontend/static/styles/pregunta-viendo.css

@@ -1 +1,13 @@
-#titulo-principal::before{content:"";font-family:FontAwesome;font-weight:normal;margin-right:1rem}/*# sourceMappingURL=pregunta-viendo.css.map */
+#titulo-principal::before {
+  content: "\f059";
+  font-family: FontAwesome;
+  font-weight: normal;
+  margin-right: 1rem;
+}
+
+.mensaje-respuesta {
+  font-size: 0.8rem;
+  margin: 0.5rem 0;
+  color: gray;
+  font-weight: 400;
+}/*# sourceMappingURL=pregunta-viendo.css.map */

frontend/static/styles/pregunta-viendo.scss

@@ -3,4 +3,11 @@
   font-family: FontAwesome;
   font-weight: normal;
   margin-right: 1rem;
+}
+
+.mensaje-respuesta{
+    font-size: 0.8rem;
+    margin: 0.5rem 0;
+    color: gray;
+    font-weight: 400;
 }