Compare commits
6 commits
1a4ad2d736
...
8a3940b966
| Author | SHA1 | Date | |
|---|---|---|---|
 TheThomaas
|
8a3940b966 | ||
|
TheThomaas
|
d8347ec473 | ||
|
TheThomaas
|
945575a4d5 | ||
|
TheThomaas
|
666a8f643e | ||
|
TheThomaas
|
03314d4c1c | ||
|
TheThomaas
|
21c1f28994 |
38
_config/eleventy-plugin-pdf.js
Normal file
38
_config/eleventy-plugin-pdf.js
Normal file
|
|
@ -0,0 +1,38 @@
|
||||||
|
import PuppeteerHTMLPDF from "puppeteer-html-pdf";
|
||||||
|
import { nanoid } from 'nanoid'
|
||||||
|
import fs from 'fs';
|
||||||
|
|
||||||
|
let config = {}
|
||||||
|
export default function (eleventyConfig, pluginOptions) {
|
||||||
|
config = pluginOptions;
|
||||||
|
eleventyConfig.addTransform("toPDF", transformPDF);
|
||||||
|
};
|
||||||
|
|
||||||
|
const transformPDF = async function(content) {
|
||||||
|
if (this.outputPath && this.outputPath.toLowerCase().endsWith('.pdf')) {
|
||||||
|
let htmlFile = `./${config.tempDir || "dist"}/${nanoid()}.html`;
|
||||||
|
let pdfFile = `./${config.tempDir || "dist"}/${nanoid()}.pdf`;
|
||||||
|
|
||||||
|
fs.writeFileSync(htmlFile, content);
|
||||||
|
|
||||||
|
const htmlPDF = new PuppeteerHTMLPDF();
|
||||||
|
const options = {
|
||||||
|
format: config.format || "A4",
|
||||||
|
margin: config.margin || {
|
||||||
|
top: "1cm",
|
||||||
|
right: "1.25cm",
|
||||||
|
bottom: "1cm",
|
||||||
|
left: "1.25cm",
|
||||||
|
},
|
||||||
|
path: pdfFile, // you can pass path to save the file
|
||||||
|
};
|
||||||
|
htmlPDF.setOptions(options);
|
||||||
|
|
||||||
|
const pdfContent = await htmlPDF.readFile(htmlFile, "utf8");
|
||||||
|
await htmlPDF.create(pdfContent);
|
||||||
|
let contents = fs.readFileSync(pdfFile, 'binary');
|
||||||
|
|
||||||
|
fs.unlinkSync(htmlFile); fs.unlinkSync(pdfFile);
|
||||||
|
return Buffer.from(contents,'binary');
|
||||||
|
} else return content;
|
||||||
|
};
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
import { inspect } from "util";
|
import { inspect } from "util";
|
||||||
import pluginIcons from 'eleventy-plugin-icons';
|
import pluginIcons from 'eleventy-plugin-icons';
|
||||||
|
import eleventyPDF from "./_config/eleventy-plugin-pdf.js";
|
||||||
|
|
||||||
export default async function (eleventyConfig) {
|
export default async function (eleventyConfig) {
|
||||||
eleventyConfig.setUseGitIgnore(false);
|
eleventyConfig.setUseGitIgnore(false);
|
||||||
|
|
@ -7,6 +8,7 @@ export default async function (eleventyConfig) {
|
||||||
eleventyConfig.addPassthroughCopy({"./src/_includes/js/" : "/js"});
|
eleventyConfig.addPassthroughCopy({"./src/_includes/js/" : "/js"});
|
||||||
|
|
||||||
eleventyConfig.addLayoutAlias('base', 'layouts/base.html');
|
eleventyConfig.addLayoutAlias('base', 'layouts/base.html');
|
||||||
|
eleventyConfig.addLayoutAlias('pdf', 'layouts/pdf.html');
|
||||||
|
|
||||||
eleventyConfig.addCollection("sections", (collectionApi) => {
|
eleventyConfig.addCollection("sections", (collectionApi) => {
|
||||||
const sections = collectionApi.getFilteredByGlob("./src/pages/sections/**")
|
const sections = collectionApi.getFilteredByGlob("./src/pages/sections/**")
|
||||||
|
|
@ -26,6 +28,8 @@ export default async function (eleventyConfig) {
|
||||||
.sort((a, b) => a.data.startDate - b.data.startDate).reverse();
|
.sort((a, b) => a.data.startDate - b.data.startDate).reverse();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
eleventyConfig.addPlugin(eleventyPDF);
|
||||||
|
|
||||||
eleventyConfig.addPassthroughCopy('src/favicon.ico')
|
eleventyConfig.addPassthroughCopy('src/favicon.ico')
|
||||||
|
|
||||||
eleventyConfig.addPlugin(pluginIcons, {
|
eleventyConfig.addPlugin(pluginIcons, {
|
||||||
|
|
|
||||||
1096
package-lock.json
generated
1096
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -14,6 +14,8 @@
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@11ty/eleventy": "^3.0.0",
|
"@11ty/eleventy": "^3.0.0",
|
||||||
"eleventy-plugin-icons": "^4.5.3",
|
"eleventy-plugin-icons": "^4.5.3",
|
||||||
"lucide-static": "^0.503.0"
|
"lucide-static": "^0.503.0",
|
||||||
|
"nanoid": "^5.1.5",
|
||||||
|
"puppeteer-html-pdf": "^4.0.8"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
109
src/_includes/layouts/pdf.html
Normal file
109
src/_includes/layouts/pdf.html
Normal file
|
|
@ -0,0 +1,109 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang={{ site.lang }} >
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>{{ title }}</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="styles.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
{% block content %}
|
||||||
|
{{ content }}
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--accent-color: blue;
|
||||||
|
--font-body: Arial, sans-serif;
|
||||||
|
--font-display: 'Times New Roman', Times, serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
font-family: var(--font-body, Arial, sans-serif);
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
*, ::before, ::after {
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
text-align:center;
|
||||||
|
font-family: var(--font-display, 'Times New Roman', Times, serif);
|
||||||
|
font-size: 2rem;
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
color : var(--accent-color, blue);
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
li::marker {
|
||||||
|
color: var(--accent-color, blue);
|
||||||
|
}
|
||||||
|
section {margin-bottom: 1.2rem;}
|
||||||
|
|
||||||
|
.justify-center {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.underline {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
.list-inline {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
gap: .8rem;
|
||||||
|
}
|
||||||
|
.list-inline li {
|
||||||
|
display: contents;
|
||||||
|
}
|
||||||
|
.list-inline li + li::before {
|
||||||
|
content: '|';
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
display: flex;
|
||||||
|
gap: .8rem;
|
||||||
|
margin-bottom: .6rem;
|
||||||
|
}
|
||||||
|
.title h2 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.title hr {
|
||||||
|
align-self: center;
|
||||||
|
flex: 1 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
section ul {padding: 0;margin-left: 1.2rem;}
|
||||||
|
.subtitle {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
justify-items: center;
|
||||||
|
margin-inline: 1rem;
|
||||||
|
margin-bottom: .4rem;
|
||||||
|
}
|
||||||
|
.subtitle .timeSection { font-size: .9rem; }
|
||||||
|
.subtitle h3,
|
||||||
|
.subtitle p { margin: 0; }
|
||||||
|
.subtitle > :first-child {justify-self: start;}
|
||||||
|
.subtitle > :last-child {justify-self: end;}
|
||||||
|
.subtitle + ul {font-size: .9rem;}
|
||||||
|
.subtitle ~ .subtitle {margin-top: 1rem;}
|
||||||
|
</style>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
33
src/_includes/partials/components/pdf/section.liquid
Normal file
33
src/_includes/partials/components/pdf/section.liquid
Normal file
|
|
@ -0,0 +1,33 @@
|
||||||
|
<section>
|
||||||
|
{% if section.data.showTitle != false %}
|
||||||
|
<div class="title">
|
||||||
|
<h2>
|
||||||
|
{% if section.data.displayedTitle %}
|
||||||
|
{{ section.data.displayedTitle }}
|
||||||
|
{% else %}
|
||||||
|
{{ section.data.title }}
|
||||||
|
{% endif %}
|
||||||
|
</h2>
|
||||||
|
<hr>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% for item in items %}
|
||||||
|
<div class="subtitle">
|
||||||
|
<h3>{{ item.data.title }}</h3>
|
||||||
|
<p class="underline">
|
||||||
|
<strong>{{ item.data.role }}</strong>
|
||||||
|
</p>
|
||||||
|
{% if item.data.dates %}
|
||||||
|
<div class="timeSection">
|
||||||
|
<span>{{ item.data.location }}</span>
|
||||||
|
<strong>{{ item.data.dates.start }} - {{ item.data.dates.end }}</strong>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>{{ item.data.description }}</li>
|
||||||
|
</ul>
|
||||||
|
{% endfor %}
|
||||||
|
</section>
|
||||||
|
|
@ -1,8 +1,12 @@
|
||||||
---
|
---
|
||||||
title: Artionet - Web Agency
|
title: Artionet - Web Agency
|
||||||
|
role: Stagiaire
|
||||||
description: Stage de 4ème année de CFC, développement web
|
description: Stage de 4ème année de CFC, développement web
|
||||||
location: Delémont
|
location: Delémont
|
||||||
link: https://www.artionet.ch
|
link: https://www.artionet.ch
|
||||||
|
dates:
|
||||||
|
start: 2021
|
||||||
|
end: 2022
|
||||||
startDate: 2021
|
startDate: 2021
|
||||||
endDate: 2022
|
endDate: 2022
|
||||||
---
|
---
|
||||||
|
|
@ -1,8 +1,12 @@
|
||||||
---
|
---
|
||||||
title: Artionet - Web Agency
|
title: Artionet - Web Agency
|
||||||
|
role: Développeur
|
||||||
description: Développeur Front-End et Support Client
|
description: Développeur Front-End et Support Client
|
||||||
location: Delémont
|
location: Delémont
|
||||||
link: https://www.artionet.ch
|
link: https://www.artionet.ch
|
||||||
|
dates:
|
||||||
|
start: 2022
|
||||||
|
end: Present
|
||||||
startDate: 2022
|
startDate: 2022
|
||||||
endDate: 2024
|
endDate: 2024
|
||||||
---
|
---
|
||||||
|
|
@ -1,7 +1,11 @@
|
||||||
---
|
---
|
||||||
title: Ecole des métiers Technique
|
title: Ecole des métiers Technique
|
||||||
|
role: Etudiant
|
||||||
description: CFC d'informaticien d'entreprise
|
description: CFC d'informaticien d'entreprise
|
||||||
location: Porrentruy
|
location: Porrentruy
|
||||||
|
dates:
|
||||||
|
start: 2018
|
||||||
|
end: 2022
|
||||||
startDate: 2018
|
startDate: 2018
|
||||||
endDate: 2022
|
endDate: 2022
|
||||||
---
|
---
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
---
|
---
|
||||||
title: Téléchargement
|
title: Téléchargement
|
||||||
showTitle: false
|
showTitle: false
|
||||||
|
excludeFromPdf: true
|
||||||
order: 4
|
order: 4
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,9 @@
|
||||||
---
|
---
|
||||||
title: Expériences
|
title: Expériences
|
||||||
displayedTitle: Mes expériences
|
displayedTitle: Mes expériences
|
||||||
|
collection: experiences
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
{% assign experiences = collections.experiences %}
|
{% assign experiences = collections[collection] %}
|
||||||
{% render 'partials/components/timeline', timeline: experiences %}
|
{% render 'partials/components/timeline', timeline: experiences %}
|
||||||
|
|
@ -2,6 +2,7 @@
|
||||||
title: A propos
|
title: A propos
|
||||||
order: 0
|
order: 0
|
||||||
template: 'hero'
|
template: 'hero'
|
||||||
|
excludeFromPdf: true
|
||||||
eleventyComputed:
|
eleventyComputed:
|
||||||
description: "{{ author.about }}"
|
description: "{{ author.about }}"
|
||||||
displayedTitle: "Moi c'est {{ author.firstName }}<br>Et je suis {{ author.occupation }}"
|
displayedTitle: "Moi c'est {{ author.firstName }}<br>Et je suis {{ author.occupation }}"
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,9 @@
|
||||||
---
|
---
|
||||||
title: Projets
|
title: Projets
|
||||||
displayedTitle: Mes projets
|
displayedTitle: Mes projets
|
||||||
|
collection: projects
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
{% assign projects = collections.projects %}
|
{% assign projects = collections[collection] %}
|
||||||
{% include 'partials/components/project-grid' %}
|
{% include 'partials/components/project-grid' %}
|
||||||
38
src/pdf.liquid
Normal file
38
src/pdf.liquid
Normal file
|
|
@ -0,0 +1,38 @@
|
||||||
|
---
|
||||||
|
layout: pdf
|
||||||
|
permalink: "pdf.pdf"
|
||||||
|
eleventyComputed:
|
||||||
|
title: "{{author.firstName}} {{author.name}}, {{author.occupation}}"
|
||||||
|
links:
|
||||||
|
- value: "thomas@amstutz.it"
|
||||||
|
- type: "link"
|
||||||
|
value: "github.com/TheThomaas"
|
||||||
|
- value: "123 123 12 12"
|
||||||
|
- type: "link"
|
||||||
|
value: "amstutz.it"
|
||||||
|
---
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<h1>{{ title }}</h1>
|
||||||
|
<ul class="list-inline justify-center">
|
||||||
|
{% for item in links %}
|
||||||
|
{% if item.type == "link" %}
|
||||||
|
<li><a href="{{item.value}}">{{item.value}}</a></li>
|
||||||
|
{% else %}
|
||||||
|
<li>{{item.value}}</li>
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
The time is {{ "now" | date: "%Y-%m-%d %H:%M" }}
|
||||||
|
|
||||||
|
</p>
|
||||||
|
|
||||||
|
{% for section in collections.sections %}
|
||||||
|
{% if section.data.excludeFromPdf != true %}
|
||||||
|
{% assign items = collections[section.data.collection] %}
|
||||||
|
{% include 'partials/components/pdf/section' %}
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
Loading…
Reference in a new issue