MelissaPerfil mobile: drawer "Menu Perfil" ganha o menu de configs no topo

Refator (entendi corretamente agora): o drawer da pagina deve
PERSISTIR em mobile (botao "Menu Perfil" abre um slide-in da
esquerda com a info contextual). O que muda e que dentro do drawer,
no topo, tambem aparece o MENU GLOBAL DE CONFIGURACOES — em vez
de ficar fixado na lateral em desktop e desaparecer em mobile.

MelissaLayout:
- @media (max-width: 1023px) esconde .melissa-config-aside-host
- Reseta --m-config-aside-left pra 6px em mobile (pagina vira full-width)

MelissaPerfil:
- Restaura o drawer slide-in (drawerOpen + toggle/fechar)
- Restaura botao "Menu Perfil" no header mobile
- Drawer scroll wrapper agora tem dois filhos:
  1. .mpr-mobile-drawer__configs com `<MelissaConfigSidebar>`
  2. .mpr-mobile-drawer__contextual com Teleport target da
     sidebar contextual (Sua evolucao + Avatar + Sair)
- Removido o trecho de menu inline no body (que era o approach errado)

Em desktop nada muda — a sidebar global do MelissaLayout continua
fixa na esquerda (296px de left no inset das paginas).

Pendente: aplicar o mesmo pattern (Teleport do MelissaConfigSidebar
pro drawer da pagina, acima do contextual) nas outras 8 paginas.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Leonardo
2026-05-06 18:07:25 -03:00
parent d1dced242f
commit 27b5bbed6f
2 changed files with 143 additions and 59 deletions
+8 -1
View File
@@ -2474,7 +2474,9 @@ function onKeydown(e) {
Renderizado em qualquer rota de config (qualquer slug em
MELISSA_CONFIG_GRUPOS). Fica na lateral esquerda; as paginas
nativas usam var(--m-config-aside-left) no left do inset pra
abrir espaco automatico. */
abrir espaco automatico.
Em mobile (<1024px) some — o menu eh teleportado pro drawer
"Menu <secao>" de cada pagina (acima dos cards contextuais). */
.melissa-config-aside-host {
position: absolute;
top: 6px;
@@ -2489,6 +2491,11 @@ function onKeydown(e) {
from { opacity: 0; transform: translateX(-8px); }
to { opacity: 1; transform: translateX(0); }
}
@media (max-width: 1023px) {
.melissa-config-aside-host { display: none; }
/* Reseta a var pra paginas nao deixarem espaco vazio na esquerda */
.win11-root { --m-config-aside-left: 6px !important; }
}
/* ─── Plano de trás (resumo) ───────────────────────────────── */
.win11-summary {