fix: hide navigation on keyboard visible
All checks were successful
Deploy to VPS (dist) / deploy (push) Successful in 1m35s
All checks were successful
Deploy to VPS (dist) / deploy (push) Successful in 1m35s
This commit is contained in:
@@ -168,9 +168,19 @@ export default function Navigation() {
|
||||
const [menuOpen, setMenuOpen] = useState<number>(0);
|
||||
const navRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
const viewportHeight = useTelegramViewportValue("height");
|
||||
const stableHeight = useTelegramViewportValue("stableHeight");
|
||||
const isKeyboardVisible = stableHeight - viewportHeight > 100;
|
||||
const [isKeyboardVisible, setIsKeyboardVisible] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const vv = window.visualViewport;
|
||||
if (!vv) return;
|
||||
|
||||
const onResize = () => {
|
||||
setIsKeyboardVisible(vv.height < window.innerHeight * 0.75);
|
||||
};
|
||||
|
||||
vv.addEventListener("resize", onResize);
|
||||
return () => vv.removeEventListener("resize", onResize);
|
||||
}, []);
|
||||
|
||||
const handleOutsideClick = useCallback((e: MouseEvent) => {
|
||||
if (navRef.current && !navRef.current.contains(e.target as Node)) {
|
||||
|
||||
Reference in New Issue
Block a user