mirror of
https://github.com/cheveguerra/Colaborando.git
synced 2026-08-19 00:46:37 +00:00
cheveguerra
656359af48
Rediseno visual de la Tabla de Activos (#tablaActivos). Compactacion del bloque de Capacitaciones y Acciones en la columna izquierda en 2 renglones horizontales. Centrado horizontal de activos requeridos y pagados en proyectos secundarios. Actualizacion de CONTEXT.md. Preservacion 100% intacta de jsCode.js.
34 lines
3.0 KiB
Markdown
34 lines
3.0 KiB
Markdown
# CONTEXTO DEL PROYECTO - COLABORANDO
|
|
|
|
## Resumen Ejecutivo de la Sesión
|
|
|
|
El objetivo principal de esta sesión consistió en la creación e implementación de **`colaborando3.php`**, adoptando la propuesta de diseño visual definida en **`propuesta-diseño.html`**, asegurando al 100% que el motor de lógica y eventos del juego (**`jsCode.js`**) permanezca intacto y sin ninguna modificación.
|
|
|
|
---
|
|
|
|
## Decisiones Principales y Arquitectura
|
|
|
|
1. **Creación de `colaborando3.php` basada en `propuesta-diseño.html`**:
|
|
* Se aplicó la nueva interfaz gráfica con paletas de color Tailwind/HSL, tipografía Inter/JetBrains Mono, estética pastel en tarjetas de departamento y activos, y maquetación responsive.
|
|
* Se rediseñó el **Proyecto en Turno (Grande)** y los **Proyectos Activos Secundarios** (`#proyecto_1` a `#proyecto_6`) para presentar etiquetas compactas de activos, contadores de activos pagados sin fondo sólido y bloques de mantenimiento integrados.
|
|
* Se centraron horizontalmente las píldoras de activos requeridos, contadores pagados y texto de mantenimiento en los proyectos secundarios.
|
|
|
|
2. **Ajustes en la Columna Izquierda (Rail)**:
|
|
* **Capacitaciones y Acciones**: Se compactó el bloque en 2 renglones (Renglón 1: Checkbox Capacitaciones + Etiqueta Acciones; Renglón 2: `#tablaHabilidadesAcreditadas` con `#haNombre` y `#haCosto` + botones de acción `#bAccion1` y `#bAccion2` con dimensiones reducidas).
|
|
* **Tabla de Activos (`#tablaActivos`)**: Se estilizó la primera columna de nombres de activos con fondos suaves pastel, bordes `1.5px solid` y texto en el color característico de cada activo (Dorado, Naranja, Verde, Azul, Rojo, Azul Marino).
|
|
|
|
3. **Garantía de Compatibilidad Total con `jsCode.js`**:
|
|
* **Sin Cambios en JS**: `jsCode.js` se mantiene 100% idéntico a la versión del repositorio.
|
|
* **Jerarquía DOM Preservada**: Se adaptó el HTML/CSS de `colaborando3.php` para mantener intactos los IDs y selectores requeridos por `jsCode.js` (`#TablaProyectoGde`, `#activosProyectoGde`, `#activoReqProyectoNom1..3`, `#activoReqProyectoCant1..3`, `#tablaHabilidadesAcreditadas`, `#haNombre`, `#haCosto`, `#bAccion1`, `#bAccion2`, `#tablaActivos`, etc.).
|
|
* **Inmunidad de Estilos**: Se configuraron selectores CSS específicos por ID para que las tarjetas conserven su formato compacto y colores de activo incluso cuando `jsCode.js` limpia o inyecta clases dinámicamente (`llenaProyectoGde`, `llenaProyectoChico2`).
|
|
|
|
4. **Interacción y Drag & Drop**:
|
|
* Se ajustó el z-index de los elementos arrastrados (`.ui-draggable-dragging`) para flotar por encima de la interfaz.
|
|
* Se eliminaron clases duplicadas (`droppableActivos`) en contenedores anidados para asegurar que cada evento de arrastrar y soltar se ejecute una sola vez (+1 activo).
|
|
|
|
---
|
|
|
|
## Tareas Pendientes / Próximos Pasos
|
|
|
|
* Realizar pruebas de juego completas en `colaborando3.php` para validar la rotación de turnos, la eliminación/completado de proyectos mediante el modal `#quitarProyectoCompleto` y el cálculo de recursos quincenales.
|