118 lines
2.8 KiB
TypeScript
118 lines
2.8 KiB
TypeScript
|
import { StyleSheet } from 'react-native';
|
||
|
|
import { Spacing, BorderRadius, Theme } from '@/constants/theme';
|
||
|
|
|
||
|
|
export const createStyles = (theme: Theme) => {
|
||
|
|
return StyleSheet.create({
|
||
|
|
scrollContent: {
|
||
|
|
flexGrow: 1,
|
||
|
|
paddingHorizontal: Spacing.lg,
|
||
|
|
paddingTop: Spacing.xl,
|
||
|
|
paddingBottom: Spacing["5xl"],
|
||
|
|
},
|
||
|
|
header: {
|
||
|
|
marginBottom: Spacing.xl,
|
||
|
|
},
|
||
|
|
calorieCard: {
|
||
|
|
padding: Spacing.xl,
|
||
|
|
marginBottom: Spacing.lg,
|
||
|
|
borderRadius: BorderRadius.xl,
|
||
|
|
shadowColor: theme.primary,
|
||
|
|
shadowOffset: { width: 0, height: 4 },
|
||
|
|
shadowOpacity: 0.1,
|
||
|
|
shadowRadius: 12,
|
||
|
|
elevation: 4,
|
||
|
|
},
|
||
|
|
weightCard: {
|
||
|
|
padding: Spacing.xl,
|
||
|
|
marginBottom: Spacing.xl,
|
||
|
|
borderRadius: BorderRadius.xl,
|
||
|
|
shadowColor: theme.primary,
|
||
|
|
shadowOffset: { width: 0, height: 4 },
|
||
|
|
shadowOpacity: 0.1,
|
||
|
|
shadowRadius: 12,
|
||
|
|
elevation: 4,
|
||
|
|
},
|
||
|
|
cardHeader: {
|
||
|
|
flexDirection: 'row',
|
||
|
|
alignItems: 'center',
|
||
|
|
marginBottom: Spacing.lg,
|
||
|
|
},
|
||
|
|
iconContainer: {
|
||
|
|
width: 48,
|
||
|
|
height: 48,
|
||
|
|
borderRadius: BorderRadius.lg,
|
||
|
|
backgroundColor: theme.backgroundTertiary,
|
||
|
|
justifyContent: 'center',
|
||
|
|
alignItems: 'center',
|
||
|
|
marginRight: Spacing.md,
|
||
|
|
},
|
||
|
|
calorieContent: {
|
||
|
|
flexDirection: 'row',
|
||
|
|
alignItems: 'baseline',
|
||
|
|
marginBottom: Spacing.md,
|
||
|
|
},
|
||
|
|
weightContent: {
|
||
|
|
flexDirection: 'row',
|
||
|
|
alignItems: 'baseline',
|
||
|
|
marginBottom: Spacing.md,
|
||
|
|
},
|
||
|
|
progressBar: {
|
||
|
|
height: 8,
|
||
|
|
backgroundColor: theme.backgroundTertiary,
|
||
|
|
borderRadius: BorderRadius.full,
|
||
|
|
overflow: 'hidden',
|
||
|
|
marginBottom: Spacing.sm,
|
||
|
|
},
|
||
|
|
progressFill: {
|
||
|
|
height: '100%',
|
||
|
|
backgroundColor: theme.primary,
|
||
|
|
borderRadius: BorderRadius.full,
|
||
|
|
},
|
||
|
|
remainingText: {
|
||
|
|
textAlign: 'right',
|
||
|
|
},
|
||
|
|
quickActions: {
|
||
|
|
flexDirection: 'row',
|
||
|
|
justifyContent: 'space-between',
|
||
|
|
marginBottom: Spacing.xl,
|
||
|
|
gap: Spacing.md,
|
||
|
|
},
|
||
|
|
actionButton: {
|
||
|
|
flex: 1,
|
||
|
|
padding: Spacing.lg,
|
||
|
|
borderRadius: BorderRadius.xl,
|
||
|
|
alignItems: 'center',
|
||
|
|
shadowColor: theme.primary,
|
||
|
|
shadowOffset: { width: 0, height: 2 },
|
||
|
|
shadowOpacity: 0.15,
|
||
|
|
shadowRadius: 8,
|
||
|
|
elevation: 3,
|
||
|
|
},
|
||
|
|
cameraButton: {
|
||
|
|
backgroundColor: theme.primary,
|
||
|
|
},
|
||
|
|
chartButton: {
|
||
|
|
backgroundColor: '#10B981',
|
||
|
|
},
|
||
|
|
aiButton: {
|
||
|
|
backgroundColor: '#059669',
|
||
|
|
},
|
||
|
|
actionIconContainer: {
|
||
|
|
marginBottom: Spacing.sm,
|
||
|
|
},
|
||
|
|
recentSection: {
|
||
|
|
marginBottom: Spacing.xl,
|
||
|
|
},
|
||
|
|
sectionHeader: {
|
||
|
|
flexDirection: 'row',
|
||
|
|
justifyContent: 'space-between',
|
||
|
|
alignItems: 'center',
|
||
|
|
marginBottom: Spacing.lg,
|
||
|
|
},
|
||
|
|
emptyText: {
|
||
|
|
textAlign: 'center',
|
||
|
|
paddingVertical: Spacing["2xl"],
|
||
|
|
},
|
||
|
|
});
|
||
|
|
};
|