From 3549a977cc6af26bd7288a2e5efc92f5cf4ab94a Mon Sep 17 00:00:00 2001 From: Leonardo Date: Wed, 6 May 2026 16:07:03 -0300 Subject: [PATCH] MelissaSeguranca: pagina min 1000px de largura no desktop Antes era right: 50% fixo, o que dava ~512px em viewports 1024-1100 (cramped p/ um form de senha + sidebar 320px). Agora right = min(50%, calc(100% - 1006px)): - viewport < 2012: page fixa em 1000px (nao shrink) - viewport >= 2012: page = 50% (sobra mais espaco no lado direito) Mobile (<1024px) continua full-width via media query existente. Co-Authored-By: Claude Opus 4.7 (1M context) --- src/layout/melissa/MelissaSeguranca.vue | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/src/layout/melissa/MelissaSeguranca.vue b/src/layout/melissa/MelissaSeguranca.vue index 442d1bb..bb0c208 100644 --- a/src/layout/melissa/MelissaSeguranca.vue +++ b/src/layout/melissa/MelissaSeguranca.vue @@ -923,12 +923,15 @@ onMounted(async () => { /* ═══════ Desktop (>=1024px) ═══════ */ @media (min-width: 1024px) { - /* Pagina ocupa ~50% da largura util, alinhada a esquerda — pq - Seguranca tem so 1 form pequeno (Trocar senha) e nao precisa - de toda a largura. inset top/bottom mantidos do base; left - fica em 6px (igual base) e right vai pra 50%. */ + /* Pagina alinhada a esquerda com largura ~50%, mas com minimo + de 1000px pra nao ficar cramped em viewports medios. + Formula: right = min(50%, calc(100% - 1006px)) + - viewport >= 2012px : right = 50% (page ocupa ~50%) + - viewport < 2012px : right = 100%-1006 (page fica em 1000px) + Em viewports < 1024px, o media query mobile la embaixo + restaura full-width, entao min funciona suave. */ .mse-page { - right: 50%; + right: min(50%, calc(100% - 1006px)); } /* Sidebar: cards min-h 300 + max-h 100% + body scroll */