Update display_global.php

This commit is contained in:
Lizandro Guarnizo
2026-06-11 22:12:35 -05:00
parent b365dab16f
commit 77da735575
+19 -18
View File
@@ -101,12 +101,14 @@ $_hasVideo = (bool)$_tvVideo;
/* ── Main body ── */ /* ── Main body ── */
.pg-body { .pg-body {
display: flex; display: grid;
align-items: center; grid-template-columns: 1fr;
justify-content: center;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
} }
.pg-body.has-video {
grid-template-columns: 1fr auto;
}
/* ── Turno activo (centro) ── */ /* ── Turno activo (centro) ── */
@@ -154,22 +156,22 @@ $_hasVideo = (bool)$_tvVideo;
color: #cbd5e1; color: #cbd5e1;
} }
/* ── Video reel flotante (9:16, alto completo) ── */ /* ── Video reel (9:16, alto completo, columna derecha) ── */
.reel-wrap { .reel-wrap {
display: none; display: none;
position: absolute; height: 100%;
right: 40px;
top: 50%;
transform: translateY(-50%);
height: calc(100% - 60px);
aspect-ratio: 9 / 16; aspect-ratio: 9 / 16;
border-radius: 20px;
overflow: hidden; overflow: hidden;
background: #000; background: #000;
box-shadow: 0 20px 60px rgba(0,0,0,.15), 0 0 0 1px rgba(255,255,255,.08); padding: 8px 8px 8px 0;
z-index: 10;
} }
.reel-wrap.has-video { display: block; } .reel-wrap.has-video { display: block; }
.reel-wrap .reel-inner {
width: 100%; height: 100%;
border-radius: 16px;
overflow: hidden;
box-shadow: -8px 0 30px rgba(0,0,0,.08);
}
.reel-wrap video { .reel-wrap video {
width: 100%; height: 100%; width: 100%; height: 100%;
object-fit: cover; object-fit: cover;
@@ -282,9 +284,6 @@ $_hasVideo = (bool)$_tvVideo;
} }
.stat-sep { width: 1px; height: 18px; background: #e2e8f0; } .stat-sep { width: 1px; height: 18px; background: #e2e8f0; }
@media (min-width: 1200px) {
.reel-wrap { width: 200px; height: 356px; }
}
</style> </style>
</head> </head>
<body> <body>
@@ -334,9 +333,11 @@ $_hasVideo = (bool)$_tvVideo;
<div class="pac-nombre" id="pac-nombre"></div> <div class="pac-nombre" id="pac-nombre"></div>
</div> </div>
<div class="reel-wrap <?= $_hasVideo ? 'has-video' : '' ?>" id="reel-wrap"> <div class="reel-wrap <?= $_hasVideo ? 'has-video' : '' ?>" id="reel-wrap">
<video autoplay muted loop playsinline> <div class="reel-inner">
<source src="<?= htmlspecialchars($_tvVideo) ?>"> <video autoplay muted loop playsinline>
</video> <source src="<?= htmlspecialchars($_tvVideo) ?>">
</video>
</div>
</div> </div>
</div> </div>