2 files changed, 34 insertions, 23 deletions
diff --git a/src/view/com/modals/report/ReportAccount.tsx b/src/view/com/modals/report/ReportAccount.tsx
index 237f2dc5d..47d647870 100644
--- a/src/view/com/modals/report/ReportAccount.tsx
+++ b/src/view/com/modals/report/ReportAccount.tsx
@@ -1,5 +1,6 @@
 import React, {useState, useMemo} from 'react'
 import {TouchableOpacity, StyleSheet, View} from 'react-native'
+import {ScrollView} from 'react-native-gesture-handler'
 import {ComAtprotoModerationDefs} from '@atproto/api'
 import {useStores} from 'state/index'
 import {s} from 'lib/styles'
@@ -13,7 +14,7 @@ import {isDesktopWeb} from 'platform/detection'
 import {SendReportButton} from './SendReportButton'
 import {InputIssueDetails} from './InputIssueDetails'
 
-export const snapPoints = [400]
+export const snapPoints = [500]
 
 export function Component({did}: {did: string}) {
   const store = useStores()
@@ -56,7 +57,9 @@ export function Component({did}: {did: string}) {
   }
 
   return (
-    <View testID="reportAccountModal" style={[styles.container, pal.view]}>
+    <ScrollView
+      testID="reportAccountModal"
+      style={[styles.container, pal.view]}>
       {showDetailsInput ? (
         <InputIssueDetails
           submitReport={onPress}
@@ -74,7 +77,7 @@ export function Component({did}: {did: string}) {
           goToDetails={goToDetails}
         />
       )}
-    </View>
+    </ScrollView>
   )
 }
 
@@ -176,5 +179,6 @@ const styles = StyleSheet.create({
   addDetailsBtn: {
     padding: 14,
     alignSelf: 'center',
+    marginBottom: 40,
   },
 })
diff --git a/src/view/com/modals/report/ReportPost.tsx b/src/view/com/modals/report/ReportPost.tsx
index fe2a5bca4..34ec8c2f2 100644
--- a/src/view/com/modals/report/ReportPost.tsx
+++ b/src/view/com/modals/report/ReportPost.tsx
@@ -1,5 +1,6 @@
 import React, {useState, useMemo} from 'react'
 import {Linking, StyleSheet, TouchableOpacity, View} from 'react-native'
+import {ScrollView} from 'react-native-gesture-handler'
 import {ComAtprotoModerationDefs} from '@atproto/api'
 import {useStores} from 'state/index'
 import {s} from 'lib/styles'
@@ -66,26 +67,28 @@ export function Component({
   }
 
   return (
-    <View testID="reportPostModal" style={[s.flex1, s.pl10, s.pr10, pal.view]}>
-      {showTextInput ? (
-        <InputIssueDetails
-          details={details}
-          setDetails={setDetails}
-          goBack={goBack}
-          submitReport={submitReport}
-          isProcessing={isProcessing}
-        />
-      ) : (
-        <SelectIssue
-          setShowTextInput={setShowTextInput}
-          error={error}
-          issue={issue}
-          setIssue={setIssue}
-          submitReport={submitReport}
-          isProcessing={isProcessing}
-        />
-      )}
-    </View>
+    <ScrollView testID="reportPostModal" style={[s.flex1, pal.view]}>
+      <View style={styles.container}>
+        {showTextInput ? (
+          <InputIssueDetails
+            details={details}
+            setDetails={setDetails}
+            goBack={goBack}
+            submitReport={submitReport}
+            isProcessing={isProcessing}
+          />
+        ) : (
+          <SelectIssue
+            setShowTextInput={setShowTextInput}
+            error={error}
+            issue={issue}
+            setIssue={setIssue}
+            submitReport={submitReport}
+            isProcessing={isProcessing}
+          />
+        )}
+      </View>
+    </ScrollView>
   )
 }
 
@@ -232,6 +235,10 @@ const SelectIssue = ({
 }
 
 const styles = StyleSheet.create({
+  container: {
+    paddingHorizontal: 10,
+    paddingBottom: 40,
+  },
   title: {
     textAlign: 'center',
     fontWeight: 'bold',