fix(pdf): fix white-on-white logo and correct letterpress masking
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 11s
Build & Deploy / 🏗️ Build (push) Has been cancelled
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Build & Deploy / 🧪 Post-Deploy Verification (push) Has been cancelled
Build & Deploy / 🔔 Notify (push) Has been cancelled
Build & Deploy / 🧪 QA (push) Has been cancelled

This commit is contained in:
2026-06-11 19:13:32 +02:00
parent 22ae008f29
commit 6367efdf6f
7 changed files with 20 additions and 6 deletions

View File

@@ -362,17 +362,21 @@ const VectorLogo = ({
style,
overrideColor,
overrideWhiteColor,
pathOverrides,
}: {
paths: { d: string; fill: string }[];
style: any;
overrideColor?: string;
overrideWhiteColor?: string;
pathOverrides?: Record<number, string>;
}) => (
<Svg viewBox="0 0 295 99" style={style}>
<G {...({ fillRule: 'evenodd', clipRule: 'evenodd' } as any)}>
{paths.map((p, i) => {
let fill = overrideColor || p.fill;
if (
if (pathOverrides && pathOverrides[i]) {
fill = pathOverrides[i];
} else if (
overrideWhiteColor &&
(p.fill === 'white' || p.fill === '#ffffff' || p.fill === '#fff')
) {
@@ -696,6 +700,11 @@ export const PDFBusinessCard: React.FC<PDFBusinessCardProps> = ({
return logoWhitePaths;
};
const getBackLogoPaths = () => {
if (variant === 'black') return logoBlackWithTaglinePaths;
return logoBlueWithTaglinePaths;
};
const bgImagePath = isWhiteVariant
? path.join(process.cwd(), 'public', 'media', 'cable_drums_truck.png')
: path.join(process.cwd(), 'public', 'cable_drums_bg.png');
@@ -769,16 +778,21 @@ export const PDFBusinessCard: React.FC<PDFBusinessCardProps> = ({
</View>
</View>
<View style={styles.frontContainer}>
{/* Base Logo: text is blue, truck is green */}
{/* Base Logo: text is white, truck is green. Make KLZ letters blend into background */}
<VectorLogo
paths={getFrontLogoPaths()}
style={styles.frontLogo}
overrideWhiteColor={COLORS.blue}
pathOverrides={{
25: COLORS.primary,
26: COLORS.primary,
27: COLORS.primary,
28: COLORS.primary,
}}
/>
{/* Letterpress Mask Layer: We use #ff00fe as a marker color. Only the "KLZ" letters! */}
<VectorLogo
paths={getFrontLogoPaths().slice(30, 35)}
paths={getFrontLogoPaths().slice(25, 29)}
style={[styles.frontLogo, { position: 'absolute' }]}
overrideColor="#ff00fe"
/>
@@ -790,9 +804,9 @@ export const PDFBusinessCard: React.FC<PDFBusinessCardProps> = ({
<View style={styles.backContainer}>
<View style={styles.backHeader}>
<VectorLogo
paths={logoWhitePaths}
paths={getBackLogoPaths()}
style={styles.backLogo}
overrideWhiteColor={COLORS.blue}
overrideWhiteColor={COLORS.primary}
/>
<View style={styles.accentLineHorizontal} />
</View>