search

roninoss / create-expo-stack

CLI tool to initialize a React Native application with Expo. Provides options to include Typescript, file-based routing via Expo Router, configuration based routing via pure React Navigation, styling via Nativewind, Restyle, Unistyles, StyleSheets, or Tamagui, and/or backend as a service such as Firebase and Supabase.
https://rn.new
MIT License
1.37k stars 77 forks source link

Container component padding is not applied #378

Closed Savinvadim1312 closed 1 week ago

Savinvadim1312 commented 1 month ago

Expected Behavior

The customer <Container /> component generated by CES is supposed to have padding.

Possible Solution

import { SafeAreaView } from 'react-native';

export const Container = ({ children }: { children: React.ReactNode }) => {
  return <SafeAreaView className={styles.container}>{children}</SafeAreaView>;
};

const styles = {
  container: 'flex flex-1 p-5',
};

The styles have p-5 however, the SafeAreaView ignores the padding property, because it is used internally to manage the safe area.

One solution would be to render a View with padding inside the SafeAreaView.

danstepanov commented 1 week ago

fixed in https://github.com/roninoss/create-expo-stack/commit/b5374ea3cfc9c5ce4e08bd02c7abdedfb0f69282