mirror of
https://github.com/maziggy/bambuddy.git
synced 2026-10-21 10:15:04 +02:00
Fix virtual keyboard overlaying input fields on SpoolBuddy settings
When the virtual keyboard opened on the SpoolBuddy device tab, the API token field and Save button were hidden behind the keyboard. The keyboard now adds bottom scroll padding and scrolls the parent card (not just the focused input) to the top of the visible area, keeping all related fields accessible.
This commit is contained in:
@@ -71,10 +71,12 @@ export function VirtualKeyboard() {
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
(keyboardRef.current as any)?.setInput?.(activeInput.current.value);
|
||||
|
||||
// Add scroll padding then scroll input into view above the keyboard
|
||||
// Add scroll padding then scroll the input's parent card into view above the keyboard
|
||||
addScrollPadding(target);
|
||||
setTimeout(() => {
|
||||
target.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||
// Scroll the closest card/section so the entire group of fields is visible
|
||||
const card = target.closest('.bg-zinc-800, .rounded-lg, [data-vkb-group]') as HTMLElement | null;
|
||||
(card ?? target).scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||
}, 100);
|
||||
}, [addScrollPadding]);
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
+1
-1
@@ -23,7 +23,7 @@
|
||||
|
||||
<!-- Splash screens for iOS -->
|
||||
<link rel="apple-touch-startup-image" href="/img/android-chrome-512x512.png" />
|
||||
<script type="module" crossorigin src="/assets/index-C7t_l7cK.js"></script>
|
||||
<script type="module" crossorigin src="/assets/index-R2cnQRS0.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-CZLTApPU.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
Reference in New Issue
Block a user