EC NO SHIFT UI
Clique no botão abaixo para abrir o modal e esconder a scrollbar.
Evite o Layout Shift ao Esconder a Scrollbar
Sabe quando você abre um modal e o conteúdo da página dá aquele pequeno "pulo" pro lado? Isso acontece porque a scrollbar desaparece e altera a largura da viewport — um problema sutil, mas que quebra a fluidez da interface.
No artigo que publicamos no Medium, mostramos como resolver isso de
forma simples e eficaz: calculando dinamicamente a largura da
scrollbar e compensando com um
padding
no
body
— tudo sem depender de bibliotecas externas.
A solução é leve, reutilizável e pode ser aplicada em modais, bottom sheets, overlays, e qualquer situação que exija o bloqueio da rolagem do fundo.
Veja o exemplo a cima em ação e, se quiser entender os bastidores, clique no botão abaixo para ler o artigo completo:
