feat: user templates
This commit was merged in pull request #9.
This commit is contained in:
@@ -1,70 +1,96 @@
|
||||
<article class="c6ee15365-8f47-4dab-8bee-2a56a7916c57">
|
||||
<div class="separator-h">{{ .Scissors }}</div>
|
||||
<div class="receiver">
|
||||
<div class="payment-details">
|
||||
<div>
|
||||
<h2>Empfangsschein</h2>
|
||||
<h4 style="margin-top: 0">Konto / Zahlbar an</h4>
|
||||
<p>
|
||||
{{ .ReceiverIBAN }} <br />
|
||||
{{ .ReceiverName }} <br />
|
||||
{{ .ReceiverStreet}} {{.ReceiverNumber}} <br />
|
||||
{{ .ReceiverZIPCode }} {{ .ReceiverPlace }}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Referenz</h4>
|
||||
<p>{{ .Reference }}</p>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Zahlbar durch</h4>
|
||||
<p>
|
||||
{{ .PayeeName }} <br />
|
||||
{{ .PayeeStreet}} {{.PayeeNumber}} <br />
|
||||
{{ .PayeeZIPCode }} {{ .PayeePlace }}
|
||||
</p>
|
||||
</div>
|
||||
<article
|
||||
class="absolute bottom-0 left-0 w-full grid [grid-template-columns:240px_1px_1fr] [grid-template-rows:1px_1fr]"
|
||||
>
|
||||
<!-- Horizontal Separator -->
|
||||
<div
|
||||
class="separator-h row-start-1 col-span-3 border-t border-black relative"
|
||||
>
|
||||
<div class="absolute left-10 top-[-52px] rotate-[-90deg]">
|
||||
{{ .Scissors }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="separator-v">{{ .Scissors }}</div>
|
||||
<div class="payer">
|
||||
<h2>Zahlteil</h2>
|
||||
<div class="qr-code">
|
||||
<!-- Replace with your QR code image or generated SVG -->
|
||||
<div class="qr-section-img">
|
||||
<image src="{{ .GetQR }}"></image>
|
||||
{{ .Cross }}
|
||||
|
||||
<!-- Receiver Section -->
|
||||
<div class="receiver row-start-2 col-start-1 text-[12pt] p-4">
|
||||
<h2 class="m-0 mb-2 text-2xl font-bold">Empfangsschein</h2>
|
||||
<div class="payment-details text-[0.9rem] leading-[1.4]">
|
||||
<h4 class="mt-0 mb-[0.1em] font-bold">Konto / Zahlbar an</h4>
|
||||
<p>
|
||||
{{ .ReceiverIBAN }} <br />
|
||||
{{ .ReceiverName }} <br />
|
||||
{{ .ReceiverStreet }} {{ .ReceiverNumber }} <br />
|
||||
{{ .ReceiverZIPCode }} {{ .ReceiverPlace }}
|
||||
</p>
|
||||
|
||||
<h4 class="mt-2 mb-[0.1em] font-bold">Referenz</h4>
|
||||
<p>{{ .Reference }}</p>
|
||||
|
||||
<h4 class="mt-2 mb-[0.1em] font-bold">Zahlbar durch</h4>
|
||||
<p>
|
||||
{{ .PayeeName }} <br />
|
||||
{{ .PayeeStreet }} {{ .PayeeNumber }} <br />
|
||||
{{ .PayeeZIPCode }} {{ .PayeePlace }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Vertical Separator -->
|
||||
<div
|
||||
class="separator-v row-start-2 col-start-2 border-r border-black relative"
|
||||
>
|
||||
<div class="-ml-8">{{ .Scissors }}</div>
|
||||
</div>
|
||||
|
||||
<!-- Payer Section -->
|
||||
<div
|
||||
class="payer row-start-2 col-start-3 grid [grid-template-columns:250px_1fr] [grid-template-rows:2em_1fr] p-4 gap-4 w-full"
|
||||
>
|
||||
<h2 class="row-start-1 col-span-1 m-0 text-2xl font-bold">Zahlteil</h2>
|
||||
|
||||
<!-- QR Code Section -->
|
||||
<div class="qr-code row-start-2 col-start-1 flex flex-col justify-between">
|
||||
<div class="qr-section-img relative w-full">
|
||||
<img src="{{ .GetQR }}" class="w-full" />
|
||||
<div
|
||||
class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-[1] scale-36"
|
||||
>
|
||||
<!-- cross gets replaced with svg-->
|
||||
{{ .Cross }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="qr-section-info">
|
||||
<h4>Währung</h4>
|
||||
<h4>Betrag</h4>
|
||||
<p>CHF</p>
|
||||
<p>{{ .Amount }}</p>
|
||||
<div
|
||||
class="qr-section-info grid grid-cols-2 grid-rows-2 justify-items-center"
|
||||
>
|
||||
<h4 class="m-0 font-bold">Währung</h4>
|
||||
<h4 class="m-0 font-bold">Betrag</h4>
|
||||
<p class="m-0">CHF</p>
|
||||
<p class="m-0">{{ .Amount }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="payment-details">
|
||||
<div>
|
||||
<h4 style="margin-top: 0">Konto / Zahlbar an</h4>
|
||||
<p>
|
||||
{{ .ReceiverIBAN }} <br />
|
||||
{{ .ReceiverName }} <br />
|
||||
{{ .ReceiverStreet}} {{.ReceiverNumber}} <br />
|
||||
{{ .ReceiverZIPCode }} {{ .ReceiverPlace }}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Referenz</h4>
|
||||
<p>{{ .Reference }}</p>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Zahlbar durch</h4>
|
||||
<p>
|
||||
{{ .PayeeName }} <br />
|
||||
{{ .PayeeStreet}} {{.PayeeNumber}} <br />
|
||||
{{ .PayeeZIPCode }} {{ .PayeePlace }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Payment Details -->
|
||||
<div
|
||||
class="payment-details row-start-2 col-start-2 text-[0.9rem] leading-[1.4]"
|
||||
>
|
||||
<h4 class="mt-0 mb-[0.1em] font-bold">Konto / Zahlbar an</h4>
|
||||
<p>
|
||||
{{ .ReceiverIBAN }} <br />
|
||||
{{ .ReceiverName }} <br />
|
||||
{{ .ReceiverStreet }} {{ .ReceiverNumber }} <br />
|
||||
{{ .ReceiverZIPCode }} {{ .ReceiverPlace }}
|
||||
</p>
|
||||
|
||||
<h4 class="mt-2 mb-[0.1em] font-bold">Referenz</h4>
|
||||
|
||||
<p>{{ .Reference }}</p>
|
||||
|
||||
<h4 class="mt-2 mb-[0.1em] font-bold">Zahlbar durch</h4>
|
||||
<p>
|
||||
{{ .PayeeName }} <br />
|
||||
{{ .PayeeStreet }} {{ .PayeeNumber }} <br />
|
||||
{{ .PayeeZIPCode }} {{ .PayeePlace }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
Reference in New Issue
Block a user