Merge pull request #149 from OpenDTU-App/max-width-modal

Author: CommanderRedYT

licenses.json

@@ -77,7 +77,7 @@
         "licenseUrl": "https://github.com/expo/expo",
         "parents": "opendtu-react-native"
     },
-    "[email protected].1": {
+    "[email protected].2": {
         "licenses": "MIT",
         "repository": "https://github.com/i18next/i18next",
         "licenseUrl": "https://github.com/i18next/i18next/raw/master/LICENSE",

src/components/BaseModal.tsx

@@ -29,6 +29,9 @@ const BaseModal: FC<BaseModalProps> = ({
           ? { height: '100%', paddingBottom: spacing * 10 }
           : {}),
         backgroundColor: visible ? 'rgba(0, 0, 0, 0.5)' : undefined,
+        alignItems: 'center',
+        justifyContent: 'center',
+        flexDirection: 'row',
       }}
       contentContainerStyle={{
         backgroundColor: backgroundColor ?? theme.colors.elevation.level4,
@@ -38,6 +41,8 @@ const BaseModal: FC<BaseModalProps> = ({
         borderRadius: 28,
         marginVertical: 8,
         marginHorizontal: 24,
+        maxWidth: 450,
+        flex: 1,
       }}
     >
       {children}

src/views/navigation/tabs/InverterListTab.tsx

@@ -5,19 +5,19 @@ import { useTheme } from 'react-native-paper';
 import DeviceOfflineWrapper from '@/components/DeviceOfflineWrapper';
 import InverterList from '@/components/inverters/InverterList';
 
-import { StyledScrollView } from '@/style';
+import { StyledView } from '@/style';
 
 const InverterListTab: FC = () => {
   const theme = useTheme();
 
   return (
-    <StyledScrollView theme={theme}>
+    <StyledView theme={theme}>
       <DeviceOfflineWrapper>
         <Box style={{ flex: 1, justifyContent: 'flex-start', width: '100%' }}>
           <InverterList />
         </Box>
       </DeviceOfflineWrapper>
-    </StyledScrollView>
+    </StyledView>
   );
 };