fix(kiosko): corregir touch en Edge kiosk mode
- touch-action: manipulation directo en cada botón e input (no solo en body) - -ms-touch-action para compatibilidad Edge legacy - position: relative en .kiosko-wrap para contener screens absolutas - inset: 0 en .screen.hidden para que no se salga del contenedor Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 4.6
parent
868263fe6f
commit
728d78f606
@@ -96,6 +96,7 @@ unset($p);
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* ── Header con logo ── */
|
||||
@@ -150,6 +151,8 @@ unset($p);
|
||||
transition: background .15s;
|
||||
flex-shrink: 0;
|
||||
line-height: 1;
|
||||
touch-action: manipulation;
|
||||
-ms-touch-action: manipulation;
|
||||
}
|
||||
.btn-fullscreen:hover { background: rgba(255,255,255,.28); }
|
||||
|
||||
@@ -164,7 +167,7 @@ unset($p);
|
||||
transition: opacity .3s ease, transform .3s ease;
|
||||
overflow: hidden;
|
||||
}
|
||||
.screen.hidden { opacity: 0; pointer-events: none; transform: scale(.98); position: absolute; }
|
||||
.screen.hidden { opacity: 0; pointer-events: none; transform: scale(.98); position: absolute; inset: 0; }
|
||||
.screen.visible { opacity: 1; pointer-events: all; transform: scale(1); position: relative; }
|
||||
|
||||
/* ── Instrucción central ── */
|
||||
@@ -203,6 +206,8 @@ unset($p);
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,.10);
|
||||
-webkit-user-select: none; user-select: none;
|
||||
background: #fff;
|
||||
touch-action: manipulation;
|
||||
-ms-touch-action: manipulation;
|
||||
}
|
||||
.btn-prioridad:active { transform: scale(.95); filter: brightness(.93); }
|
||||
.btn-prioridad:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.13); }
|
||||
@@ -236,6 +241,8 @@ unset($p);
|
||||
font-size: 1.2rem;
|
||||
box-shadow: 0 1px 4px rgba(0,0,0,.05);
|
||||
transition: border-color .2s, box-shadow .2s;
|
||||
touch-action: manipulation;
|
||||
-ms-touch-action: manipulation;
|
||||
}
|
||||
.form-kiosko .form-control:focus {
|
||||
border-color: var(--brand);
|
||||
@@ -251,6 +258,8 @@ unset($p);
|
||||
box-shadow: 0 4px 16px color-mix(in srgb, var(--brand) 40%, transparent);
|
||||
transition: transform .12s, box-shadow .12s, filter .12s;
|
||||
width: 100%; margin-top: 1rem;
|
||||
touch-action: manipulation;
|
||||
-ms-touch-action: manipulation;
|
||||
}
|
||||
.btn-kiosko-main:active { transform: scale(.97); filter: brightness(.9); }
|
||||
.btn-kiosko-back {
|
||||
@@ -259,6 +268,8 @@ unset($p);
|
||||
color: #94a3b8; border-radius: 12px; padding: .7rem 1.5rem;
|
||||
font-size: 1.07rem; cursor: pointer; margin-top: .6rem; width: 100%;
|
||||
transition: background .12s, border-color .12s;
|
||||
touch-action: manipulation;
|
||||
-ms-touch-action: manipulation;
|
||||
}
|
||||
.btn-kiosko-back:hover { background: var(--brand-mid); border-color: var(--brand); color: var(--brand-dark); }
|
||||
|
||||
@@ -328,6 +339,8 @@ unset($p);
|
||||
font-size: 1.1rem; font-weight: 600; cursor: pointer;
|
||||
color: var(--brand-dark); background: #fff;
|
||||
transition: background .15s, border-color .15s;
|
||||
touch-action: manipulation;
|
||||
-ms-touch-action: manipulation;
|
||||
}
|
||||
.btn-nuevo:hover { background: var(--brand-light); border-color: var(--brand); }
|
||||
|
||||
|
||||
Reference in New Issue
Block a user