diff --git a/CONTEXT.md b/CONTEXT.md index 3d19214..43cad09 100644 --- a/CONTEXT.md +++ b/CONTEXT.md @@ -11,13 +11,18 @@ El objetivo principal de esta sesión consistió en la creación e implementaci 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. **Garantía de Compatibilidad Total con `jsCode.js`**: +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`, `#renglonProyectos2`, `.droppableActivos`, etc.). + * **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`). -3. **Interacción y Drag & Drop**: +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). diff --git a/colaborando3.php b/colaborando3.php index 377c039..3bb6ac9 100644 --- a/colaborando3.php +++ b/colaborando3.php @@ -90,7 +90,6 @@ .rail-logo { text-align: center; - padding: 4px 0; } .rail-logo img { @@ -107,7 +106,6 @@ color: var(--text-dim); text-transform: uppercase; letter-spacing: .08em; - margin-top: 4px; text-align: center; } @@ -238,13 +236,13 @@ .timer-face { font-family: var(--font-mono); - font-size: 22px; + font-size: 20px; font-weight: 700; letter-spacing: .03em; background: #ffffffff; border: 1px solid var(--border); border-radius: 6px; - padding: 6px 0; + /*padding: 6px 0;*/ color: var(--gold); text-align: center; } @@ -372,17 +370,19 @@ #bAccion1, #bAccion2 { font-family: var(--font-mono) !important; font-weight: 700 !important; - font-size: 12px !important; - padding: 6px 16px !important; - border-radius: 6px !important; + font-size: 11px !important; + padding: 3px 8px !important; + border-radius: 5px !important; border: 1px solid var(--border) !important; background: var(--panel-2) !important; color: var(--text) !important; cursor: pointer !important; transition: all 0.15s ease !important; - min-width: 44px !important; + min-width: 28px !important; + height: 28px !important; text-align: center !important; box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important; + line-height: 1 !important; } #bAccion1:hover, #bAccion2:hover { @@ -499,6 +499,49 @@ text-align: center; } + /* Estilos de Tabla de Activos (#tablaActivos) con borde y texto en color del activo sobre fondo suave pastel */ + #tablaActivos td.actPersonalCalificado { + background-color: #FFFDF4 !important; + color: var(--a-personal) !important; + border: 1.5px solid var(--a-personal) !important; + font-weight: 700 !important; + } + + #tablaActivos td.actAnalistas { + background-color: #FFF9F3 !important; + color: var(--a-analistas) !important; + border: 1.5px solid var(--a-analistas) !important; + font-weight: 700 !important; + } + + #tablaActivos td.actFlujoDeEfectivo { + background-color: #F3FAF5 !important; + color: var(--a-flujo) !important; + border: 1.5px solid var(--a-flujo) !important; + font-weight: 700 !important; + } + + #tablaActivos td.actCreditoEInversion { + background-color: #F3F7FE !important; + color: var(--a-credito) !important; + border: 1.5px solid var(--a-credito) !important; + font-weight: 700 !important; + } + + #tablaActivos td.actTecnologia { + background-color: #FDF4F2 !important; + color: var(--a-tecnologia) !important; + border: 1.5px solid var(--a-tecnologia) !important; + font-weight: 700 !important; + } + + #tablaActivos td.actTransporteYMaquinaria { + background-color: #F3F5FA !important; + color: var(--a-transporte) !important; + border: 1.5px solid var(--a-transporte) !important; + font-weight: 700 !important; + } + /* Variables de Colores de Activos según la propuesta de diseño */ :root { --a-personal: #C79A16; @@ -1487,7 +1530,6 @@
Tiempo Restante
02:00
-
turno de 2 min
@@ -1523,25 +1565,32 @@
- +
-
- - + +
+
+ + +
+ Acciones
- - - - - - - -
- -
Acciones Quincenales
-
- - + + +
+ + + + + + + +
+ +
+ + +
@@ -1551,9 +1600,9 @@ - - - + + +
ACTIVOSProd.Recup.ACTIVOSProd.Recup.