salas: estando dentro, los controles arriba y en rejilla

Silenciar, camara, levantar la mano, salir... quedaban debajo de toda la
ficha de la sala, a 1.100px. Con la sala en directo el panel va primero, los
controles en rejilla de dos y Salir en rojo. Solo CSS.
This commit is contained in:
hacklab 2026-10-19 14:14:09 +02:00
parent 6bacafea64
commit b65dde1263

View file

@ -510,3 +510,24 @@ form.oasis-phone-state .oasis-phone-state-btn {
/* el aviso de bienvenida, encima del lanzador: debajo quedaba a 1.300px y quien
abria la app por primera vez no lo veia */
body > .welcome-banner { order: -1; margin-top: 10px !important; }
/* ---------- dentro de una sala: los controles a mano ---------- */
/* silenciar, camara, levantar la mano, salir... quedaban debajo de toda la ficha de
la sala (a 1.100px). Estando dentro, el panel en directo va primero y los
controles en rejilla de dos */
.main-column .tribe-details:has(.room-live-panel) > .tribe-main { order: -1; }
.main-column div.room-live-controls { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px !important; }
.main-column .room-live-controls form { margin: 0 !important; width: 100% !important; }
.main-column .room-live-controls button {
width: 100% !important; min-height: 48px !important; margin: 0 !important; padding: 6px 8px !important;
font-size: 15px !important; box-shadow: none !important;
}
.main-column .room-live-controls form[action="/rooms/leave"] { grid-column: 1 / -1; }
.main-column .room-live-controls form[action="/rooms/leave"] button { background: var(--ux-danger) !important; color: #fff !important; border-color: var(--ux-danger) !important; }
.main-column .room-live-controls :is(label, a.tribe-action-btn, .room-stream-form label) {
display: flex !important; align-items: center; justify-content: center; width: 100% !important; min-height: 48px !important;
margin: 0 !important; padding: 6px 8px !important; box-sizing: border-box;
border: var(--a26-bd-fino, 2px solid var(--ux-line)) !important; border-radius: var(--ux-radius) !important;
background: var(--ux-bg) !important; color: var(--ux-fg) !important; box-shadow: none !important;
font-family: var(--ux-text) !important; font-weight: 700 !important; font-size: 15px !important; text-transform: uppercase; text-decoration: none !important;
}