From 885971a13c79fe8055e386e610b5c9fdb4452641 Mon Sep 17 00:00:00 2001
From: wiktorrudzki <wiktor1rudzki@gmail.com>
Date: Sat, 13 Jan 2024 13:59:20 +0100
Subject: [PATCH] add global styling file, update readme

---
 App.tsx   |  4 +++-
 README.md |  4 +++-
 style.ts  | 17 +++++++++++++++++
 3 files changed, 23 insertions(+), 2 deletions(-)
 create mode 100644 style.ts

diff --git a/App.tsx b/App.tsx
index 0afc4a8..b8f7370 100644
--- a/App.tsx
+++ b/App.tsx
@@ -1,5 +1,6 @@
 import { StatusBar } from 'expo-status-bar';
 import { StyleSheet, Text, View } from 'react-native';
+import { globalStyles } from 'style';
 
 const App = () => {
   return (
@@ -12,7 +13,8 @@ const App = () => {
 
 const styles = StyleSheet.create({
   container: {
-    flex: 1,
+    ...globalStyles.horizontalFlex,
+    ...globalStyles.centerFlex,
     backgroundColor: 'white',
     alignItems: 'center',
     justifyContent: 'center',
diff --git a/README.md b/README.md
index 5ff5a3a..543a975 100644
--- a/README.md
+++ b/README.md
@@ -26,7 +26,9 @@
 
 ## Styling
 
-<!-- TODO -->
+### File **_style.ts_** contains all contains all global styling that are being used in app (flex, grid, variables etc.)
+
+`You should declare all reusable stylings there`
 
 ## Form
 
diff --git a/style.ts b/style.ts
new file mode 100644
index 0000000..d36a146
--- /dev/null
+++ b/style.ts
@@ -0,0 +1,17 @@
+import { StyleSheet } from 'react-native';
+
+const globalStyles = StyleSheet.create({
+  verticalFlex: {
+    display: 'flex',
+    flexDirection: 'column',
+  },
+  horizontalFlex: {
+    display: 'flex',
+  },
+  centerFlex: {
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+});
+
+export { globalStyles };