HTML template example that can be used in the editor for Caldera Forms emails and PDF Submissions

cf-pdf-template.html

<div style="text-align: center; font-size: 2em;">
<div style="border: 5px solid #b3e6ff; padding: 2% 3% 2% 3%; max-width: 650px; margin: 1% auto 1% auto; background-color: #b3e6ff; color: white;">My PDF Submission</div>
<div></div>
</div>
<div style="text-align: left; font-size: 1.2em;">
<div style="border: 2px solid #b3e6ff; padding: 2% 3% 2% 3%; max-width: 650px; margin: 1% 10% 1% 10%; background-color: white; color: black;">

<p style="text-align: center;">
  
  Hello %first_name% %last_name%
  
</p>
<p style="text-align: center;">These are details of a payment processed.</p>

</div>
</div>

<div style="text-align: left; font-size: 1em;">
<div style="border: 5px solid black; padding: 5px 20px 5px 50px; margin: 1% 10% 1% 10%; background-color: #d3d3d3;">

<hr />

Payment amount: {stripe:Amount}$

<hr />

Transaction ID: {stripe:ID}

<hr />

Time of payment: {stripe:Created}

<hr />

</div>
</div>

<hr />

<div style="text-align: left; font-size: 0.8em;">
<div style="border: 2px solid #b3e6ff; padding: 2% 3% 2% 3%; max-width: 650px; margin: 1% 10% 1% 10%; background-color: white; color: black;">

Display all the submissions details here:

{summary}

</div>
</div>