apply theme

This commit is contained in:
Jakob Stornig 2024-01-02 13:47:21 +01:00
parent 6cee616ad5
commit 3c458c964b
6 changed files with 29 additions and 26 deletions

View file

@ -1,34 +1,33 @@
import React from 'react';
import { ColorValue, StyleSheet, Text, View } from 'react-native';
import { SIZES } from '../../constants/theme';
import { useThemeColor } from '../../hooks/useThemeColor';
import CustomCard from "../common/CustomCard";
import { useTheme } from '../../app/contexts/ThemeContext';
export type ExpenseItemProps = {color: ColorValue, category: string, title: string, date: string, value : string}
export default function ExpenseItem(itemProps : ExpenseItemProps) {
const textColor = useThemeColor("primaryText");
const backgroundColor = useThemeColor("backgroundColor")
const { colors } = useTheme();
return (
<CustomCard>
<View style={[styles.colorTip, {backgroundColor: itemProps.color}]}></View>
<View style={[styles.textSection, {backgroundColor: backgroundColor}]}>
<View style={[styles.textSection, {backgroundColor: colors.backgroundColor}]}>
<Text style={{
fontSize: SIZES.normal,
color: textColor
color: colors.primaryText
}} numberOfLines={1}>{itemProps.category}</Text>
<Text style={{
fontSize: SIZES.large,
color: textColor
color: colors.primaryText
}} numberOfLines={1}>{itemProps.title}</Text>
<Text style={{
fontSize: SIZES.small,
color: textColor
color: colors.primaryText
}} numberOfLines={1}>{itemProps.date}</Text>
</View>
<View style={[styles.valueSection, {backgroundColor: backgroundColor}]}>
<View style={[styles.valueSection, {backgroundColor: colors.backgroundColor}]}>
<Text style={{
fontSize: SIZES.xxLarge,
color: textColor
color: colors.primaryText
}} numberOfLines={1}>{itemProps.value}</Text>
</View>