feat: add NoTruck variant, center layout padding, match green colors
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 10s
Build & Deploy / 🧪 QA (push) Failing after 1m20s
Build & Deploy / 🏗️ Build (push) Has been skipped
Build & Deploy / 🚀 Deploy (push) Has been skipped
Build & Deploy / 🧪 Post-Deploy Verification (push) Has been skipped
Build & Deploy / 🔔 Notify (push) Successful in 3s

This commit is contained in:
2026-06-12 10:21:56 +02:00
parent 1b7fecff4a
commit ec0c71a6a6
13 changed files with 46 additions and 12 deletions

View File

@@ -47,6 +47,7 @@ export interface PDFBusinessCardProps {
qrCodeDataUrl: string;
variant?: 'blue' | 'white' | 'black';
isViaprinto?: boolean;
withTruck?: boolean;
}
// Die Buchstaben K, L, Z im SVG (inklusive dem kleinen Stück vom Z oben links)
@@ -161,8 +162,8 @@ const styles = StyleSheet.create({
// -- WHITE PAGE (Vorderseite) --
backContainer: {
flex: 1,
paddingTop: '6mm',
paddingBottom: '6mm',
paddingTop: '8mm',
paddingBottom: '10mm',
paddingLeft: '6mm',
paddingRight: '6mm',
flexDirection: 'column',
@@ -261,7 +262,7 @@ const styles = StyleSheet.create({
qrCodeWrapper: {
width: '12mm',
height: '12mm',
border: `0.75pt solid ${COLORS.green}`,
border: `0.75pt solid ${COLORS.darkGreen}`,
padding: 2.5,
backgroundColor: '#ffffff',
},
@@ -275,7 +276,7 @@ const styles = StyleSheet.create({
justifyContent: 'center',
alignItems: 'center',
position: 'absolute',
bottom: '2mm',
bottom: '3.5mm',
},
addressFooterText: {
fontSize: 7, // increased from 6
@@ -692,6 +693,7 @@ export const PDFBusinessCard: React.FC<PDFBusinessCardProps> = ({
qrCodeDataUrl,
variant = 'blue',
isViaprinto = false,
withTruck = true,
}) => {
const isWhiteVariant = variant === 'white' || variant === 'black';
@@ -739,13 +741,15 @@ export const PDFBusinessCard: React.FC<PDFBusinessCardProps> = ({
size={[258, 173]}
style={[styles.pageBleed, isWhiteVariant && { backgroundColor: '#ffffff' }]}
>
<View style={styles.truckWrapper}>
<TruckBlueprint
style={styles.frontBackgroundImage}
opacity={isWhiteVariant ? 0.2 : 0.25}
backgroundColor={isWhiteVariant ? '#ffffff' : '#011dff'}
/>
</View>
{withTruck && (
<View style={styles.truckWrapper}>
<TruckBlueprint
style={styles.frontBackgroundImage}
opacity={isWhiteVariant ? 0.2 : 0.25}
backgroundColor={isWhiteVariant ? '#ffffff' : '#011dff'}
/>
</View>
)}
<View
style={[
styles.frontGreenBarBottom,
@@ -828,13 +832,22 @@ export const PDFBusinessCard: React.FC<PDFBusinessCardProps> = ({
/>
<View style={styles.accentLineHorizontal} />
<View style={styles.qrContainer}>
<View style={styles.qrCodeWrapper}>
<View style={[styles.qrCodeWrapper, { borderColor: COLORS.darkGreen }]}>
<Image src={qrCodeDataUrl} style={styles.qrCode} />
</View>
</View>
</View>
<View style={styles.backBody}>
{withTruck && (
<View style={styles.truckBackWrapper}>
<TruckBlueprint
style={styles.backBackgroundImage}
opacity={isWhiteVariant ? 0.35 : 0.25}
backgroundColor={isWhiteVariant ? '#ffffff' : '#f8f9fa'}
/>
</View>
)}
<View style={styles.leftColumn}>
<View style={styles.nameSection}>
<Text style={styles.nameText}>{person.name}</Text>