better Layout component

Author: flexbox

hackathon/revolut-kids-clone/App.tsx

@@ -8,7 +8,7 @@ export default function App() {
     <View className="flex-1 items-center justify-center bg-sky-400">
       <Text>Open up App.tsx to start working on your app!</Text>
       <StatusBar style="auto" />
-      <Row>
+      <Row containerStyle="justify-around w-full py-4">
         <Button variant="primary">Log in</Button>
         <Button variant="secondary">Sign up</Button>
       </Row>

hackathon/revolut-kids-clone/src/components/Layout.tsx

@@ -3,8 +3,10 @@ import React from "react";
 
 type ButtonProps = {
   children: React.ReactNode;
+  containerStyle?: string;
 };
 
-export const Row = ({ children }: ButtonProps) => {
-  return <View className="flex-row">{children}</View>;
+export const Row = ({ children, containerStyle }: ButtonProps) => {
+  console.log("file: Layout.tsx ~ line 10 ~ Row ~ className", containerStyle);
+  return <View className={`${containerStyle} flex-row`}>{children}</View>;
 };