102 lines
2.3 KiB
HTML
102 lines
2.3 KiB
HTML
{% load static %}
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
|
<style>
|
|
html {
|
|
margin-top: 0in !important;
|
|
margin-left: 0in !important;
|
|
}
|
|
|
|
@page {
|
|
margin: 0px;
|
|
}
|
|
|
|
body {
|
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-size: 13px;
|
|
line-height: 1.4em;
|
|
margin: 0px;
|
|
}
|
|
|
|
.voucher {
|
|
width: 8in;
|
|
height: 3.77in;
|
|
position: relative;
|
|
}
|
|
|
|
|
|
.voucher-img {
|
|
max-width: 100%;
|
|
height: auto;
|
|
position: relative;
|
|
}
|
|
|
|
.field-amount {
|
|
position: absolute;
|
|
top: 236px;
|
|
right: 353px;
|
|
color: #fff;
|
|
font-size: 57px;
|
|
line-height: 40px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.field-content {
|
|
position: absolute;
|
|
width: 40%;
|
|
right: 10px;
|
|
top: 48px;
|
|
text-align: center;
|
|
}
|
|
|
|
.demo-title {
|
|
font-size: 35px;
|
|
font-weight: 300;
|
|
line-height: 1;
|
|
}
|
|
|
|
.demo-p {
|
|
font-size: 16px;
|
|
font-weight: 400;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.field-code {
|
|
padding: 15px;
|
|
border: 1px dotted;
|
|
margin: 35px 0 15px;
|
|
font-size: 20px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.field-expiry {
|
|
padding: 8px 13px;
|
|
background: #eee;
|
|
}
|
|
|
|
.field-customer {
|
|
margin-top: 20px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div class="voucher">
|
|
<img class="voucher-img" src="{% static "payment/voucher/gift-card-img.jpg" %}" />
|
|
|
|
<span class="field-amount">{{ voucher.value }}</span>
|
|
|
|
<div class="field-content">
|
|
<div class="demo-title">JourneyJoker-Gutschein</div>
|
|
<div class="demo-p">Buche noch heute deinen nächsten Traumurlaub.</div>
|
|
|
|
<div class="field-code">{{ voucher.code }}</div>
|
|
<div class="field-expiry">Gutschein erstellt am {{ voucher.created_at }}</div>
|
|
<div class="field-customer" style="display:none;">Gekauft von {{ voucher.customer.user.name }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|