fix: add button margins and reduce text container margins to prevent cutoff

Author: danstepanov

.changeset/fix-button-margins.md

@@ -0,0 +1,9 @@
+---
+'create-expo-stack': patch
+'rn-new': patch
+---
+
+Add horizontal margins to button wrapper in Nativewind templates to prevent full-width buttons.
+
+- Add button wrapper View with `mx-4` class (16px horizontal margins) around Link/Button components in the Nativewind Expo Router stack template
+- Ensures buttons have proper spacing and don't stretch to fill the entire screen width

cli/src/templates/packages/expo-router/stack/app/index.tsx.ejs

@@ -30,13 +30,19 @@ export default function Home() {
           <InternalizationExample />
         <% } %>
         </ScreenContent>
+        <% if (props.stylingPackage?.name === "nativewind") { %>
+        <View className={styles.buttonWrapper}>
+        <% } %>
         <Link href={{ pathname: '/details', params: { name: 'Dan' } }} asChild>
           <% if (props.stylingPackage?.name === "unistyles") { %>
               <Button title="Show Details" style={styles.button} />
           <% } else { %>
               <Button title="Show Details" />
           <% } %>
         </Link>
+        <% if (props.stylingPackage?.name === "nativewind") { %>
+        </View>
+        <% } %>
       </Container>
     </View>
   );
@@ -45,7 +51,8 @@ export default function Home() {
 <% if (props.stylingPackage?.name === "nativewind") { %>
 const styles = {
   container: "flex flex-1 bg-white",
-}
+  buttonWrapper: "mx-4",
+};
 <% } else if (props.stylingPackage?.name === "stylesheet") { %>
 const styles = StyleSheet.create({
   container: {