@naarni/design-system
Version:
Naarni React Native Design System for EV Fleet Apps
54 lines (53 loc) • 1.49 kB
JavaScript
import { StyleSheet } from 'react-native';
import { useDeviceTheme } from '../../theme/deviceTheme';
export const useGridListStyles = () => {
const { colors, isDark } = useDeviceTheme();
return StyleSheet.create({
container: {
flex: 1,
backgroundColor: colors.background.default,
},
contentContainer: {
paddingHorizontal: 8,
paddingVertical: 4,
},
row: {
justifyContent: 'space-between',
paddingHorizontal: 8,
},
gridItem: {
backgroundColor: colors.surface.card,
borderRadius: 12,
overflow: 'hidden',
shadowColor: colors.common.black,
shadowOffset: {
width: 0,
height: 2,
},
shadowOpacity: isDark ? 0.3 : 0.1,
shadowRadius: 4,
elevation: 3,
},
itemImage: {
borderRadius: 12,
backgroundColor: colors.surface.border,
},
textContainer: {
padding: 12,
paddingTop: 8,
},
itemText: {
color: colors.text.primary,
fontWeight: '600',
marginBottom: 4,
fontSize: 16,
lineHeight: 20,
},
itemSubText: {
color: colors.text.secondary,
fontWeight: '400',
fontSize: 14,
lineHeight: 18,
},
});
};