cheveguerra/Colaborando
1
0
Fork 0
mirror of https://github.com/cheveguerra/Colaborando.git synced 2026-08-19 00:46:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

style(ui): refactorizar layout en porcentajes y ajustar escala tipografica

Browse Source 
- Ajustar la cuadricula del tablero (.layout) a proporciones en porcentaje (18% 1fr 30%).
- Disponer botones de navegacion (.rail-btns) horizontalmente en un solo renglon.
- Reordenar el bloque de Acciones Posibles por encima de la Tabla de Activos en el Rail.
- Ajustar proporciones de Capacitaciones y Acciones a 70%/30% con botones flexibles.
- Ampliar escala tipografica en titulos, descripciones, tarjetas de departamentos y proyectos.
- Aumentar tamano del avatar de departamentos a 130px.
- Actualizar CONTEXT.md con la arquitectura y decisiones de la sesion.
This commit is contained in:
Cheve Guerra
2026-08-12 21:59:01 -06:00
parent 1ac6233e3c
commit 77c86122f0
3 changed files with 59 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files
estilos3.css
+26 -25
View File
@@ -41,13 +41,13 @@ body {
.canvas {
width: 100%;
max-width: 1680px;
/*max-width: 1680px;*/
margin: 0 auto;
}
.layout {
display: grid;
grid-template-columns: 260px 1fr 350px;
grid-template-columns: 18% 1fr 30%;
gap: 14px;
align-items: start;
}
@@ -98,7 +98,7 @@ body {
.rail-lbl {
font-family: var(--font-mono);
font-size: 10px;
font-size: 13px;
letter-spacing: .08em;
color: var(--text-faint);
text-transform: uppercase;
@@ -107,14 +107,14 @@ body {
.rail-btns {
display: flex;
flex-direction: column;
flex-direction: row;
gap: 5px;
}
.btn {
font-family: var(--font-display);
font-weight: 600;
font-size: 11px;
font-size: 13px;
padding: 6px 10px;
border-radius: 6px;
border: 1px solid var(--border);
@@ -581,7 +581,7 @@ table.activos td {
border-radius: 14px !important;
padding: 0 10px !important;
height: 28px !important;
font-size: 9px !important;
font-size: 13px !important;
font-weight: 700 !important;
cursor: pointer;
line-height: 1.2;
@@ -703,7 +703,7 @@ table.activos td {
.pf-title-block {
font-family: var(--font-body);
font-size: 14px;
font-size: 16px;
font-weight: 700;
line-height: 1.2;
color: var(--text);
@@ -713,7 +713,7 @@ table.activos td {
.pf-title-block span {
font-family: var(--font-mono);
font-size: 9px;
font-size: 13px;
letter-spacing: .08em;
color: var(--text-faint);
text-transform: uppercase;
@@ -722,7 +722,7 @@ table.activos td {
}
.pf-desc {
font-size: 10.5px;
font-size: 15px;
color: var(--text-dim);
line-height: 1.35;
}
@@ -1033,7 +1033,7 @@ table.activos td {
.pm-dept {
font-family: var(--font-mono);
font-size: 8px;
font-size: 12px;
font-weight: 700;
letter-spacing: .06em;
color: var(--text-faint);
@@ -1042,7 +1042,7 @@ table.activos td {
.pm-title {
font-family: var(--font-body);
font-size: 11.5px;
font-size: 13px;
font-weight: 700;
color: var(--text);
line-height: 1.25;
@@ -1053,7 +1053,7 @@ table.activos td {
.pm-puntos {
font-family: var(--font-mono);
font-size: 8.5px;
font-size: 12px;
font-weight: 700;
color: var(--green-ok);
line-height: 1.2;
@@ -1063,10 +1063,11 @@ table.activos td {
}
.pm-desc {
font-size: 9.5px;
font-size: 12px;
color: var(--text-dim);
line-height: 1.35;
display: -webkit-box;
line-clamp: 2;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
@@ -1091,7 +1092,7 @@ table.activos td {
border-radius: 12px !important;
padding: 2px 7px !important;
font-family: var(--font-mono) !important;
font-size: 9px !important;
font-size: 11px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
white-space: nowrap !important;
@@ -1188,7 +1189,7 @@ table.activos td {
/* Mantenimiento en Proyectos Chicos */
.pm-manto {
font-family: var(--font-mono);
font-size: 8.5px;
font-size: 11px;
font-weight: 700;
color: var(--text-faint);
letter-spacing: .04em;
@@ -1211,7 +1212,7 @@ table.activos td {
.pm-card #activoAsignado2,
.pm-card #activoAsignado3 {
font-family: var(--font-mono) !important;
font-size: 10px !important;
font-size: 12px !important;
font-weight: 800 !important;
line-height: 1 !important;
background: transparent !important;
@@ -1306,8 +1307,8 @@ table.activos td {
}
.dept-avatar-box {
width: 65px;
height: 65px;
width: 130px;
height: 130px;
border-radius: 10px;
background: var(--panel-2);
border: 1px solid var(--border-soft);
@@ -1319,7 +1320,7 @@ table.activos td {
}
.dept-avatar-box img {
height: 56px;
height: 123px;
width: auto;
object-fit: contain;
}
@@ -1351,7 +1352,7 @@ table.activos td {
border-radius: 8px;
background: var(--panel-2);
padding: 6px 10px;
font-size: 11px;
font-size: 15px;
color: var(--text-dim);
line-height: 1.3;
box-sizing: border-box;
@@ -1386,21 +1387,21 @@ table.activos td {
color: #C79A16 !important;
font-family: var(--font-mono);
font-weight: 700;
font-size: 10px;
font-size: 13px;
}
.val-personal {
color: #0E86A8 !important;
font-family: var(--font-mono);
font-weight: 700;
font-size: 10px;
font-size: 13px;
}
.val-capital {
color: #8A38C4 !important;
font-family: var(--font-mono);
font-weight: 700;
font-size: 10px;
font-size: 13px;
}
.dept-habilidades-acreditadas-list {
@@ -1413,7 +1414,7 @@ table.activos td {
.dept-hab-item {
color: var(--text);
font-size: 11px;
font-size: 15px;
line-height: 1.3;
}
@@ -1460,7 +1461,7 @@ table.activos td {
border-width: 5px;
}
.ui-dialog .ui-dialog-content {
font-size: 16px;
font-size: 15px;
font-weight: bold;
text-align: center;
}