Skip to content

Commit 3a0a561

Browse files
committed
Update example in README
1 parent ccc2d1c commit 3a0a561

8 files changed

Lines changed: 108 additions & 84 deletions

File tree

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
11
*.pdf
2+
!example/businesscard.pdf

README.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
# node-html-pdf
2-
## a HTML to PDF converter that wraps phantomjs
3-
![image](http://public.admintools.ch/gh/html-pdf/businesscard.png)
4-
[Example Business Card](http://public.admintools.ch/gh/html-pdf/businesscard.pdf)
5-
-> [and its Source file](test/businesscard.html)
2+
## HTML to PDF converter that uses phantomjs
3+
![image](example/businesscard.png)
4+
[Example Business Card](example/businesscard.pdf)
5+
-> [and its Source file](example/businesscard.html)
66

77
[Example Receipt](http://public.admintools.ch/gh/html-pdf/order.pdf)
88

example/businesscard.html

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
<html>
2+
<head>
3+
<meta charset="utf8">
4+
<title>SuitArt Business Card</title>
5+
<style>
6+
html, body {
7+
margin: 0;
8+
padding: 0;
9+
font-family: 'Sackers Gothic Std';
10+
font-weight: 500;
11+
font-size: 10px;
12+
background: rgb(241,241,241);
13+
-webkit-print-color-adjust: exact;
14+
box-sizing: border-box;
15+
}
16+
17+
.page {
18+
position: relative;
19+
height: 90mm;
20+
width: 50mm;
21+
display: block;
22+
background: black;
23+
page-break-after: auto;
24+
margin: 50px;
25+
overflow: hidden;
26+
}
27+
28+
@media print {
29+
body {
30+
background: black;
31+
}
32+
33+
.page {
34+
margin: 0;
35+
height: 100%;
36+
width: 100%;
37+
}
38+
}
39+
40+
.page.first {
41+
border-left: 5px solid green;
42+
}
43+
44+
.bottom {
45+
position: absolute;
46+
left: 5mm;
47+
right: 5mm;
48+
bottom: 5mm;
49+
}
50+
51+
.group {
52+
margin-top: 3mm;
53+
}
54+
55+
.line {
56+
color: white;
57+
position: relative;
58+
}
59+
60+
.center {
61+
text-align: center;
62+
}
63+
64+
.logo {
65+
position: relative;
66+
width: 80%;
67+
left: 10%;
68+
top: 15%;
69+
}
70+
71+
</style>
72+
</head>
73+
<body>
74+
<div class="page">
75+
<div class="bottom">
76+
<div class="line">Marc Bachmann</div>
77+
<div class="line">cto</div>
78+
79+
<div class="group">
80+
<div class="line">p: +41 00 000 00 00</div>
81+
<div class="line">github: marcbachmann</div>
82+
</div>
83+
<div class="group">
84+
<div class="line">suitart ag</div>
85+
<div class="line">räffelstrasse 25</div>
86+
<div class="line">8045 zürich</div>
87+
</div>
88+
</div>
89+
</div>
90+
<div class="page">
91+
<img class="logo" src="{{image}}">
92+
<div class="bottom">
93+
<div class="line center">8045 zürich</div>
94+
</div>
95+
</div>
96+
</body>
97+
</html>

example/businesscard.pdf

26.1 KB
Binary file not shown.

example/businesscard.png

78.9 KB
Loading

example/image.png

12 KB
Loading

test/businesscard.html

Lines changed: 0 additions & 79 deletions
This file was deleted.

test/index.coffee

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -84,9 +84,14 @@ test 'pdf.create(html[, options]).toStream(callback)', (st) ->
8484
test 'allows custom html and css', (st) ->
8585
st.plan(3)
8686

87-
template = path.join(__dirname, 'businesscard.html')
87+
template = path.join(__dirname, '../example/businesscard.html')
8888
filename = template.replace('.html', '.pdf')
8989
templateHtml = fs.readFileSync(template, 'utf8')
90+
91+
image = path.join('file://', __dirname, '../example/image.png')
92+
console.log(image)
93+
templateHtml = templateHtml.replace('{{image}}', image)
94+
9095
options =
9196
width: '50mm'
9297
height: '90mm'

0 commit comments

Comments
 (0)