diff --git a/src/client/assets/styles/mobile_ux.css b/src/client/assets/styles/mobile_ux.css index e0e8147..0325922 100644 --- a/src/client/assets/styles/mobile_ux.css +++ b/src/client/assets/styles/mobile_ux.css @@ -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; +}