Resolve "Budget"

components/common/CustomCard.tsx

@@ -0,0 +1,49 @@
+import React from 'react'
+import { Platform, StyleSheet, View } from 'react-native'
+import { ViewProps } from 'react-native/Libraries/Components/View/ViewPropTypes'
+import { useThemeColor } from '../../hooks/useThemeColor'
+
+function generateBoxShadowStyle(
+  xOffset: number,
+  yOffset: number,
+  shadowColorIos: string,
+  shadowOpacity: number,
+  shadowRadius: number,
+  elevation: number,
+  shadowColorAndroid: string
+):void {
+  if(Platform.OS === 'ios'){
+    styles.boxShadow = {
+      shadowColor: shadowColorIos,
+      shadowOffset : {width: xOffset, height: yOffset},
+      shadowOpacity,
+      shadowRadius,
+      backgroundColor: useThemeColor("backgroundColor")
+    }
+  }else if (Platform.OS === 'android'){
+    styles.boxShadow = {
+      elevation: elevation,
+      shadowColor: shadowColorAndroid,
+    };
+  }
+}
+
+export default function CustomCard(props : ViewProps) {
+  generateBoxShadowStyle(1, 1, '#171717', 0.2, 20, 10, '#171717')
+  return (
+    <View style={[styles.container, styles.boxShadow, props.style]}>
+      {props.children}
+    </View>
+  )
+}
+
+const styles = StyleSheet.create({
+  container:{
+    flexDirection: "row",
+    alignItems: "stretch",
+    alignContent: "space-between",
+    borderRadius: 20,
+    marginHorizontal: 10,
+  },
+  boxShadow: {},
+})