native_convex_CRM/app/components/customerDetailHeader/customerDetailHeader.styles.ts
2026-07-24 13:15:31 +05:30

123 lines
2.5 KiB
TypeScript

import { StyleSheet } from 'react-native';
import { ThemeColors } from '../../theme';
export const getStyles = (colors: ThemeColors) =>
StyleSheet.create({
card: {
backgroundColor: colors.card,
borderRadius: 14,
padding: 14,
marginBottom: 16,
borderWidth: 1,
borderColor: colors.border,
shadowColor: '#0F172A',
shadowOffset: { width: 0, height: 2 },
shadowOpacity: 0.05,
shadowRadius: 4,
elevation: 2,
},
topRow: {
flexDirection: 'row',
alignItems: 'center',
marginBottom: 12,
},
avatarCircle: {
width: 44,
height: 44,
borderRadius: 22,
backgroundColor: colors.icon,
justifyContent: 'center',
alignItems: 'center',
marginRight: 10,
flexShrink: 0,
},
avatarInitial: {
color: '#FFFFFF',
fontSize: 16,
fontWeight: '700',
},
info: {
flex: 1,
marginRight: 8,
},
name: {
fontSize: 15,
fontWeight: '700',
color: colors.text,
marginBottom: 1,
},
company: {
fontSize: 12,
color: colors.textSecondary,
marginBottom: 2,
},
contact: {
fontSize: 11,
color: colors.textMuted,
lineHeight: 16,
},
dateText: {
fontSize: 11,
color: colors.textMuted,
marginTop: 2,
},
statusBadge: {
paddingHorizontal: 8,
paddingVertical: 4,
borderRadius: 20,
flexShrink: 0,
alignSelf: 'flex-start',
},
activeBadge: {
backgroundColor: '#D1FAE5',
},
inactiveBadge: {
backgroundColor: '#FEE2E2',
},
statusText: {
fontSize: 10,
fontWeight: '700',
},
activeText: {
color: '#059669',
},
inactiveText: {
color: '#DC2626',
},
actionRow: {
flexDirection: 'row',
gap: 10,
borderTopWidth: 1,
borderTopColor: colors.border,
paddingTop: 10,
},
actionBtn: {
flex: 1,
flexDirection: 'row',
height: 36,
borderRadius: 8,
justifyContent: 'center',
alignItems: 'center',
gap: 5,
borderWidth: 1,
},
primaryBtn: {
backgroundColor: colors.icon,
borderColor: colors.icon,
},
primaryBtnText: {
color: '#FFFFFF',
fontWeight: '600',
fontSize: 13,
},
secondaryBtn: {
backgroundColor: colors.background,
borderColor: colors.border,
},
secondaryBtnText: {
color: colors.textSecondary,
fontWeight: '600',
fontSize: 13,
},
});