diff --git a/CHANGELOG.md b/CHANGELOG.md index 84439d4..41c9e09 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,8 @@ * Add space membership management and bans * Add event info to profile dialog * Add better room membership management +* Refactor stores for performance +* Hide nav when keyboard is open # 1.5.3 diff --git a/src/app.css b/src/app.css index c82bfaf..366d1dd 100644 --- a/src/app.css +++ b/src/app.css @@ -392,6 +392,16 @@ progress[value]::-webkit-progress-value { @apply md:bottom-sai bottom-[calc(var(--saib)+3.5rem)]; } +/* Keyboard open state adjustments */ + +body.keyboard-open .cb { + @apply bottom-sai; +} + +body.keyboard-open .bottom-nav { + display: none; +} + /* chat view */ .chat__compose { diff --git a/src/app/components/PrimaryNav.svelte b/src/app/components/PrimaryNav.svelte index dcf3ad6..3e62f0f 100644 --- a/src/app/components/PrimaryNav.svelte +++ b/src/app/components/PrimaryNav.svelte @@ -110,9 +110,10 @@ {@render children?.()} -
+
+
+ class="bottom-nav border-top bottom-sai fixed left-0 right-0 z-nav h-14 border border-base-200 bg-base-100 md:hidden">
diff --git a/src/app/util/keyboard.ts b/src/app/util/keyboard.ts new file mode 100644 index 0000000..40441cd --- /dev/null +++ b/src/app/util/keyboard.ts @@ -0,0 +1,21 @@ +import {Capacitor} from '@capacitor/core' +import {Keyboard} from "@capacitor/keyboard" +import {noop} from '@welshman/lib' + +export const syncKeyboard = () => { + if (!Capacitor.isNativePlatform()) return noop + + const showListener = Keyboard.addListener("keyboardWillShow", () => { + document.body.classList.add("keyboard-open") + }) + + const hideListener = Keyboard.addListener("keyboardWillHide", () => { + document.body.classList.remove("keyboard-open") + }) + + return () => { + showListener.then(listener => listener.remove()) + hideListener.then(listener => listener.remove()) + document.body.classList.remove("keyboard-open") + } +} diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 424a4b1..1119ff9 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -37,6 +37,7 @@ import {initializePushNotifications} from "@app/util/push" import * as notifications from "@app/util/notifications" import * as storage from "@app/util/storage" + import {syncKeyboard} from "@app/util/keyboard" import NewNotificationSound from "@src/app/components/NewNotificationSound.svelte" const {children} = $props() @@ -134,6 +135,9 @@ // Subscribe to badge count for changes unsubscribers.push(notifications.badgeCount.subscribe(notifications.handleBadgeCountChanges)) + // Initialize keyboard state tracking + unsubscribers.push(syncKeyboard()) + // Listen for signer errors, report to user via toast unsubscribers.push( signerLog.subscribe(