Compare commits
7 Commits
ac189f84f5
...
v2.3.19-rc
| Author | SHA1 | Date | |
|---|---|---|---|
| 9b28dd20d9 | |||
| 1970ae310f | |||
| 7bc8811a60 | |||
| 530503fa09 | |||
| a539e3c498 | |||
| 14574fb312 | |||
| fdeb34ea3c |
@@ -1,5 +1,5 @@
|
||||
import React from 'react';
|
||||
/* eslint-disable react/prop-types */
|
||||
|
||||
import { Document, Page, View, Text, StyleSheet, Link, Image } from '@react-pdf/renderer';
|
||||
|
||||
// Standard fonts like Helvetica are built-in to PDF and don't require registration
|
||||
@@ -27,7 +27,7 @@ const styles = StyleSheet.create({
|
||||
color: C.gray900,
|
||||
lineHeight: 1.6,
|
||||
backgroundColor: C.white,
|
||||
paddingTop: 0,
|
||||
paddingTop: 50,
|
||||
paddingBottom: 80,
|
||||
fontFamily: 'Helvetica',
|
||||
},
|
||||
@@ -35,10 +35,11 @@ const styles = StyleSheet.create({
|
||||
// Premium Header Layout
|
||||
hero: {
|
||||
backgroundColor: C.offWhite,
|
||||
paddingTop: 40,
|
||||
paddingBottom: 32,
|
||||
paddingTop: 24,
|
||||
paddingBottom: 24,
|
||||
paddingHorizontal: MARGIN,
|
||||
marginBottom: 40,
|
||||
marginTop: -50, // Counters the page padding to achieve full-bleed top
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: C.gray200,
|
||||
position: 'relative',
|
||||
@@ -52,8 +53,8 @@ const styles = StyleSheet.create({
|
||||
},
|
||||
|
||||
logo: {
|
||||
width: 60,
|
||||
height: 30,
|
||||
width: 140, // Increased to fit full logo
|
||||
height: 45,
|
||||
objectFit: 'contain',
|
||||
},
|
||||
|
||||
@@ -71,12 +72,12 @@ const styles = StyleSheet.create({
|
||||
},
|
||||
|
||||
pageTitle: {
|
||||
fontSize: 28,
|
||||
fontSize: 16,
|
||||
fontWeight: 700,
|
||||
color: C.navyDeep,
|
||||
marginBottom: 4,
|
||||
textTransform: 'uppercase',
|
||||
letterSpacing: -0.5,
|
||||
letterSpacing: 0,
|
||||
},
|
||||
|
||||
accentBar: {
|
||||
@@ -243,7 +244,7 @@ const renderLexicalNode = (node: any, idx: number): React.ReactNode => {
|
||||
case 'paragraph': {
|
||||
if (!node.children || node.children.length === 0) return null;
|
||||
return (
|
||||
<Text key={idx} style={styles.paragraph}>
|
||||
<Text key={idx} style={styles.paragraph} minPresenceAhead={15}>
|
||||
{node.children?.map((child: any, i: number) => renderLexicalNode(child, i))}
|
||||
</Text>
|
||||
);
|
||||
@@ -260,14 +261,14 @@ const renderLexicalNode = (node: any, idx: number): React.ReactNode => {
|
||||
if (node.tag === 'h2') hStyle = styles.heading2;
|
||||
|
||||
const content = (
|
||||
<Text key={idx} style={hStyle}>
|
||||
<Text key={idx} style={hStyle} wrap={false} minPresenceAhead={100}>
|
||||
{node.children?.map((child: any, i: number) => renderLexicalNode(child, i))}
|
||||
</Text>
|
||||
);
|
||||
|
||||
if (isH1) {
|
||||
return (
|
||||
<View key={idx} style={styles.heading1Wrapper}>
|
||||
<View key={idx} style={styles.heading1Wrapper} wrap={false} minPresenceAhead={100}>
|
||||
{content}
|
||||
</View>
|
||||
);
|
||||
@@ -283,7 +284,7 @@ const renderLexicalNode = (node: any, idx: number): React.ReactNode => {
|
||||
{node.children?.map((child: any, i: number) => {
|
||||
if (child.type === 'listitem') {
|
||||
return (
|
||||
<View key={i} style={styles.listItem}>
|
||||
<View key={i} style={styles.listItem} wrap={false}>
|
||||
<Text style={styles.listItemBullet}>
|
||||
{node.listType === 'number' ? `${i + 1}.` : '•'}
|
||||
</Text>
|
||||
@@ -340,18 +341,15 @@ export const PDFPage: React.FC<PDFPageProps> = ({ page, locale = 'de' }) => {
|
||||
day: 'numeric',
|
||||
});
|
||||
|
||||
const logoPath = `${process.cwd()}/public/logo.png`;
|
||||
const logoPath = `${process.cwd()}/public/logo-full.png`;
|
||||
|
||||
return (
|
||||
<Document>
|
||||
<Page size="A4" style={styles.page}>
|
||||
{/* Improved Hero Header */}
|
||||
<View style={styles.hero} fixed>
|
||||
{/* Improved Hero Header - No longer fixed so it doesn't repeat on all pages */}
|
||||
<View style={styles.hero}>
|
||||
<View style={styles.headerTop}>
|
||||
<Image src={logoPath} style={styles.logo} />
|
||||
<Text style={styles.docType}>
|
||||
{locale === 'en' ? 'Official Document' : 'Offizielles Dokument'}
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
<View style={styles.headerTitleArea}>
|
||||
@@ -369,7 +367,7 @@ export const PDFPage: React.FC<PDFPageProps> = ({ page, locale = 'de' }) => {
|
||||
</View>
|
||||
|
||||
{/* Industrial footer with page numbers */}
|
||||
<View style={{ ...styles.footer, position: 'absolute', bottom: 30, height: 40 }} fixed>
|
||||
<View style={{ ...styles.footer, position: 'absolute', bottom: 40, height: 40 }} fixed>
|
||||
<View style={styles.footerInfo}>
|
||||
<Text style={styles.footerBrand}>KLZ VERTRIEBS GMBH</Text>
|
||||
<Text style={styles.footerText}>
|
||||
|
||||
@@ -139,7 +139,7 @@
|
||||
"prepare": "husky",
|
||||
"preinstall": "npx only-allow pnpm"
|
||||
},
|
||||
"version": "2.3.18-rc.6",
|
||||
"version": "2.3.19",
|
||||
"pnpm": {
|
||||
"onlyBuiltDependencies": [
|
||||
"@parcel/watcher",
|
||||
|
||||
BIN
public/AVB-KLZ-4-2026.docx
Normal file
BIN
public/AVB-KLZ-4-2026.docx
Normal file
Binary file not shown.
BIN
public/AVB-KLZ-4-2026.pdf
Normal file
BIN
public/AVB-KLZ-4-2026.pdf
Normal file
Binary file not shown.
BIN
public/logo-full.png
Normal file
BIN
public/logo-full.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.8 KiB |
BIN
test-render.pdf
BIN
test-render.pdf
Binary file not shown.
Reference in New Issue
Block a user