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/ui/Input.tsx | 21 +++++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

(limited to 'apps/mobile/components/ui/Input.tsx')

diff --git a/apps/mobile/components/ui/Input.tsx b/apps/mobile/components/ui/Input.tsx
index 01c9fb2f..57d16f5d 100644
--- a/apps/mobile/components/ui/Input.tsx
+++ b/apps/mobile/components/ui/Input.tsx
@@ -2,6 +2,8 @@ import { forwardRef } from "react";
 import { Text, TextInput, View } from "react-native";
 import { cn } from "@/lib/utils";
 
+import { TailwindResolver } from "../TailwindResolver";
+
 export interface InputProps
   extends React.ComponentPropsWithoutRef<typeof TextInput> {
   label?: string;
@@ -13,13 +15,20 @@ const Input = forwardRef<React.ElementRef<typeof TextInput>, InputProps>(
   ({ className, label, labelClasses, inputClasses, ...props }, ref) => (
     <View className={cn("flex flex-col gap-1.5", className)}>
       {label && <Text className={cn("text-base", labelClasses)}>{label}</Text>}
-      <TextInput
-        ref={ref}
-        className={cn(
-          inputClasses,
-          "rounded-lg border border-input px-4 py-2.5",
+      <TailwindResolver
+        className="text-gray-400"
+        comp={(styles) => (
+          <TextInput
+            placeholderTextColor={styles?.color?.toString()}
+            ref={ref}
+            className={cn(
+              "bg-background text-foreground",
+              inputClasses,
+              "rounded-lg border border-input px-4 py-2.5",
+            )}
+            {...props}
+          />
         )}
-        {...props}
       />
     </View>
   ),
-- 
cgit v1.2.3-70-g09d2