components/ScreenWrapper.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

import React from "react";
import { View, StyleSheet, Platform } from "react-native";

type Props = {
  children: React.ReactNode;
  style?: object;
};

const ScreenWrapper = ({ children, style }: Props) => {
  return (
    <View style={styles.outer}>
      <View style={[styles.inner, style]}>{children}</View>
    </View>
  );
};

const styles = StyleSheet.create({
  outer: {
    flex: 1,
    alignItems: "center",
    justifyContent: "flex-start",
  },
  inner: {
    width: "100%",

    maxWidth: Platform.OS === "web" ? 420 : "100%",
    flexGrow: 1,
  },
});

export default ScreenWrapper;