added header, mock reminders

app/(auth)/reminders/index.tsx

@@ -1,7 +1,46 @@
-import {View} from "react-native-ui-lib";
-
+import { Card, Text, View } from "react-native-ui-lib";
+import { StyleSheet } from "react-native";
+import RemindersList from "@/components/pages/reminders/remindersList";
 export default function Screen() {
-    return (
-        <View/>
-    )
-}
+  return (
+    <View height={"100%"} backgroundColor="#fdf8f5">
+      <View style={styles.banner} height={"27%"} flexS>
+        <View style={styles.greetingContainer}>
+          <Text text70L color="white">
+            Good Morning,
+          </Text>
+          <Text color="white" text30BL>
+            Hello Ryanae!
+          </Text>
+        </View>
+        <View centerV style={styles.footerContainer}>
+          <Text text30>😇</Text>
+        </View>
+      </View>
+      <RemindersList />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  banner: {
+    backgroundColor: "#f68d51",
+    height: "27%",
+  },
+  greetingContainer: {
+    marginLeft: "8%",
+    paddingTop: 15,
+    paddingBottom: 20,
+    flex: 1,
+    flexDirection: "column",
+    justifyContent: "space-between",
+  },
+  footerContainer: {
+    height: 70,
+    backgroundColor: "#f9b076",
+    marginTop: "auto",
+    borderTopLeftRadius: 30,
+    marginLeft: "8%",
+    paddingLeft: "5%",
+  },
+});