Individuelle Dokumente
Deine Dokumente kannst Du einfach unter https://app.droplion.com/settings/documents bearbeiten und in Echtzeit testen.
Rechnung
Oder herunterladen unter /doc/invoice.liquid
{% assign primary_font = "Poppins" %}
{% assign primary_font_color = "#000000" %} <!-- Black text color -->
{% assign primary_font_size = "11px" %}
{% assign secondary_font = "Poppins" %}
{% assign secondary_font_color = "#333333" %} <!-- Grey text color -->
{% assign theme_color = "#303336" %}
<script type="text/javascript">
var fHead = document.head || document.getElementsByTagName('head')[0];
{% assign font_weights = "300,400,700" | split: ',' %}
{% for font_weight in font_weights %}
var font1Id = 'font-{{ primary_font | replace: " ", "-" }}-{{ font_weight }}';
if (!document.getElementById(font1Id)) {
var linkElement = document.createElement('link');
linkElement.setAttribute('id', font1Id)
linkElement.setAttribute('rel', 'stylesheet');
linkElement.setAttribute('type', 'text/css');
linkElement.setAttribute('href', 'https://fonts.googleapis.com/css?family={{ primary_font | replace: " ", "+" }}:{{ font_weight }}&subset=latin-ext');
fHead.appendChild(linkElement);
}
;
{% if secondary_font != blank and secondary_font != primary_font %}
var font2Id = 'font-{{ secondary_font | replace: " ", "-" }}-{{ font_weight }}';
if (!document.getElementById(font2Id)) {
var linkElement = document.createElement('link');
linkElement.setAttribute('id', font2Id)
linkElement.setAttribute('rel', 'stylesheet');
linkElement.setAttribute('type', 'text/css');
linkElement.setAttribute('href', 'https://fonts.googleapis.com/css?family={{ secondary_font | replace: " ", "+" }}:{{ font_weight }}&subset=latin-ext');
fHead.appendChild(linkElement);
}
;
{% endif %}
{% endfor %}
</script>
<style type="text/css">
/* ### BASE - PAGE SIZING AND MARGIN SETUP NORMALIZATION ACROSS BROWSERS ### */
@page {
margin: 12mm !important;
margin-top: 12mm !important;
margin-right: 12mm !important;
margin-bottom: 12mm !important;
margin-left: 12mm !important;
}
@media print {
.safari {
padding-top: 15px;
box-sizing: border-box;
}
.printer-preview-content:after {
content: "";
display: table;
clear: both;
}
.printer-preview-content .printer-preview-content {
padding-left: 15px;
padding-right: 15px;
box-sizing: border-box;
}
}
@media screen {
.printer-preview-content {
padding: 16px 0;
min-height: 800px;
}
.printer-preview-content .printer-preview-content {
margin-right: auto;
margin-left: auto;
max-width: 680px;
}
}
@media screen, print {
/* ### BASE - TYPOGRAPHY AND REMOVAL OF STANDARD SHOPIFY STYLING ### */
.printer-preview-content .t70787 * {
color: {{ secondary_font_color }};
font-family: '{{ primary_font }}';
font-size: {{ primary_font_size }};
font-weight: 400;
line-height: 16px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
margin: 0 0 0 0;
padding: 0 0 0 0;
-webkit-print-color-adjust: exact;
overflow: visible !important;
}
.printer-preview-content .t70787 h1 {
font-size: 18px;
line-height: 32px;
}
.printer-preview-content .t70787 h2 {
font-size: 18px;
line-height: 32px;
}
.printer-preview-content .t70787 h3 {
font-size: 14px;
line-height: 16px;
}
.printer-preview-content .t70787 h1,
.printer-preview-content .t70787 h2,
.printer-preview-content .t70787 h3 {
margin-bottom: 16px;
}
.printer-preview-content .t70787 a,
.printer-preview-content .t70787 a * {
text-decoration: none !important;
}
.printer-preview-content .t70787 b,
.printer-preview-content .t70787 b * {
font-weight: bold;
}
.printer-preview-content .t70787 .text-right {
text-align: right;
}
.printer-preview-content .t70787 .text-center {
text-align: center;
}
.printer-preview-content .t70787 .no-wrap {
white-space: nowrap;
}
/* ### BASE - GRID AND RE-USABLE LAYOUT COMPONENTS ### */
.printer-preview-content .t70787 .row {
width: 100%;
display: block;
clear: both;
}
.printer-preview-content .t70787 .row:after {
content: "";
display: table;
clear: both;
}
.printer-preview-content .t70787 .col-xs-1,
.printer-preview-content .t70787 .col-xs-2,
.printer-preview-content .t70787 .col-xs-3,
.printer-preview-content .t70787 .col-xs-4,
.printer-preview-content .t70787 .col-xs-5,
.printer-preview-content .t70787 .col-xs-6,
.printer-preview-content .t70787 .col-xs-7,
.printer-preview-content .t70787 .col-xs-8,
.printer-preview-content .t70787 .col-xs-9,
.printer-preview-content .t70787 .col-xs-10,
.printer-preview-content .t70787 .col-xs-11,
.printer-preview-content .t70787 .col-xs-12 {
float: left;
min-height: 1px;
margin-bottom: 32px;
}
.printer-preview-content .t70787 .col-xs-12 {
width: 100%;
}
.printer-preview-content .t70787 .col-xs-11 {
width: 91.66666667%;
}
.printer-preview-content .t70787 .col-xs-10 {
width: 83.33333333%;
}
.printer-preview-content .t70787 .col-xs-9 {
width: 75%;
}
.printer-preview-content .t70787 .col-xs-8 {
width: 66.66666667%;
}
.printer-preview-content .t70787 .col-xs-7 {
width: 58.33333333%;
}
.printer-preview-content .t70787 .col-xs-6 {
width: 50%;
}
.printer-preview-content .t70787 .col-xs-5 {
width: 41.66666667%;
}
.printer-preview-content .t70787 .col-xs-4 {
width: 33.33333333%;
}
.printer-preview-content .t70787 .col-xs-3 {
width: 25%;
}
.printer-preview-content .t70787 .col-xs-2 {
width: 16.66666667%;
}
.printer-preview-content .t70787 .col-xs-1 {
width: 8.33333333%;
}
.printer-preview-content .t70787 .col-no-margin {
margin-bottom: 0 !important;
}
.printer-preview-content .t70787 .clear-fix::after {
content: "";
clear: both;
display: table;
}
.printer-preview-content .t70787 .half-margin-top {
margin-top: 8px !important;
}
.printer-preview-content .t70787 .half-margin-bottom {
margin-bottom: 8px !important;
}
.printer-preview-content .t70787 .margin-bottom {
margin-bottom: 16px !important;
margin-top: 1px;
}
.printer-preview-content .t70787 .margin-top {
margin-top: 16px !important;
}
.printer-preview-content .t70787 .double-margin-top {
margin-top: 32px !important;
}
.printer-preview-content .t70787 .double-margin-bottom {
margin-bottom: 32px !important;
}
.printer-preview-content .t70787 .strikethrough {
text-decoration: line-through !important;
}
.printer-preview-content .t70787 .break {
word-break: break-all !important;
}
/* ### BASE - TABLE STYLING ### */
.printer-preview-content .t70787 table,
.printer-preview-content .t70787 .table {
width: 100%;
max-width: 100%;
background-color: transparent;
border-collapse: collapse;
}
.printer-preview-content .t70787 table thead {
display: table-row-group;
}
.printer-preview-content .t70787 table tbody tr {
page-break-inside: avoid !important;
page-break-after: auto !important;
}
.printer-preview-content .t70787 table tbody tr td {
page-break-inside: avoid !important;
}
.printer-preview-content .t70787 th {
white-space: nowrap;
text-align: left;
vertical-align: middle;
border-top: 0;
border-bottom: 0;
}
.printer-preview-content .t70787 td {
vertical-align: top;
border-top: 0;
border-bottom: 0;
}
.printer-preview-content .t70787 .order-table tbody > tr:nth-child(odd) td {
background-color: #f9f9f9;
}
.printer-preview-content .t70787 .pricing-table tbody > tr:nth-child(even) > td {
background-color: #f9f9f9;
}
/* .printer-preview-content .t70787 .pricing-table tbody > tr > td.pricing-table-title {
word-break: break-all;
}*/
.printer-preview-content .t70787 th.order-table-qty {
width: 10%;
}
.printer-preview-content .t70787 th.order-table-price {
width: 10%;
}
.printer-preview-content .t70787 th.order-table-item-total,
.printer-preview-content .t70787 th.order-table-reason {
width: 17%;
}
.printer-preview-content .t70787 th.order-table-return-comments {
width: 30%;
}
.printer-preview-content .t70787 .pricing-table-text {
text-align: right;
white-space: nowrap;
}
/* ### BASE - PRODUCT IMAGE SIZING TO RETAIN LINE HEIGHT RYTHM) ### */
.printer-preview-content .t70787 .product-image-wrapper {
width: 0px;
max-height: 0px;
vertical-align: middle;
text-align: center;
}
.printer-preview-content .t70787 .product-image {
padding: 0 4px;
page-break-inside: avoid !important;
max-width: 0px;
height: auto;
max-height: 0px;
}
/* ### BASE - LISTS RESET ### */
.printer-preview-content .t70787 ul {
list-style: none;
}
.printer-preview-content .t70787 li {
color: {{ secondary_font_color }};
list-style: none;
}
/* ### BASE - LOGO ### */
.printer-preview-content .t70787 .logo-wrapper {
display: inline-block;
width: 100%;
padding-bottom: 8px;
}
.printer-preview-content .t70787 .logo {
float: left;
padding-right: 15px;
max-width: 84%;
max-height: 90.72px;
}
/* ### BASE - BARCODE ### */
.printer-preview-content .t70787 .order-number-barcode,
.printer-preview-content .t70787 .product-barcode {
display: block;
}
/* ### BASE - ADDITONAL COMMON SHARED TYPOGRAPHY AND ALIGNMENT ### */
.printer-preview-content .t70787 .address {
margin-right: 5%;
}
.printer-preview-content .t70787 .col-xs-8 .notes,
.printer-preview-content .t70787 .col-xs-6 .notes {
margin-right: 20%;
}
.printer-preview-content .t70787 .notes-title,
.printer-preview-content .t70787 .return-codes {
margin: 8px 0;
}
/* ### BASE - HORIZONTAL RULE MARKS ### */
.printer-preview-content .t70787 hr {
background: {{ theme_color }};
border-top: 0;
border: 0;
height: 2px;
width: 100%;
margin-bottom: -2px;
}
}
</style>
<style type="text/css">
@media screen, print {
/* ### DESIGN SPECIFIC - TYPOGRAPHY ### */
.printer-preview-content .t70787 h1 {
font-family: '{{ secondary_font }}';
font-weight: bold;
color: {{ theme_color }};
font-size: 120px;
line-height: 1;
margin-bottom: 0;
margin-top: -8px;
margin-left: -4px;
letter-spacing: -8px;
}
.printer-preview-content .t70787 h2 {
font-family: '{{ secondary_font }}';
font-weight: bold;
color: {{ theme_color }};
margin-top: -16px;
text-transform: uppercase;
}
.printer-preview-content .t70787 h3 {
font-family: '{{ secondary_font }}';
color: {{ theme_color }};
}
/* ### DESIGN SPECIFIC - LOGO POSITIONING ### */
.printer-preview-content .t70787 .logo {
margin-top: 0px;
padding-right: 10px;
}
/* ### DESIGN SPECIFIC - STORE DETAILS ### */
.printer-preview-content .t70787 .shop-address-name {
font-family: '{{ secondary_font }}';
color: {{ theme_color }};
font-weight: bold;
text-transform: uppercase;
font-size: 13px;
}
.printer-preview-content .t70787 .shop-domain {
font-weight: bold;
}
.printer-preview-content .t70787 .shop-return-address b,
.printer-preview-content .t70787 .shop-return-address b * {
color: {{ primary_font_color }};
}
/* ### DESIGN SPECIFIC - ORDER DETAILS ### */
.printer-preview-content .t70787 .order-details-title {
display: inline-block;
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
font-family: '{{ secondary_font }}';
}
/* ### DESIGN SPECIFIC - BILL TO AND SHIP TO ADDRESS ### */
.printer-preview-content .t70787 .address-title {
font-family: '{{ secondary_font }}';
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
padding-bottom: 8px;
}
/* ### DESIGN SPECIFIC - TABLE HEADER ### */
.printer-preview-content .t70787 .order-table thead tr th {
padding-left: 4px;
padding-top: 8px;
padding-bottom: 8px;
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
font-family: '{{ secondary_font }}';
}
.printer-preview-content .t70787 th.order-table-qty,
.printer-preview-content .t70787 th.order-table-price {
width: 10%;
text-align: left;
}
.printer-preview-content .t70787 th.order-table-item-total,
.printer-preview-content .t70787 th.order-table-reason {
width: 10%;
}
.printer-preview-content .t70787 th.order-table-return-comments {
width: 20%;
}
/* ### DESIGN SPECIFIC - TABLE BODY (SHARED) ### */
.printer-preview-content .t70787 .order-table tbody tr td,
.printer-preview-content .t70787 .pricing-table tbody tr td {
padding-left: 4px;
padding-right: 4px;
border-top: 0;
padding-top: 8px;
border-bottom: 1px solid #efefef;
padding-bottom: 7px;
}
/* ### DESIGN SPECIFIC - ORDER TABLE SPECIFIC ### */
.printer-preview-content .t70787 .order-table tbody > tr > td.line-item-description,
.printer-preview-content .t70787 .order-table tbody > tr > td.line-item-qty {
font-weight: bold;
text-align: left;
color: {{ primary_font_color }};
}
.printer-preview-content .t70787 .order-table tbody > tr > td.line-item-price {
text-align: left;
}
.printer-preview-content .t70787 .order-table tbody > tr > td.line-item-description p.line-item-sku {
font-weight: normal;
}
.printer-preview-content .t70787 .order-table tbody > tr > td.line-item-description span.line-item-refund {
display: inline-block;
padding: 2px 8px;
margin-top: 4px;
background-color: #FFEA8A;
border-radius: 16px;
}
/* ### DESIGN SPECIFIC - PRICING TABLE SPECIFIC ### */
.printer-preview-content .t70787 .pricing-table tbody > tr.pricing-table-total-row .pricing-table-title,
.printer-preview-content .t70787 .pricing-table tbody > tr.pricing-table-total-row .pricing-table-text {
font-family: '{{ secondary_font }}';
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
border-bottom: 0;
}
/* ### DESIGN SPECIFIC - ORDER NOTES ### */
.printer-preview-content .t70787 .notes-title {
font-family: '{{ secondary_font }}';
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
}
/* ### DESIGN SPECIFIC - RETURN FORM REASON CODES ### */
.printer-preview-content .t70787 .return-codes b,
.printer-preview-content .t70787 .return-code b * {
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
}
/* ### DESIGN SPECIFIC - THANK YOU MESSAGE ### */
.printer-preview-content .t70787 .thanks-text {
margin: 0 10px;
text-align: left;
line-height: 32px;
font-size: 22px;
font-weight: bold;
color: {{ theme_color }};
font-family: '{{ secondary_font }}';
}
.printer-preview-content .t70787 .thanks-text * {
text-align: left;
line-height: 32px;
font-size: 22px;
color: {{ theme_color }};
text-transform: uppercase;
font-family: '{{ secondary_font }}';
font-weight: bold;
}
/* ### DESIGN SPECIFIC - GIFT MESSAGE ### */
.printer-preview-content .t70787 .gift-text {
text-align: center;
font-weight: bold;
width: 80%;
margin: 0 10%;
padding-top: 16px;
font-size: 16px;
}
.printer-preview-content .t70787 .gift-text * {
font-weight: bold;
font-size: 16px;
}
.printer-preview-content .t70787 .gift-text svg {
padding-bottom: 8px;
}
/* ### DESIGN SPECIFIC - TERMS AND CONDITIONS ### */
.printer-preview-content .t70787 .terms-text {
font-size: 9px;
text-align: center;
}
.printer-preview-content .t70787 .terms-text * {
font-size: 9px;
}
/* ### DESIGN SPECIFIC - SOCIAL ICONS ### */
.printer-preview-content .t70787 .social-icons {
display: inline;
width: 20px;
margin: 8px 4px;
}
}
</style>
<div class="printer-preview-content" contenteditable="true" spellcheck="false"
title="Click to edit text (changes will be printed but not saved)">
<div class="t70787">
<div class="row">
<div id="header-row">
<div class="col-xs-6">
<div class="logo-wrapper">
<a href="https://droplion.com" target="_blank">
<img class="logo" alt="Logo"
src="https://app.droplion.com/assets/img/logo-200x113.png"/>
</a>
</div>
</div>
<div class="col-xs-6">
<div class="shop-address-name editable" data-key="shop_name">
Rechnung<br>
<br>
</div>
<ul class="order-details">
<li class="order-details-invoice">
<span class="order-details-title editable" data-key="invoice_number">Rechnungs-Nr.</span>
<span class="order-details-text">{{ order.shopOrderId }}</span>
</li>
<li class="order-details-date">
<span class="order-details-title editable" data-key="date">Rechnungsdatum</span>
<span class="order-details-text">{{ orderDetail.createdAt | date: "%d.%m.%Y" }}</span>
</li>
<li class="order-details-email">
<span class="order-details-title editable" data-key="customer_email">E-Mail</span>
<span class="order-details-text">{{ customer.email }}</span>
</li>
</ul>
</div>
</div>
<div class="clear-fix"></div>
</div>
<div class="row">
<div class="col-xs-6">
<div class="address-title bill-to-title editable" data-key="bill_to">Rechnungsadresse</div>
<ul class="address">
<li>{{ customer.billingAddress.firstName }} {{ customer.billingAddress.lastName }}</li>
{% if customer.billingAddress.company != blank %}
<li>{{ customer.billingAddress.company }}</li>
{% endif %}
<li>{{ customer.billingAddress.street }} {{ customer.billingAddress.streetNo }}</li>
<li>{{ customer.billingAddress.city }} {{ customer.billingAddress.zip }}</li>
{% if customer.phone != blank %}
<li><span class="editable"
data-key="tel">Tel.</span> {{ customer.phone }}</li>
{% endif %}
</ul>
</div>
{% comment %} <div class="col-xs-6">
{% if shipping_address and shipping_address != "" and shipping_address != nil %}
<div class="address-title ship-to-title editable" data-key="ship_to">Versandadresse</div>
{% endif %}
<ul class="address">
{% if shipping_address and shipping_address != blank %}
<li>{{ shipping_address.name }}</li>
{% if shipping_address.company != blank %}
<li>{{ shipping_address.company }}</li>
{% endif %}
<li>{{ shipping_address.address1 }}</li>
{% if shipping_address.address2 != blank %}
<li>{{ shipping_address.address2 }}</li>
{% endif %}
<li>{{ shipping_address.zip | upcase }} {{ shipping_address.city }}</li>
{% if shipping_address.province != blank %}
<li>{{ shipping_address.province }}</li>
{% endif %}
{% if shop.country != shipping_address.country %}
<li>{{ shipping_address.country }}</li>
{% endif %}
<li><span class="editable" data-key="tel">Tel.</span> {{ shipping_address.phone }}</li>
{% endif %}
</ul>
</div>{% endcomment %}
<div class="clear-fix"></div>
</div>
<hr/>
<div class="row">
<div class="col-xs-12 col-no-margin">
<table class="order-table table">
<thead>
<tr>
<th class="order-table-title editable" data-key="item">Artikelbeschreibung</th>
<th class="order-table-qty text-center editable" data-key="qty">Anzahl<br>
</th>
<th class="order-table-price text-right editable" data-key="price">Preis<br>
</th>
<th class="order-table-item-total text-right editable" data-key="item_total">Gesamt</th>
</tr>
</thead>
<tbody>
{% comment %} <!-- Bold Product Options Snippet 1 -->
{% assign hidden_variant_ids = "" %}
{% for line_item in line_items %}
{% if line_item.properties._boldVariantIds %}
{% assign hidden_variant_ids = hidden_variant_ids | append: ',' %}
{% assign hidden_variant_ids = hidden_variant_ids | append: line_item.properties._boldVariantIds %}
{% endif %}
{% endfor %}
{% endcomment %}
{% assign hidden_variant_ids = hidden_variant_ids | split: ',' %}
<!-- END Bold Product Options Snippet 1 -->
{% for lineItem in lineItems %}
{% if lineItem.amount < 1 %}{% continue %}{% endif %}
<tr>
<td class="line-item-description">
<p style="font-weight: 700;">
{{ lineItem.productVariant.title | replace: " - Default Title", "" }}
</p>
</td>
<td class="text-center line-item-qty">× {{ lineItem.paid }}</td>
<td class="text-right no-wrap line-item-price">
{% if lineItem.discount > 0 %}
<p class="strikethrough"><s>{{ lineItem.netPrice | money }}</s></p>
<p>{{ lineItem.netPrice | minus: lineItem.discount | money }}</p>
{% else %}
<p>{{ lineItem.netPrice | money }}</p>
{% endif %}
</td>
<td class="text-right no-wrap line-item-line-price">
{% if lineItem.discount > 0 %}
<p>{{ lineItem.netPrice | minus: lineItem.discount | times: lineItem.paid | money }}</p>
{% else %}
<p>{{ lineItem.netPrice | times: lineItem.paid | money }}</p>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<div class="clear-fix"></div>
</div>
<div class="row">
<div class="col-xs-6 col-no-margin">
<div class="notes">
{% if orderDetails.note != blank %}
<div class="notes-title editable" data-key="order_notes">Anmerkungen</div>
<div class="notes-text">
{{ orderDetails.note | newline_to_br }}
</div>
{% endif %}
</div>
</div>
<div class="col-xs-6 col-no-margin">
<table class="pricing-table table">
<tbody>
{% if orderDetail.totalDiscount != 0.00 %}
<tr>
<td class="pricing-table-title"><span class="editable"
data-key="discount">Rabatt (Gesamt)</span>
</td>
<td class="pricing-table-text">-{{ orderDetail.totalDiscount | money }}</td>
</tr>
{% endif %}
{% comment %} <tr>
<td class="pricing-table-title editable" data-key="subtotal">Zwischensumme</td>
<td class="pricing-table-text">{{ subtotal_price | money }}</td>
</tr>
<tr>
<td class="pricing-table-title editable" data-key="shipping_handling">Versandkosten</td>
<td class="pricing-table-text">{{ shipping_price | default: 0 | money }}</td>
</tr>
<tr>
<td class="pricing-table-title editable" data-key="total_minus_tax">Gesamtsumme Netto</td>
<td class="pricing-table-text">{{ total_price | minus: total_tax | money }}</td>
</tr>
{% for tax_line in tax_lines %}
<tr>
<td class="pricing-table-title">{{ tax_line.title }} ({{ tax_line.rate | times: 100 }}%)
</td>
<td class="pricing-table-text">{{ tax_line.price | money }}</td>
</tr>
{% endfor %}{% endcomment %}
{% assign brutto_to_netto_divisor = 1.19 %}
{% assign total_netto = orderDetail.totalPrice | divided_by: brutto_to_netto_divisor %}
{% assign total_netto_rounded = total_netto | times: 100 | round | divided_by: 100 %}
{% assign tax_rounded = orderDetail.totalPrice | minus: total_netto | times: 100 | round | divided_by: 100 %}
<tr>
<td class="pricing-table-title"><span class="editable" data-key="total-netto">Gesamtbetrag Netto</span>
({{ orderDetail.currency }})
</td>
<td class="pricing-table-text">{{ total_netto_rounded | money }}</td>
</tr>
<tr>
<td class="pricing-table-title"><span class="editable" data-key="total-netto">zzgl. 19% MwSt.</span>
({{ orderDetail.currency }})
</td>
<td class="pricing-table-text">{{ tax_rounded | money }}</td>
</tr>
<tr class="pricing-table-total-row">
<td class="pricing-table-title"><span class="editable" data-key="total">Gesamtbetrag Brutto</span>
({{ orderDetail.currency }})
</td>
<td class="pricing-table-text">{{ orderDetail.totalPrice | money }}</td>
</tr>
</tbody>
</table>
</div>
<div class="clear-fix"></div>
</div>
<hr class="margin-bottom "/>
<div class="row">
<div class="col-xs-12">
<div class="terms-text full-editable" data-key="terms_and_conditions">
<p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p style="text-align: center;">Die Ware bleibt bis zur vollständigen Bezahlung im Eigentum des
Verkäufers. <br>
</p>
<p style="text-align: center;">Das Rechnungsdatum entspricht dem Leistungsdatum. Sofort fällig nach
Rechnungsstellung, ohne Abzug, innerhalb von maximal 14 Tagen.</p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</p>
</div>
</div>
<div class="clear-fix"></div>
</div>
<div class="row">
<div class="col-xs-1"></div>
<div class="col-xs-12 text-center col-no-margin">
<a href="https://droplion.com" target="_blank">
<div class="shop-domain editable" data-key="shop_domain">
Firma - Adresse - UST-ID: - WEEE-Reg.-Nr.:
- LUCID-Nr.: - IBAN: - BIC:
</div>
</a>
</div>
<div class="clear-fix"></div>
</div>
</div>
</div>Lieferschein
Oder herunterladen unter /doc/packaging-slip.liquid
<!-- Deliverylist -->
<!-- Common Base Styling -->
{% assign primary_font = "Poppins" %}
{% assign primary_font_color = "#000000" %} <!-- Black text color -->
{% assign primary_font_size = "11px" %}
{% assign secondary_font = "Poppins" %}
{% assign secondary_font_color = "#333333" %} <!-- Grey text color -->
{% assign theme_color = "#303336" %}
<script type="text/javascript">
var fHead = document.head || document.getElementsByTagName('head')[0];
{% assign font_weights = "300,400,700" | split: ',' %}
{% for font_weight in font_weights %}
var font1Id = 'font-{{ primary_font | replace: " ", "-" }}-{{ font_weight }}';
if (!document.getElementById(font1Id)) {
var linkElement = document.createElement('link');
linkElement.setAttribute('id', font1Id)
linkElement.setAttribute('rel', 'stylesheet');
linkElement.setAttribute('type', 'text/css');
linkElement.setAttribute('href', 'https://fonts.googleapis.com/css?family={{ primary_font | replace: " ", "+" }}:{{ font_weight }}&subset=latin-ext');
fHead.appendChild(linkElement);
}
;
{% if secondary_font != blank and secondary_font != primary_font %}
var font2Id = 'font-{{ secondary_font | replace: " ", "-" }}-{{ font_weight }}';
if (!document.getElementById(font2Id)) {
var linkElement = document.createElement('link');
linkElement.setAttribute('id', font2Id)
linkElement.setAttribute('rel', 'stylesheet');
linkElement.setAttribute('type', 'text/css');
linkElement.setAttribute('href', 'https://fonts.googleapis.com/css?family={{ secondary_font | replace: " ", "+" }}:{{ font_weight }}&subset=latin-ext');
fHead.appendChild(linkElement);
}
;
{% endif %}
{% endfor %}
</script>
<style type="text/css">
/* ### BASE - PAGE SIZING AND MARGIN SETUP NORMALIZATION ACROSS BROWSERS ### */
@page {
margin: 12mm !important;
margin-top: 12mm !important;
margin-right: 12mm !important;
margin-bottom: 12mm !important;
margin-left: 12mm !important;
}
@media print {
.safari {
padding-top: 15px;
box-sizing: border-box;
}
.printer-preview-content:after {
content: "";
display: table;
clear: both;
}
.printer-preview-content .printer-preview-content {
padding-left: 15px;
padding-right: 15px;
box-sizing: border-box;
}
}
@media screen {
.printer-preview-content {
padding: 16px 0;
min-height: 800px;
/* background-image: url(http://basehold.it/i/16) */
}
.printer-preview-content .printer-preview-content {
margin-right: auto;
margin-left: auto;
max-width: 680px;
}
}
@media screen, print {
/* ### BASE - TYPOGRAPHY AND REMOVAL OF STANDARD SHOPIFY STYLING ### */
.printer-preview-content .t106151 * {
color: {{ secondary_font_color }};
font-family: '{{ primary_font }}';
font-size: {{ primary_font_size }};
font-weight: 400;
line-height: 16px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
margin: 0 0 0 0;
padding: 0 0 0 0;
-webkit-print-color-adjust: exact;
overflow: visible !important;
}
.printer-preview-content .t106151 h1 {
font-size: 18px;
line-height: 32px;
}
.printer-preview-content .t106151 h2 {
font-size: 18px;
line-height: 32px;
}
.printer-preview-content .t106151 h3 {
font-size: 14px;
line-height: 16px;
}
.printer-preview-content .t106151 h1,
.printer-preview-content .t106151 h2,
.printer-preview-content .t106151 h3 {
margin-bottom: 16px;
}
.printer-preview-content .t106151 a,
.printer-preview-content .t106151 a * {
text-decoration: none !important;
}
.printer-preview-content .t106151 b,
.printer-preview-content .t106151 b * {
font-weight: bold;
}
.printer-preview-content .t106151 .text-right {
text-align: right;
}
.printer-preview-content .t106151 .text-center {
text-align: center;
}
.printer-preview-content .t106151 .no-wrap {
white-space: nowrap;
}
/* ### BASE - GRID AND RE-USABLE LAYOUT COMPONENTS ### */
.printer-preview-content .t106151 .row {
width: 100%;
display: block;
clear: both;
}
.printer-preview-content .t106151 .row:after {
content: "";
display: table;
clear: both;
}
.printer-preview-content .t106151 .col-xs-1,
.printer-preview-content .t106151 .col-xs-2,
.printer-preview-content .t106151 .col-xs-3,
.printer-preview-content .t106151 .col-xs-4,
.printer-preview-content .t106151 .col-xs-5,
.printer-preview-content .t106151 .col-xs-6,
.printer-preview-content .t106151 .col-xs-7,
.printer-preview-content .t106151 .col-xs-8,
.printer-preview-content .t106151 .col-xs-9,
.printer-preview-content .t106151 .col-xs-10,
.printer-preview-content .t106151 .col-xs-11,
.printer-preview-content .t106151 .col-xs-12 {
float: left;
min-height: 1px;
margin-bottom: 32px;
}
.printer-preview-content .t106151 .col-xs-12 {
width: 100%;
}
.printer-preview-content .t106151 .col-xs-11 {
width: 91.66666667%;
}
.printer-preview-content .t106151 .col-xs-10 {
width: 83.33333333%;
}
.printer-preview-content .t106151 .col-xs-9 {
width: 75%;
}
.printer-preview-content .t106151 .col-xs-8 {
width: 66.66666667%;
}
.printer-preview-content .t106151 .col-xs-7 {
width: 58.33333333%;
}
.printer-preview-content .t106151 .col-xs-6 {
width: 50%;
}
.printer-preview-content .t106151 .col-xs-5 {
width: 41.66666667%;
}
.printer-preview-content .t106151 .col-xs-4 {
width: 33.33333333%;
}
.printer-preview-content .t106151 .col-xs-3 {
width: 25%;
}
.printer-preview-content .t106151 .col-xs-2 {
width: 16.66666667%;
}
.printer-preview-content .t106151 .col-xs-1 {
width: 8.33333333%;
}
.printer-preview-content .t106151 .col-no-margin {
margin-bottom: 0 !important;
}
.printer-preview-content .t106151 .clear-fix::after {
content: "";
clear: both;
display: table;
}
.printer-preview-content .t106151 .half-margin-top {
margin-top: 8px !important;
}
.printer-preview-content .t106151 .half-margin-bottom {
margin-bottom: 8px !important;
}
.printer-preview-content .t106151 .margin-bottom {
margin-bottom: 16px !important;
margin-top: 1px;
}
.printer-preview-content .t106151 .margin-top {
margin-top: 16px !important;
}
.printer-preview-content .t106151 .double-margin-top {
margin-top: 32px !important;
}
.printer-preview-content .t106151 .double-margin-bottom {
margin-bottom: 32px !important;
}
.printer-preview-content .t106151 .strikethrough {
text-decoration: line-through !important;
}
.printer-preview-content .t106151 .break {
word-break: break-all !important;
}
/* ### BASE - TABLE STYLING ### */
.printer-preview-content .t106151 table,
.printer-preview-content .t106151 .table {
width: 100%;
max-width: 100%;
background-color: transparent;
border-collapse: collapse;
}
.printer-preview-content .t106151 table thead {
display: table-row-group;
}
.printer-preview-content .t106151 table tbody tr {
page-break-inside: avoid !important;
page-break-after: auto !important;
}
.printer-preview-content .t106151 table tbody tr td {
page-break-inside: avoid !important;
}
.printer-preview-content .t106151 th {
white-space: nowrap;
text-align: left;
vertical-align: middle;
border-top: 0;
border-bottom: 0;
}
.printer-preview-content .t106151 td {
vertical-align: top;
border-top: 0;
border-bottom: 0;
}
.printer-preview-content .t106151 .order-table tbody > tr:nth-child(odd) td {
background-color: #f9f9f9;
}
.printer-preview-content .t106151 .pricing-table tbody > tr:nth-child(even) > td {
background-color: #f9f9f9;
}
/* .printer-preview-content .t106151 .pricing-table tbody > tr > td.pricing-table-title {
word-break: break-all;
}*/
.printer-preview-content .t106151 th.order-table-qty {
width: 10%;
}
.printer-preview-content .t106151 th.order-table-price {
width: 10%;
}
.printer-preview-content .t106151 th.order-table-item-total,
.printer-preview-content .t106151 th.order-table-reason {
width: 17%;
}
.printer-preview-content .t106151 th.order-table-return-comments {
width: 30%;
}
.printer-preview-content .t106151 .pricing-table-text {
text-align: right;
white-space: nowrap;
}
/* ### BASE - PRODUCT IMAGE SIZING TO RETAIN LINE HEIGHT RYTHM) ### */
.printer-preview-content .t106151 .product-image-wrapper {
width: 0px;
max-height: 0px;
vertical-align: middle;
text-align: center;
}
.printer-preview-content .t106151 .product-image {
padding: 0 4px;
page-break-inside: avoid !important;
max-width: 0px;
height: auto;
max-height: 0px;
}
/* ### BASE - LISTS RESET ### */
.printer-preview-content .t106151 ul {
list-style: none;
}
.printer-preview-content .t106151 li {
color: {{ secondary_font_color }};
list-style: none;
}
/* ### BASE - LOGO ### */
.printer-preview-content .t106151 .logo-wrapper {
display: inline-block;
width: 100%;
padding-bottom: 8px;
}
.printer-preview-content .t106151 .logo {
float: left;
padding-right: 15px;
max-width: 84%;
max-height: 90.72px;
}
/* ### BASE - BARCODE ### */
.printer-preview-content .t106151 .order-number-barcode,
.printer-preview-content .t106151 .product-barcode {
display: block;
}
/* ### BASE - ADDITONAL COMMON SHARED TYPOGRAPHY AND ALIGNMENT ### */
.printer-preview-content .t106151 .address {
margin-right: 5%;
}
.printer-preview-content .t106151 .col-xs-8 .notes,
.printer-preview-content .t106151 .col-xs-6 .notes {
margin-right: 20%;
}
.printer-preview-content .t106151 .notes-title,
.printer-preview-content .t106151 .return-codes {
margin: 8px 0;
}
/* ### BASE - HORIZONTAL RULE MARKS ### */
.printer-preview-content .t106151 hr {
background: {{ theme_color }};
border-top: 0;
border: 0;
height: 2px;
width: 100%;
margin-bottom: -2px;
}
}
</style>
<style type="text/css">
@media screen, print {
/* ### DESIGN SPECIFIC - TYPOGRAPHY ### */
.printer-preview-content .t106151 h1 {
font-family: '{{ secondary_font }}';
font-weight: bold;
color: {{ theme_color }};
font-size: 120px;
line-height: 1;
margin-bottom: 0;
margin-top: -8px;
margin-left: -4px;
letter-spacing: -8px;
}
.printer-preview-content .t106151 h2 {
font-family: '{{ secondary_font }}';
font-weight: bold;
color: {{ theme_color }};
margin-top: -16px;
text-transform: uppercase;
}
.printer-preview-content .t106151 h3 {
font-family: '{{ secondary_font }}';
color: {{ theme_color }};
}
/* ### DESIGN SPECIFIC - LOGO POSITIONING ### */
.printer-preview-content .t106151 .logo {
margin-top: 0px;
padding-right: 10px;
}
/* ### DESIGN SPECIFIC - STORE DETAILS ### */
.printer-preview-content .t106151 .shop-address-name {
font-family: '{{ secondary_font }}';
color: {{ theme_color }};
font-weight: bold;
text-transform: uppercase;
font-size: 13px;
}
.printer-preview-content .t106151 .shop-domain {
font-weight: bold;
}
.printer-preview-content .t106151 .shop-return-address b,
.printer-preview-content .t106151 .shop-return-address b * {
color: {{ primary_font_color }};
}
/* ### DESIGN SPECIFIC - ORDER DETAILS ### */
.printer-preview-content .t106151 .order-details-title {
display: inline-block;
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
font-family: '{{ secondary_font }}';
}
/* ### DESIGN SPECIFIC - BILL TO AND SHIP TO ADDRESS ### */
.printer-preview-content .t106151 .address-title {
font-family: '{{ secondary_font }}';
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
padding-bottom: 8px;
}
/* ### DESIGN SPECIFIC - TABLE HEADER ### */
.printer-preview-content .t106151 .order-table thead tr th {
padding-left: 4px;
padding-top: 8px;
padding-bottom: 8px;
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
font-family: '{{ secondary_font }}';
}
.printer-preview-content .t106151 th.order-table-qty,
.printer-preview-content .t106151 th.order-table-price {
width: 10%;
text-align: left;
}
.printer-preview-content .t106151 th.order-table-item-total,
.printer-preview-content .t106151 th.order-table-reason {
width: 10%;
}
.printer-preview-content .t106151 th.order-table-return-comments {
width: 20%;
}
/* ### DESIGN SPECIFIC - TABLE BODY (SHARED) ### */
.printer-preview-content .t106151 .order-table tbody tr td,
.printer-preview-content .t106151 .pricing-table tbody tr td {
padding-left: 4px;
padding-right: 4px;
border-top: 0;
padding-top: 8px;
border-bottom: 1px solid #efefef;
padding-bottom: 7px;
}
/* ### DESIGN SPECIFIC - ORDER TABLE SPECIFIC ### */
.printer-preview-content .t106151 .order-table tbody > tr > td.line-item-description,
.printer-preview-content .t106151 .order-table tbody > tr > td.line-item-qty {
font-weight: bold;
text-align: left;
color: {{ primary_font_color }};
}
.printer-preview-content .t106151 .order-table tbody > tr > td.line-item-price {
text-align: left;
}
.printer-preview-content .t106151 .order-table tbody > tr > td.line-item-description p.line-item-sku {
font-weight: normal;
}
.printer-preview-content .t106151 .order-table tbody > tr > td.line-item-description span.line-item-refund {
display: inline-block;
padding: 2px 8px;
margin-top: 4px;
background-color: #FFEA8A;
border-radius: 16px;
}
/* ### DESIGN SPECIFIC - PRICING TABLE SPECIFIC ### */
.printer-preview-content .t106151 .pricing-table tbody > tr.pricing-table-total-row .pricing-table-title,
.printer-preview-content .t106151 .pricing-table tbody > tr.pricing-table-total-row .pricing-table-text {
font-family: '{{ secondary_font }}';
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
border-bottom: 0;
}
/* ### DESIGN SPECIFIC - ORDER NOTES ### */
.printer-preview-content .t106151 .notes-title {
font-family: '{{ secondary_font }}';
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
}
/* ### DESIGN SPECIFIC - RETURN FORM REASON CODES ### */
.printer-preview-content .t106151 .return-codes b,
.printer-preview-content .t106151 .return-code b * {
color: {{ primary_font_color }};
font-weight: bold;
text-transform: uppercase;
}
/* ### DESIGN SPECIFIC - THANK YOU MESSAGE ### */
.printer-preview-content .t106151 .thanks-text {
margin: 0 10px;
text-align: left;
line-height: 32px;
font-size: 22px;
font-weight: bold;
color: {{ theme_color }};
font-family: '{{ secondary_font }}';
}
.printer-preview-content .t106151 .thanks-text * {
text-align: left;
line-height: 32px;
font-size: 22px;
color: {{ theme_color }};
text-transform: uppercase;
font-family: '{{ secondary_font }}';
font-weight: bold;
}
/* ### DESIGN SPECIFIC - GIFT MESSAGE ### */
.printer-preview-content .t106151 .gift-text {
text-align: center;
font-weight: bold;
width: 80%;
margin: 0 10%;
padding-top: 16px;
font-size: 16px;
}
.printer-preview-content .t106151 .gift-text * {
font-weight: bold;
font-size: 16px;
}
.printer-preview-content .t106151 .gift-text svg {
padding-bottom: 8px;
}
/* ### DESIGN SPECIFIC - TERMS AND CONDITIONS ### */
.printer-preview-content .t106151 .terms-text {
font-size: 9px;
text-align: center;
}
.printer-preview-content .t106151 .terms-text * {
font-size: 9px;
}
/* ### DESIGN SPECIFIC - SOCIAL ICONS ### */
.printer-preview-content .t106151 .social-icons {
display: inline;
width: 20px;
margin: 8px 4px;
}
}
</style>
<div class="printer-preview-content" contenteditable="true" spellcheck="false"
title="Click to edit text (changes will be printed but not saved)">
<div class="t106151">
<div class="row">
<div id="header-row">
<div class="col-xs-6">
<div class="logo-wrapper">
<a href="https://droplion.com" target="_blank">
<img class="logo" alt="Logo"
src="https://app.droplion.com/assets/img/logo-200x113.png"/>
</a>
</div>
</div>
<div class="col-xs-6">
<div class="shop-address-name editable" data-key="shop_name">
Lieferschein <br>
<br>
</div>
<ul class="order-details">
<li class="order-details-invoice">
<span class="order-details-title editable" data-key="invoice_number">Lieferschein-Nr.</span>
<span class="order-details-text">{{ order.shopOrderId }}</span>
</li>
<li class="order-details-date">
<span class="order-details-title editable" data-key="date">Lieferscheindatum</span>
<span class="order-details-text">{{ orderDetail.createdAt | date: "%d.%m.%Y" }}</span>
</li>
{% if shipping_method.title != blank %}
<li class="order-details-shipping">
<span class="order-details-title editable" data-key="shipping_method">Lieferung</span>
<span class="order-details-text">{{ orderDetail.shippingProvider | upcase }}</span>
</li>
{% endif %}
<li class="order-details-email">
<span class="order-details-title editable" data-key="customer_email">E-Mail</span>
<span class="order-details-text">{{ customer.email }}</span>
</li>
</ul>
</div>
</div>
<div class="clear-fix"></div>
</div>
<div class="row">
<div class="col-xs-6">
<div class="address-title ship-to-title editable" data-key="ship_to">Lieferadresse</div>
<ul class="address">
<li>{{ customer.shippingAddress.firstName }} {{ customer.shippingAddress.lastName }}</li>
{% if customer.shippingAddress.company != blank %}
<li>{{ customer.shippingAddress.company }}</li>
{% endif %}
<li>{{ customer.shippingAddress.street }} {{ customer.shippingAddress.streetNo }}</li>
<li>{{ customer.shippingAddress.city }} {{ customer.shippingAddress.zip }}</li>
{% if customer.phone != blank %}
<li><span class="editable"
data-key="tel">Tel.</span> {{ customer.phone }}</li>
{% endif %}
</ul>
</div>
<div class="clear-fix"></div>
</div>
<hr/>
<div class="row">
<div class="col-xs-12 col-no-margin">
<table class="order-table table">
<thead>
<tr>
<th class="order-table-title editable" data-key="item">GELIEFERTE PRODUKTE</th>
<th class="order-table-qty text-center editable" data-key="qty">ANZAHL<br>
</tr>
</thead>
<tbody>
{% for lineItem in lineItems %}
{% if lineItem.amount < 1 %}{% continue %}{% endif %}
<tr>
<td class="line-item-description">
<p style="font-weight: 700;">
{{ lineItem.productVariant.title | replace: " - Default Title", "" }}
</p>
</td>
<td class="text-center line-item-qty">× {{ lineItem.pending }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<div class="clear-fix"></div>
</div>
<div class="row">
<div class="col-xs-6 col-no-margin">
</div>
<div class="col-xs-6 col-no-margin">
</div>
<div class="clear-fix"></div>
</div>
<hr class="margin-bottom "/>
<div class="row">
<div class="col-xs-12">
<div class="terms-text full-editable" data-key="terms_and_conditions">
<p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p style="text-align: center;">Vielen Dank für Deine Bestellung!<br>
</p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</p>
</div>
</div>
<div class="clear-fix"></div>
</div>
<div class="row">
<div class="col-xs-12 text-center col-no-margin">
<a href="https://droplion.com" target="_blank">
<div class="shop-domain editable" data-key="shop_domain">
Firma - Adresse - UST-ID: - WEEE-Reg.-Nr.:
- LUCID-Nr.: - IBAN: - BIC:
</div>
</a>
</div>
<div class="clear-fix"></div>
</div>
</div>
</div>