feat(template): First templates

This commit is contained in:
2024-12-03 15:04:10 +01:00
parent ba7e02fa30
commit 3eb914d640
6 changed files with 420 additions and 1 deletions

120
templates/contract/de.html Normal file
View File

@@ -0,0 +1,120 @@
<html>
<head>
<meta charset="utf8">
<title>Sponsoring contract</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css">
<style>
.sheet {
margin: 0;
overflow: hidden;
position: relative;
box-sizing: border-box;
page-break-after: always;
}
body.A5.landscape .sheet {
width: 210mm;
height: 147mm
}
.column {
margin-bottom: -20;
}
</style>
</head>
<body class="A5 landscape">
{{#each runners}}
<div class="sheet">
<img id="header_img" width="100%" src="sponsoringheader.png" />
<div style=" padding: 0 1rem 0 1rem;">
<div class="columns">
<div class="column is-10">
<div class="columns" style="padding-bottom: 0;">
<div class="column is-two-fifths">
<p style="font-size: large; font-weight: bold;">Sponsoringerklärung</p>
</div>
<div class="column">
<p style="font-size: x-small; vertical-align: revert; margin-top: auto;">Bitte in DRUCKBUCHSTABEN schreiben
</p>
</div>
</div>
<p> ch bin/ Wir sind bereit anlässlich des {{eventname}}</p>
<div class="columns">
<div class="column is-9">
<span style="border-bottom: 1px solid; width: 100%; display: block;">{{this.firstname}}
{{this.middlename}}</span>
<p style="font-size: x-small; display: block;">Vorname</p>
</div>
<div class="column is-3">
<span style="border-bottom: 1px solid; width: 100%; display: block;">{{this.id}}</span>
<p style="font-size: x-small; display: block;">ID</p>
</div>
</div>
</div>
<div class="column">
<img style="vertical-align: revert; margin-top: auto; object-fit: cover; max-height: 2cm;"
src="{{--bc this.id ../codeformat}}" />
</div>
</div>
<div class="columns" style="padding-top: 1rem;">
<div class="column is-6">
<span style="border-bottom: 1px solid; width: 100%; display: block;">{{this.lastname}}</span>
<p style="font-size: x-small; display: block;">Nachname</p>
</div>
<div class="column is-6">
<span style="border-bottom: 1px solid; width: 100%; display: block;">{{this.group.fullName}}</span>
<p style="font-size: x-small; display: block;">Team/ Klasse</p>
</div>
</div>
<p style="margin-top: -0.5rem">mit einem Betrag von _____{{currency_symbol}} pro gelaufenem Kilometer zu unterstützen.</p>
<div class="columns" style="margin-top: -1rem;">
<div class="column is-6">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Nachname</p>
</div>
<div class="column is-6">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Vorname</p>
</div>
</div>
<p style="font-size: medium; margin-top: -0.5rem;">Adresse (Sponsor)</p>
<p style="font-size: x-small;">(Muss ausgefüllt werden, wenn Sie eine Spendenquittung benötigen - Spendenquittungen können erst ab einem Gesamtbetrag von {{sponsoring_receipt_minimum_amount}}{{currency_symbol}} ausgestellt werden)</p>
<div class="columns" style="margin-top: -1rem;">
<div class="column is-8">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Straße</p>
</div>
<div class="column is-4">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Hausnummer</p>
</div>
</div>
<div class="columns" style="margin-top: -1rem;">
<div class="column is-4">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Postleitzahl</p>
</div>
<div class="column is-8">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Stadt</p>
</div>
</div>
<div class="columns" style="margin-top: -1rem;">
<div class="column is-7">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Ort, Datum</p>
</div>
<div class="column is-5">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Unterschrift</p>
</div>
</div>
<p style="font-size: xx-small; overflow: hidden; height: 4rem; text-align: center;">{{../disclaimer}}</p>
</div>
</div>
{{/each}}
</body>
</html>

120
templates/contract/en.html Normal file
View File

@@ -0,0 +1,120 @@
<html>
<head>
<meta charset="utf8">
<title>Sponsoring contract</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css">
<style>
.sheet {
margin: 0;
overflow: hidden;
position: relative;
box-sizing: border-box;
page-break-after: always;
}
body.A5.landscape .sheet {
width: 210mm;
height: 147mm
}
.column {
margin-bottom: -20;
}
</style>
</head>
<body class="A5 landscape">
{{#each runners}}
<div class="sheet">
<img id="header_img" width="100%" src="sponsoringheader.png" />
<div style=" padding: 0 1rem 0 1rem;">
<div class="columns">
<div class="column is-10">
<div class="columns" style="padding-bottom: 0;">
<div class="column is-two-fifths">
<p style="font-size: large; font-weight: bold;">Sponsoring contract</p>
</div>
<div class="column">
<p style="font-size: x-small; vertical-align: revert; margin-top: auto;">Please write in BLOCK LETTERS.
</p>
</div>
</div>
<p> On the occasion of the {{eventname}} I/We want to support </p>
<div class="columns">
<div class="column is-9">
<span style="border-bottom: 1px solid; width: 100%; display: block;">{{this.firstname}}
{{this.middlename}}</span>
<p style="font-size: x-small; display: block;">First name</p>
</div>
<div class="column is-3">
<span style="border-bottom: 1px solid; width: 100%; display: block;">{{this.id}}</span>
<p style="font-size: x-small; display: block;">ID</p>
</div>
</div>
</div>
<div class="column">
<img style="vertical-align: revert; margin-top: auto; object-fit: cover; max-height: 2cm;"
src="{{--bc this.id ../codeformat}}" />
</div>
</div>
<div class="columns" style="padding-top: 1rem;">
<div class="column is-6">
<span style="border-bottom: 1px solid; width: 100%; display: block;">{{this.lastname}}</span>
<p style="font-size: x-small; display: block;">Last Name</p>
</div>
<div class="column is-6">
<span style="border-bottom: 1px solid; width: 100%; display: block;">{{this.group.fullName}}</span>
<p style="font-size: x-small; display: block;">Team/class</p>
</div>
</div>
<p style="margin-top: -0.5rem">with the amount of _____{{currency_symbol}} per kilometer run.</p>
<div class="columns" style="margin-top: -1rem;">
<div class="column is-6">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Last name</p>
</div>
<div class="column is-6">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">First name</p>
</div>
</div>
<p style="font-size: medium; margin-top: -0.5rem;">Address (Sponsor)</p>
<p style="font-size: x-small;">(You have to provide an address if you want a donation receipt - Donation receipts can't be issued for total donation amounts under {{sponsoring_receipt_minimum_amount}}{{currency_symbol}})</p>
<div class="columns" style="margin-top: -1rem;">
<div class="column is-8">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Street</p>
</div>
<div class="column is-4">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">House number</p>
</div>
</div>
<div class="columns" style="margin-top: -1rem;">
<div class="column is-4">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Postal code</p>
</div>
<div class="column is-8">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">City</p>
</div>
</div>
<div class="columns" style="margin-top: -1rem;">
<div class="column is-7">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Location, Date</p>
</div>
<div class="column is-5">
<span style="border-bottom: 1px solid; width: 100%; display: block;"></span>
<p style="font-size: x-small; display: block;">Signature</p>
</div>
</div>
<p style="font-size: xx-small; overflow: hidden; height: 4rem; text-align: center;">{{../disclaimer}}</p>
</div>
</div>
{{/each}}
</body>
</html>