add smooth open/close animations to mobile menu

[ritorhymes]

Description

On mobile, when the menus open and close to reveal or hide items, it happens instantly without an animation. But because of the screen size, it's kind of jarring to see basically 1/3 of the screen instantaneously jump around when the user is trying to navigate. Here I add a utility module mobile-animate-menu.js that smoothly animates the opening and closing of the hamburger menu and its submenus, affecting both the base and base-core versions. It doesn't require any new dependencies to run.

It's a modular addition that works with a single import in html-head.html without needing to edit, refactor or entangle itself in the base menu logic. It's implemented as an IIFE to encapsulate internal helpers and avoid global-scope pollution.

Behaviors

• Height transition based dynamically on measured scrollHeight
• Link and language selector fade-in on expand
• Collapse menu while submenu is expanded temporarily forces dark BG/border to avoid color artifacts
• Cleans up inline styles post-animation so CSS remains source of truth
• Scoped to mobile-menu only; desktop not affected

Note: Menu padding values are intentionally hardcoded. Computing them dynamically resulted in noticeable glitching in the animation. Comments in the file make mention of this for future maintenance.

Demo

bitcoin-menu-demo.mp4