From c46482cdaaf883971736488750513663dd023076 Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Wed, 17 Apr 2024 17:56:21 +0100
Subject: mobile: Add dark mode support

---
 apps/mobile/components/navigation/stack.tsx | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 apps/mobile/components/navigation/stack.tsx

(limited to 'apps/mobile/components/navigation/stack.tsx')

diff --git a/apps/mobile/components/navigation/stack.tsx b/apps/mobile/components/navigation/stack.tsx
new file mode 100644
index 00000000..f53b3652
--- /dev/null
+++ b/apps/mobile/components/navigation/stack.tsx
@@ -0,0 +1,27 @@
+import { TextStyle, ViewStyle } from "react-native";
+import { Stack } from "expo-router/stack";
+import { cssInterop } from "nativewind";
+
+interface StackProps extends React.ComponentProps<typeof Stack> {
+  contentStyle?: ViewStyle;
+  headerStyle?: TextStyle;
+}
+
+function StackImpl({ contentStyle, headerStyle, ...props }: StackProps) {
+  props.screenOptions = {
+    ...props.screenOptions,
+    contentStyle,
+    headerStyle: {
+      backgroundColor: headerStyle?.backgroundColor?.toString(),
+    },
+    navigationBarColor: contentStyle?.backgroundColor?.toString(),
+    headerTintColor: headerStyle?.color?.toString(),
+  };
+  return <Stack {...props} />;
+}
+
+// Changing this requires reloading the app
+export const StyledStack = cssInterop(StackImpl, {
+  contentClassName: "contentStyle",
+  headerClassName: "headerStyle",
+});
-- 
cgit v1.2.3-70-g09d2