fix web-ridge#420

JedShiMing · Aug 27, 2024 · ba8b73e · ba8b73e
1 parent b0cafbb
commit ba8b73e
Showing 1 changed file with 31 additions and 25 deletions.
diff --git a/src/Date/DatePickerModal.tsx b/src/Date/DatePickerModal.tsx
@@ -5,6 +5,7 @@ import {
   useWindowDimensions,
   View,
   Platform,
+  Dimensions,
 } from 'react-native'
 import { useTheme } from 'react-native-paper'
 import DatePickerModalContent, {
@@ -75,33 +76,35 @@ export function DatePickerModal(
         supportedOrientations={supportedOrientations}
         statusBarTranslucent={true}
       >
-        <TouchableWithoutFeedback onPress={rest.onDismiss}>
-          <View
-            style={[
-              StyleSheet.absoluteFill,
-              sharedStyles.root,
-              { backgroundColor: theme.colors.backdrop },
-            ]}
-          />
-        </TouchableWithoutFeedback>
-        <View
-          style={[StyleSheet.absoluteFill, styles.modalRoot]}
-          pointerEvents="box-none"
-        >
+        <View style={styles.modal}>
+          <TouchableWithoutFeedback onPress={rest.onDismiss}>
+            <View
+              style={[
+                StyleSheet.absoluteFill,
+                sharedStyles.root,
+                { backgroundColor: theme.colors.backdrop },
+              ]}
+            />
+          </TouchableWithoutFeedback>
           <View
-            style={[
-              styles.modalContent,
-              { backgroundColor: theme.colors.surface },
-              dimensions.width > 650 ? styles.modalContentBig : null,
-            ]}
+            style={[StyleSheet.absoluteFill, styles.modalRoot]}
+            pointerEvents="box-none"
           >
-            <DatePickerModalContent
-              {...rest}
-              inputEnabled={inputEnabled}
-              disableSafeTop={disableStatusBarPadding}
-              disableStatusBar={disableStatusBar}
-              statusBarOnTopOfBackdrop={isPageSheet || statusBarOnTopOfBackdrop}
-            />
+            <View
+              style={[
+                styles.modalContent,
+                { backgroundColor: theme.colors.surface },
+                dimensions.width > 650 ? styles.modalContentBig : null,
+              ]}
+            >
+              <DatePickerModalContent
+                {...rest}
+                inputEnabled={inputEnabled}
+                disableSafeTop={disableStatusBarPadding}
+                disableStatusBar={disableStatusBar}
+                statusBarOnTopOfBackdrop={isPageSheet || statusBarOnTopOfBackdrop}
+              />
+            </View>
           </View>
         </View>
       </Modal>
@@ -110,6 +113,9 @@ export function DatePickerModal(
 }
 
 const styles = StyleSheet.create({
+  modal: {
+    height: Dimensions.get('screen').height
+  },
   modalContent: {
     flex: 1,
     width: '100%',