Skip to content

Instantly share code, notes, and snippets.

@cotcomsol

cotcomsol/check.html

Last active Jan 9, 2019
Embed
What would you like to do?
<style type="text/css" scoped>
@media screen {
div#checkprint {
display: none;
}
}
@media print {
tr.onscreen {
display: none;
}
div#printable-content.panel {
font-size: 14pt !important; font-weight: normal;
line-height: 1.25;
}
table#vouchertable {
position: absolute;
top: 470px;
}
table#vouchertable2 {
position: absolute;
top: 950px;
}
div#date {
position: absolute;
top: 80px;
left: 930px;
}
div#amount{
position: absolute;
top: 130px;
left: 930px;
}
div#payee{
position: absolute;
top: 130px;
left: 100px;
}
div#amountwords{
position: absolute;
top: 180px;
left: 0px;
right: -100pt;

 white-space: nowrap;
overflow: hidden;
}
div#address {
position: absolute;
top: 220px;
left: 180px;
}
div#memo {
position: absolute;
top: 320px;
left: 100px;
}
}
}
</style>
{% capture payee %}{{ recipient.name }}{% endcapture %}
{% capture date %}{% for field in fields %}{% if field.label == "Date" %}{{ field.text }}{% endif %}{% endfor %}{% endcapture %}
{% capture amount %}{% for total in table.totals %}{% if total.label == "Total" %}{{ total.text }}{% endif %}{% endfor %}{% endcapture %}
{% capture anc %}{% for total in table.totals %}{% if total.label == "Total" %}{% assign an=total.number %}{% endif %}{% endfor %}{% endcapture %}
{% capture amount_in_words %}{% for total in table.totals %}{% if total.label == "Total" %}{{ total.number | spell_out }}{% endif %}{% endfor %}{% endcapture %}
{% capture cents%}{{an| plus: 0 | modulo: 1| times: 100 | round: 0}}{%endcapture%}
{% capture cents_in_words %}{% if cents != "0" %}{{cents|prepend: " and " | append: "/100 "}}{% endif %}{% endcapture %}
<div id="checkprint">
<div id="date">{{date}}</div>
<div id="payee">{{payee}}</div>
<div id="amount">{{-amount | remove: "$"|strip|prepend: '***'-}}</div>
<div id="amountwords"><span>{{amount_in_words}}{{cents_in_words}}* * * * * * *</span></div>
<div id="address">{{recipient.name}}<br>{{ recipient.address | newline_to_br }}</div>
<div id="memo">{{description}}</div>
</div>
<table style="padding: 30px" id="vouchertable">
<thead>
<tr class="onscreen">
<td colspan="99">
<table style="margin-bottom: 20px"><tr>
<td>
<div><b>{{ recipient.name }}</b> {{ recipient.code }}</div>
<div>{{ recipient.address | newline_to_br }}</div>
<div>{{ recipient.identifier }}</div>
</td>
<td style="{% if business.address != null %}border-right-width: 1px; padding-right: 20px; {% endif %}text-align: right">
{% for field in fields %}
<div style="font-weight: bold">{{ field.label }}</div>
<div style="margin-bottom: 10px">{{ field.text }}</div>
{% endfor %}
</td>
{% if business.address != null %}
<td style="padding-left: 20px; width: 1px; white-space: nowrap">
<div style="font-weight: bold">{{ business.name }}</div>
<div>{{ business.address | newline_to_br }}</div>
<div>{{ business.identifier }}</div>
</td>
{% endif %}
</tr></table>
<div style="font-size: 14px; font-weight: bold; margin-bottom: 20px">{{ description }}</div>
</td>
</tr>
<tr>
{% for column in table.columns %}
<td style="font-weight: bold; padding: 5px 10px; text-align: {{ column.align }}; border-left-width: 1px; border-bottom-width: 1px; border-top-width: 1px{% if forloop.last == true %}; border-right-width: 1px{% endif %}{% if column.nowrap %}; width: 80px{% endif %}">{{ column.label }}</td>
{% endfor %}
</tr>
</thead>
<tbody>
{% for row in table.rows %}
<tr>
{% for cell in row.cells %}
<td style="padding: 5px 10px; text-align: {{ table.columns[forloop.index0].align }}; border-left-width: 1px{% if forloop.last == true %}; border-right-width: 1px{% endif %}{% if table.columns[forloop.index0].nowrap %}; white-space: nowrap; width: 80px{% endif %}">{{ cell.text | newline_to_br }}</td>
{% endfor %}
</tr>
{% endfor %}
<tr>
{% for column in table.columns %}
<td style="border-bottom-width: 1px; border-left-width: 1px{% if forloop.last == true %}; border-right-width: 1px{% endif %}">&nbsp;</td>
{% endfor %}
</tr>
{% for total in table.totals %}
<tr>
<td colspan="{{ table.columns | size | minus:1 }}" style="padding: 5px 10px; text-align: right{% if total.emphasis == true %}; font-weight: bold{% endif %}">{{ total.label }}</td>
<td style="border-left-width: 1px; white-space: nowrap; border-right-width: 1px; border-bottom-width: 1px; padding: 5px 10px; text-align: right{% if total.emphasis == true %}; font-weight: bold{% endif %}">{{ total.text }}</td>
</tr>
{% endfor %}
{% for field in custom_fields %}
<tr>
<td colspan="99">
<div style="font-weight: bold; padding-top: 20px">{{ field.label }}</div>
<div>{{ field.text | newline_to_br }}</div>
</td>
</tr>
{% endfor %}
<tr>
<td colspan="99">
{% if emphasis.text != null and emphasis.positive %}
<div style="text-align: center; margin-top: 40px"><span style="color: #006400; border-width: 5px; border-color: #006400; padding: 10px; font-size: 20px">{{ emphasis.text | upcase }}</span></div>
{% endif %}
{% if emphasis.text != null and emphasis.negative %}
<div style="text-align: center; margin-top: 40px"><span style="color: #FF0000; border-width: 5px; border-color: #FF0000; padding: 10px; font-size: 20px">{{ emphasis.text | upcase }}</span></div>
{% endif %}
</td>
</tr>
</tbody>
</table>
<table style="padding: 30px" id="vouchertable2">
<thead>
<tr>
{% for column in table.columns %}
<td style="font-weight: bold; padding: 5px 10px; text-align: {{ column.align }}; border-left-width: 1px; border-bottom-width: 1px; border-top-width: 1px{% if forloop.last == true %}; border-right-width: 1px{% endif %}{% if column.nowrap %}; width: 80px{% endif %}">{{ column.label }}</td>
{% endfor %}
</tr>
</thead>
<tbody>
{% for row in table.rows %}
<tr>
{% for cell in row.cells %}
<td style="padding: 5px 10px; text-align: {{ table.columns[forloop.index0].align }}; border-left-width: 1px{% if forloop.last == true %}; border-right-width: 1px{% endif %}{% if table.columns[forloop.index0].nowrap %}; white-space: nowrap; width: 80px{% endif %}">{{ cell.text | newline_to_br }}</td>
{% endfor %}
</tr>
{% endfor %}
<tr>
{% for column in table.columns %}
<td style="border-bottom-width: 1px; border-left-width: 1px{% if forloop.last == true %}; border-right-width: 1px{% endif %}">&nbsp;</td>
{% endfor %}
</tr>
{% for total in table.totals %}
<tr>
<td colspan="{{ table.columns | size | minus:1 }}" style="padding: 5px 10px; text-align: right{% if total.emphasis == true %}; font-weight: bold{% endif %}">{{ total.label }}</td>
<td style="border-left-width: 1px; white-space: nowrap; border-right-width: 1px; border-bottom-width: 1px; padding: 5px 10px; text-align: right{% if total.emphasis == true %}; font-weight: bold{% endif %}">{{ total.text }}</td>
</tr>
{% endfor %}
{% for field in custom_fields %}
<tr>
<td colspan="99">
<div style="font-weight: bold; padding-top: 20px">{{ field.label }}</div>
<div>{{ field.text | newline_to_br }}</div>
</td>
</tr>
{% endfor %}
<tr>
<td colspan="99">
{% if emphasis.text != null and emphasis.positive %}
<div style="text-align: center; margin-top: 40px"><span style="color: #006400; border-width: 5px; border-color: #006400; padding: 10px; font-size: 20px">{{ emphasis.text | upcase }}</span></div>
{% endif %}
{% if emphasis.text != null and emphasis.negative %}
<div style="text-align: center; margin-top: 40px"><span style="color: #FF0000; border-width: 5px; border-color: #FF0000; padding: 10px; font-size: 20px">{{ emphasis.text | upcase }}</span></div>
{% endif %}
</td>
</tr>
</tbody>
</table>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.