From 440fd24c7957b92e95166882722a125776ed3613 Mon Sep 17 00:00:00 2001 From: 7w1 Date: Wed, 22 Jul 2026 13:43:09 -0500 Subject: [PATCH 1/6] fix(style): ensure popups respect mobile safe area --- src/app/components/SyncConnectionStatus.tsx | 2 +- .../global-banner/GlobalBannerRenderer.css.ts | 2 +- .../notification-banner/NotificationBanner.css.ts | 10 ++++------ src/app/styles/edgeToEdgeInsets.test.ts | 4 +++- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/app/components/SyncConnectionStatus.tsx b/src/app/components/SyncConnectionStatus.tsx index a15e957f19..8c72333487 100644 --- a/src/app/components/SyncConnectionStatus.tsx +++ b/src/app/components/SyncConnectionStatus.tsx @@ -65,7 +65,7 @@ export function SyncConnectionStatusBanner({ status }: SyncConnectionStatusProps { ); expect(notificationBannerStyles).toContain("position: 'fixed'"); - expect(notificationBannerStyles).toContain("top: 'env(safe-area-inset-top, 0)'"); + expect(notificationBannerStyles).toContain( + "top: 'var(--safe-area-inset-top, env(safe-area-inset-top, 0px))'" + ); expect(telemetryBannerStyles).toContain("position: 'fixed'"); }); }); From d8d32ca79d64458e711df9831ead8058811908d3 Mon Sep 17 00:00:00 2001 From: 7w1 Date: Wed, 22 Jul 2026 13:48:46 -0500 Subject: [PATCH 2/6] style: make bottom sheet extend off screen --- src/app/components/message/modals/Options.tsx | 2 +- src/app/features/room/message/styles.css.ts | 44 ++++++++++++++----- 2 files changed, 35 insertions(+), 11 deletions(-) diff --git a/src/app/components/message/modals/Options.tsx b/src/app/components/message/modals/Options.tsx index f8613c7bb1..0dd06a02ad 100644 --- a/src/app/components/message/modals/Options.tsx +++ b/src/app/components/message/modals/Options.tsx @@ -359,7 +359,7 @@ export function OptionsEmojiBoard({ anchor={emojiBoardAnchor} style={isModal ? { width: '100%' } : {}} content={ - + {dragOpts?.dragHandle} {ActualMessage} Date: Wed, 22 Jul 2026 13:57:05 -0500 Subject: [PATCH 3/6] default to 1 pronoun pill on mobile --- src/app/features/room/message/Message.tsx | 2 +- src/app/state/settings.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/features/room/message/Message.tsx b/src/app/features/room/message/Message.tsx index c6359ac2bd..a609041695 100644 --- a/src/app/features/room/message/Message.tsx +++ b/src/app/features/room/message/Message.tsx @@ -232,7 +232,7 @@ export const Pronouns = as< selectedLanguages ); - const limit = getSettings().pronounPillMaxCount ?? 3; + const limit = getSettings().pronounPillMaxCount ?? (mobileOrTablet() ? 1 : 3); const maxPillLength = getSettings().pronounPillMaxLength ?? 16; // if language specific pronouns can't be found matching the filter return unfiltered diff --git a/src/app/state/settings.ts b/src/app/state/settings.ts index 44a4aa964b..7c372af0ba 100644 --- a/src/app/state/settings.ts +++ b/src/app/state/settings.ts @@ -350,7 +350,7 @@ export const defaultSettings: Settings = { privacyBlurEmotes: false, showPronouns: true, parsePronouns: true, - pronounPillMaxCount: 3, + pronounPillMaxCount: mobileOrTablet() ? 1 : 3, pronounPillMaxLength: 16, renderGlobalNameColors: true, renderUserCards: 'both', From 8421e07557ae343b4822ce106a3656eb9209e6b1 Mon Sep 17 00:00:00 2001 From: 7w1 Date: Wed, 22 Jul 2026 14:01:54 -0500 Subject: [PATCH 4/6] harden mobile tauri checks --- src/app/components/editor/Editor.tsx | 5 ----- src/app/features/settings/general/General.tsx | 8 +++----- src/app/state/settings.ts | 2 +- src/app/utils/user-agent.ts | 10 ++++++++++ 4 files changed, 14 insertions(+), 11 deletions(-) diff --git a/src/app/components/editor/Editor.tsx b/src/app/components/editor/Editor.tsx index ab6e7f3ff2..5dcc9eea61 100644 --- a/src/app/components/editor/Editor.tsx +++ b/src/app/components/editor/Editor.tsx @@ -390,11 +390,6 @@ export const CustomEditor = forwardRef( const handleKeydown: KeyboardEventHandler = useCallback( (evt) => { - // mobile ignores config option - if (mobileOrTablet() && evt.key === 'Enter' && !evt.shiftKey) { - return; - } - onKeyDown?.(evt); const shortcutToggled = toggleKeyboardShortcut(editor, evt, shortcutOverrides); diff --git a/src/app/features/settings/general/General.tsx b/src/app/features/settings/general/General.tsx index b9b32ab850..3beb105341 100644 --- a/src/app/features/settings/general/General.tsx +++ b/src/app/features/settings/general/General.tsx @@ -418,7 +418,7 @@ function DateAndTime() { ); } -function Editor({ isMobile }: Readonly<{ isMobile: boolean }>) { +function Editor() { const [enterForNewline, setEnterForNewline] = useSetting(settingsAtom, 'enterForNewline'); const [editorToolbar, setEditorToolbar] = useSetting(settingsAtom, 'editorToolbar'); const [editorOldAddFile, setEditorOldAddFile] = useSetting(settingsAtom, 'editorOldAddFile'); @@ -438,18 +438,16 @@ function Editor({ isMobile }: Readonly<{ isMobile: boolean }>) { className={SequenceCardStyle} variant="SurfaceVariant" direction="Column" - style={{ opacity: isMobile ? 0.5 : 1 }} > } /> @@ -1611,7 +1609,7 @@ export function General({ requestBack, requestClose }: Readonly) { - + diff --git a/src/app/state/settings.ts b/src/app/state/settings.ts index 7c372af0ba..3e7c20c684 100644 --- a/src/app/state/settings.ts +++ b/src/app/state/settings.ts @@ -284,7 +284,7 @@ export const defaultSettings: Settings = { isPeopleDrawer: true, isWidgetDrawer: false, memberSortFilterIndex: 0, - enterForNewline: false, + enterForNewline: mobileOrTablet(), editorToolbar: false, editorOldAddFile: false, composerToolbarOpen: false, diff --git a/src/app/utils/user-agent.ts b/src/app/utils/user-agent.ts index 504198fed9..cbcf411409 100644 --- a/src/app/utils/user-agent.ts +++ b/src/app/utils/user-agent.ts @@ -1,8 +1,18 @@ +import { isTauri } from '@tauri-apps/api/core'; +import { type as osType } from '@tauri-apps/plugin-os'; import { UAParser } from 'ua-parser-js'; const result = new UAParser(window.navigator.userAgent).getResult(); const isMobileOrTablet = (() => { + if (isTauri()) { + try { + const tauriOs = osType(); + if (tauriOs === 'android' || tauriOs === 'ios') return true; + } catch { + // Fallback to UA parsing if plugin-os is not ready/available + } + } const { os, device } = result; if (device.type === 'mobile' || device.type === 'tablet') return true; if (os.name === 'Android' || os.name === 'iOS') return true; From d5ad3d24f8615e7ca2e4c647a7312c51f8dc91eb Mon Sep 17 00:00:00 2001 From: 7w1 Date: Wed, 22 Jul 2026 16:17:55 -0500 Subject: [PATCH 5/6] style: strengthen connection status glass effect --- src/app/components/SyncConnectionStatus.tsx | 29 ++++++++++++--------- 1 file changed, 16 insertions(+), 13 deletions(-) diff --git a/src/app/components/SyncConnectionStatus.tsx b/src/app/components/SyncConnectionStatus.tsx index 8c72333487..e4cb95baba 100644 --- a/src/app/components/SyncConnectionStatus.tsx +++ b/src/app/components/SyncConnectionStatus.tsx @@ -84,6 +84,21 @@ export function SyncConnectionStatusBanner({ status }: SyncConnectionStatusProps exit="exit" style={{ willChange: shouldReduceMotion ? 'opacity' : 'transform, opacity', + borderRadius: '9999px', + overflow: 'hidden', + backdropFilter: 'blur(64px) saturate(160%)', + WebkitBackdropFilter: 'blur(64px) saturate(160%)', + backgroundColor: `color-mix(in srgb, ${ + status.variant === 'Primary' + ? 'var(--sable-primary-main)' + : status.variant === 'Success' + ? 'var(--sable-success-main)' + : status.variant === 'Warning' + ? 'var(--sable-warn-main)' + : status.variant === 'Critical' + ? 'var(--sable-crit-main)' + : 'currentColor' + } 32%, transparent)`, }} > Date: Wed, 22 Jul 2026 16:22:20 -0500 Subject: [PATCH 6/6] formatting --- src/app/features/settings/general/General.tsx | 14 ++------------ 1 file changed, 2 insertions(+), 12 deletions(-) diff --git a/src/app/features/settings/general/General.tsx b/src/app/features/settings/general/General.tsx index 3beb105341..3d4fbdb3d8 100644 --- a/src/app/features/settings/general/General.tsx +++ b/src/app/features/settings/general/General.tsx @@ -434,22 +434,12 @@ function Editor() { return ( Editor - + - } + after={} />