Create templates for the pdf file
This commit is contained in:
parent
03314d4c1c
commit
666a8f643e
|
|
@ -8,118 +8,10 @@
|
|||
<link rel="stylesheet" href="styles.css">
|
||||
</head>
|
||||
<body>
|
||||
<section>
|
||||
<h1>{{ title }}</h1>
|
||||
<ul class="list-inline justify-center">
|
||||
<li><a href="https://google.com">Lorem ipsum dolor sit</a></li>
|
||||
<li>Lorem ipsum</li>
|
||||
<li><a href="https://google.com">Lorem ipsum dolor sit</a></li>
|
||||
<li>Lorem ipsum</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
{% block content %}
|
||||
{{ content }}
|
||||
{% endblock %}
|
||||
|
||||
<section>
|
||||
<div class="title">
|
||||
<h2>Lorem</h2>
|
||||
<hr>
|
||||
</div>
|
||||
<ul>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas, ipsa officia ut mollitia veniam.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum.</p></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<div class="title">
|
||||
<h2>Lorem</h2>
|
||||
<hr>
|
||||
</div>
|
||||
<div class="subtitle">
|
||||
<h3>Lorem ipsum</h3>
|
||||
<p class="underline">
|
||||
<strong>Lorem ipsum</strong>
|
||||
</p>
|
||||
<div class="timeSection">
|
||||
<span>Lorem ipsum</span>
|
||||
<strong>01/1999 - 02/1999</strong>
|
||||
</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas, ipsa officia ut mollitia veniam.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas</p></li>
|
||||
</ul>
|
||||
<div class="subtitle">
|
||||
<h3>Lorem ipsum</h3>
|
||||
<p class="underline">
|
||||
<strong>Lorem ipsum</strong>
|
||||
</p>
|
||||
<div class="timeSection">
|
||||
<span>Lorem ipsum</span>
|
||||
<strong>01/1999 - 02/1999</strong>
|
||||
</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas, ipsa officia ut mollitia veniam.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas</p></li>
|
||||
</ul>
|
||||
<div class="subtitle">
|
||||
<h3>Lorem ipsum</h3>
|
||||
<p class="underline">
|
||||
<strong>Lorem ipsum</strong>
|
||||
</p>
|
||||
<div class="timeSection">
|
||||
<span>Lorem ipsum</span>
|
||||
<strong>01/1999 - 02/1999</strong>
|
||||
</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas, ipsa officia ut mollitia veniam.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas, ipsa officia ut mollitia veniam.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum.</p></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<div class="title">
|
||||
<h2>Lorem</h2>
|
||||
<hr>
|
||||
</div>
|
||||
<div class="subtitle">
|
||||
<h3>Lorem ipsum 2</h3>
|
||||
<p class="underline">
|
||||
<strong>Lorem ipsum</strong>
|
||||
</p>
|
||||
<div class="timeSection">
|
||||
<span>Lorem ipsum</span>
|
||||
<strong>01/1999 - 02/1999</strong>
|
||||
</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas, ipsa officia ut mollitia veniam.</p></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<div class="title">
|
||||
<h2>Lorem</h2>
|
||||
<hr>
|
||||
</div>
|
||||
<ul>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum. Nemo illum amet voluptatibus assumenda sunt eaque quas, ipsa officia ut mollitia veniam.</p></li>
|
||||
<li><p><strong>Lorem:</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste minus molestiae facere inventore cum.</p></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--accent-color: blue;
|
||||
|
|
|
|||
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,14 +1,27 @@
|
|||
---
|
||||
layout: pdf
|
||||
title: Test 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"
|
||||
---
|
||||
|
||||
<h1>Hello</h1>
|
||||
|
||||
<p>
|
||||
<img src="https://place-hold.it/400x400">
|
||||
</p>
|
||||
<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" }}
|
||||
|
|
@ -16,11 +29,8 @@ The time is {{ "now" | date: "%Y-%m-%d %H:%M" }}
|
|||
</p>
|
||||
|
||||
{% for section in collections.sections %}
|
||||
{% if section.data.excludeFromPdf != true %}
|
||||
{% if section.data.template == 'hero' %}
|
||||
{% include 'hero' %}
|
||||
{% else %}
|
||||
{% include 'page' %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if section.data.excludeFromPdf != true %}
|
||||
{% assign items = collections[section.data.collection] %}
|
||||
{% include 'partials/components/pdf/section' %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
|
|
|||
Loading…
Reference in a new issue