make some settings screens scrollable for accessibility (#4819)

* make settings scrollable for accessibility

* nit

2 files changed, 6 insertions, 6 deletions

diff --git a/src/screens/Messages/Settings.tsx b/src/screens/Messages/Settings.tsx
index df469d13f..b1c52582f 100644
--- a/src/screens/Messages/Settings.tsx
+++ b/src/screens/Messages/Settings.tsx
@@ -11,7 +11,7 @@ import {useProfileQuery} from '#/state/queries/profile'
 import {useSession} from '#/state/session'
 import * as Toast from '#/view/com/util/Toast'
 import {ViewHeader} from '#/view/com/util/ViewHeader'
-import {CenteredView} from '#/view/com/util/Views'
+import {ScrollView} from '#/view/com/util/Views'
 import {atoms as a, useTheme} from '#/alf'
 import {Divider} from '#/components/Divider'
 import * as Toggle from '#/components/forms/Toggle'
@@ -55,7 +55,7 @@ export function MessagesSettingsScreen({}: Props) {
   )
 
   return (
-    <CenteredView sideBorders style={a.h_full_vh}>
+    <ScrollView stickyHeaderIndices={[0]}>
       <ViewHeader title={_(msg`Chat Settings`)} showOnDesktop showBorder />
       <View style={[a.p_lg, a.gap_md]}>
         <Text style={[a.text_lg, a.font_bold]}>
@@ -149,6 +149,6 @@ export function MessagesSettingsScreen({}: Props) {
           </>
         )}
       </View>
-    </CenteredView>
+    </ScrollView>
   )
 }
diff --git a/src/view/screens/NotificationsSettings.tsx b/src/view/screens/NotificationsSettings.tsx
index 2716a07f9..8955119a6 100644
--- a/src/view/screens/NotificationsSettings.tsx
+++ b/src/view/screens/NotificationsSettings.tsx
@@ -8,7 +8,7 @@ import {AllNavigatorParams, NativeStackScreenProps} from '#/lib/routes/types'
 import {useNotificationFeedQuery} from '#/state/queries/notifications/feed'
 import {useNotificationsSettingsMutation} from '#/state/queries/notifications/settings'
 import {ViewHeader} from '#/view/com/util/ViewHeader'
-import {CenteredView} from '#/view/com/util/Views'
+import {ScrollView} from '#/view/com/util/Views'
 import {atoms as a, useTheme} from '#/alf'
 import {Error} from '#/components/Error'
 import * as Toggle from '#/components/forms/Toggle'
@@ -34,7 +34,7 @@ export function NotificationsSettingsScreen({}: Props) {
     : serverPriority
 
   return (
-    <CenteredView style={a.flex_1} sideBorders>
+    <ScrollView stickyHeaderIndices={[0]}>
       <ViewHeader
         title={_(msg`Notification Settings`)}
         showOnDesktop
@@ -89,6 +89,6 @@ export function NotificationsSettingsScreen({}: Props) {
           </View>
         </View>
       )}
-    </CenteredView>
+    </ScrollView>
   )
 }