upd: redesign

Deskripsi:
- fitur ganti mode tema
- penerapan tema pada semua fitur

NO Issues

components/paperGridContent.tsx

@@ -1,5 +1,6 @@
 import { ColorsStatus } from "@/constants/ColorsStatus";
 import Styles from "@/constants/Styles";
+import { useTheme } from "@/providers/ThemeProvider";
 import { Pressable, View } from "react-native";
 import Text from "./Text";
 
@@ -11,15 +12,21 @@ type Props = {
    onPress?: () => void
    contentPosition?: 'top' | 'center'
    titleTail?: number
+   height?: number
 };
-export default function PaperGridContent({ content, children, title, headerColor, onPress, contentPosition, titleTail }: Props) {
+export default function PaperGridContent({ content, children, title, headerColor, onPress, contentPosition, titleTail, height }: Props) {
+   const { colors } = useTheme();
    return (
       <Pressable onPress={onPress}>
-         <View style={[content == 'carousel' ? Styles.wrapGridCaraousel : Styles.wrapGridContent, headerColor == 'warning' ? ColorsStatus.warning : ColorsStatus.primary]}>
+         <View style={[content == 'carousel' ? Styles.wrapGridCaraousel : Styles.wrapGridContent, headerColor == 'warning' ? ColorsStatus.warning : { backgroundColor: colors.primary }]}>
             <View style={[Styles.headerPaperGrid]}>
-               <Text numberOfLines={titleTail ? titleTail : undefined} style={[Styles.textSubtitle, headerColor == 'warning' ? Styles.cDefault : Styles.cWhite, {textAlign: 'center' }]}>{title}</Text>
+               <Text numberOfLines={titleTail ? titleTail : undefined} style={[Styles.textSubtitle, headerColor == 'warning' ? Styles.cDefault : Styles.cWhite, { textAlign: 'center' }]}>{title}</Text>
             </View>
-            <View style={[contentPosition && contentPosition == 'top' ? Styles.contentPaperGrid2 : Styles.contentPaperGrid]}>
+            <View style={[
+               contentPosition && contentPosition == 'top' ? Styles.contentPaperGrid2 : Styles.contentPaperGrid,
+               { backgroundColor: colors.card },
+               height ? { height: height } : {}
+            ]}>
                {children}
             </View>
          </View>