usite-sas-bic/whatsapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(turnero): homologar UI/UX entre lugar y recepcion

Browse Source 
lugar.php:
- Cola: 340px→370px, border 1.5px→1px, border-radius 11px, padding .65rem .9rem,
  min-height 58px→62px (touch target)
- Cola header: font-size .72→.78rem, letter-spacing .06→.08em
- btn-llamar-next: padding .6→.65rem
- ficha-sec: padding 1rem 1.1rem→1.2rem, header .72→.78rem, .07→.08em
- consent-row: padding .55→.5rem, min-height 46px añadido
- Transición mobile: .22s→.2s
- Modal paciente: header plano→gradiente azul (#1043a0→#1565c0)

recepcion.php:
- cola-card: border-radius 10→11px
- prio-dot: border-radius 50%→9px (cuadrado redondeado, consistente con lugar)
- btn-accion-sec: font-size .8→.82rem

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lizandro Guarnizo
2026-07-04 12:57:50 -05:00
co-authored by Claude Sonnet 4.6
parent 400547bd7a
commit 54fc986d82
2 changed files with 20 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/turnero/views/lugar.php
+17 -16
View File
@@ -45,16 +45,16 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
/* ── Layout ─────────────────────────────────────────────── */
.lugar-layout {
display: grid;
grid-template-columns: 340px 1fr;
grid-template-columns: 370px 1fr;
height: calc(100vh - 52px);
overflow: hidden;
}
@media (max-width: 680px) {
.lugar-layout { grid-template-columns: 1fr; position: relative; overflow: hidden; }
.lugar-cola { transition: transform .22s ease; }
.lugar-cola { transition: transform .2s ease; }
.lugar-cola.mobile-oculta { transform: translateX(-100%); position: absolute; inset: 0; pointer-events: none; }
.lugar-ficha { position: absolute; inset: 0; background: #fff; z-index: 10;
transform: translateX(100%); transition: transform .22s ease; overflow-y: auto; }
transform: translateX(100%); transition: transform .2s ease; overflow-y: auto; }
.lugar-ficha.mobile-visible { transform: translateX(0); }
}
@@ -73,7 +73,7 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
display: flex; align-items: center; justify-content: space-between; margin-bottom: .65rem;
}
.cola-hdr-title {
font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
font-size: .78rem; text-transform: uppercase; letter-spacing: .08em;
color: #64748b; font-weight: 700;
}
.cola-counts { display: flex; gap: .4rem; align-items: center; }
@@ -85,7 +85,7 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
.cola-count-chip.servicio { background: #f0fdf4; color: #166534; border-color: #bbf7d0; }
.btn-llamar-next {
width: 100%; padding: .6rem 1rem; border: none; border-radius: 10px;
width: 100%; padding: .65rem 1rem; border: none; border-radius: 10px;
background: #2563eb; color: #fff; font-weight: 700; font-size: .92rem;
cursor: pointer; display: flex; align-items: center; justify-content: center; gap: .5rem;
transition: background .15s, transform .1s;
@@ -102,11 +102,11 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
}
.cola-card {
background: #fff; border: 1.5px solid #e2e8f0; border-radius: 11px;
padding: .6rem .8rem .6rem .7rem; margin-bottom: .3rem;
background: #fff; border: 1px solid #e2e8f0; border-radius: 11px;
padding: .65rem .9rem; margin-bottom: .3rem;
display: flex; align-items: center; gap: .55rem;
cursor: pointer; transition: border-color .15s, box-shadow .15s, background .15s;
min-height: 58px;
min-height: 62px;
}
.cola-card:hover { border-color: #a5b4fc; box-shadow: 0 2px 8px rgba(99,102,241,.12); }
.cola-card.activo { border-color: #6366f1; box-shadow: 0 0 0 2px #c7d2fe; }
@@ -216,11 +216,11 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
/* ── Secciones ──────────────────────────────────────────── */
.ficha-sec {
background: #f8fafc; border: 1px solid #e2e8f0;
border-radius: 12px; padding: 1rem 1.1rem; margin-bottom: .85rem;
border-radius: 12px; padding: 1.2rem; margin-bottom: .85rem;
}
.ficha-sec-hdr {
display: flex; align-items: center; gap: .4rem;
font-size: .72rem; text-transform: uppercase; letter-spacing: .07em;
font-size: .78rem; text-transform: uppercase; letter-spacing: .08em;
color: #475569; font-weight: 700; margin-bottom: .7rem;
}
.ficha-sec-hdr i { font-size: .85rem; }
@@ -241,8 +241,8 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
/* ── Consentimientos ── */
.consent-row {
display: flex; align-items: center; gap: .6rem;
padding: .55rem .7rem; border-radius: 10px; margin-bottom: .35rem;
font-size: .84rem; border: 1px solid transparent;
padding: .5rem .7rem; border-radius: 10px; margin-bottom: .35rem;
font-size: .84rem; border: 1px solid transparent; min-height: 46px;
}
.consent-row.firmado { background: #f0fdf4; color: #166534; border-color: #bbf7d0; }
.consent-row.rechazado { background: #f8fafc; color: #64748b; border-color: #e2e8f0; }
@@ -330,11 +330,12 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
}
.mpac-hdr {
display:flex; align-items:center; justify-content:space-between;
padding:13px 18px; border-bottom:1px solid #e2e8f0; flex-shrink:0; background:#f8fafc;
padding:1.1rem 1.25rem; border-bottom:1px solid rgba(255,255,255,.15); flex-shrink:0;
background:linear-gradient(135deg,#1043a0 0%,#1565c0 100%);
}
.mpac-hdr-title { font-weight:700; font-size:.97rem; color:#1e293b; display:flex; align-items:center; gap:.5rem; }
.mpac-close { background:none; border:none; font-size:1.2rem; color:#94a3b8; cursor:pointer; padding:2px 6px; border-radius:6px; }
.mpac-close:hover { background:#f1f5f9; color:#475569; }
.mpac-hdr-title { font-weight:700; font-size:.97rem; color:#fff; display:flex; align-items:center; gap:.5rem; }
.mpac-close { background:rgba(255,255,255,.15); border:none; font-size:1.1rem; color:#fff; cursor:pointer; padding:4px 8px; border-radius:6px; }
.mpac-close:hover { background:rgba(255,255,255,.25); }
.mpac-body { overflow-y:auto; padding:18px; flex:1; }
.mpac-dato { display:flex; gap:.5rem; align-items:baseline; margin-bottom:.4rem; }
.mpac-dato .lbl { font-size:.72rem; color:#94a3b8; min-width:95px; flex-shrink:0; }
modules/turnero/views/recepcion.php
+3 -3
View File
@@ -113,14 +113,14 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
.cola-items { flex: 1; overflow-y: auto; padding: .5rem; }
.cola-card {
background: #fff; border: 1px solid #e2e8f0;
border-radius: 10px; padding: .65rem .9rem;
border-radius: 11px; padding: .65rem .9rem;
margin-bottom: .4rem; cursor: default;
display: flex; align-items: center; gap: .6rem;
transition: box-shadow .15s;
}
.cola-card.activo { border-color: #3b82f6; box-shadow: 0 0 0 2px #bfdbfe; }
.cola-card .prio-dot {
width: 36px; height: 36px; border-radius: 50%;
width: 36px; height: 36px; border-radius: 9px;
display: flex; align-items: center; justify-content: center;
font-size: 1.1rem; font-weight: 800; color: #fff; flex-shrink: 0;
}
@@ -297,7 +297,7 @@ $adminNombre = $_SESSION['admin_user']['full_name'] ?? $_SESSION['admin_user']['
.accion-secondary-row { display: flex; gap: .4rem; flex-wrap: wrap; }
.btn-accion-sec {
flex: 1; min-width: 80px; padding: .55rem .5rem; border-radius: 9px;
font-size: .8rem; font-weight: 600; cursor: pointer;
font-size: .82rem; font-weight: 600; cursor: pointer;
display: flex; align-items: center; justify-content: center; gap: .35rem;
border: 1.5px solid; background: transparent; transition: background .12s;
}