Standard invoice template

invoice.mustache

<div class="two-col clearfix">
	<div class="title">
		{{theme.header}}
		<small>{{invoice.number}}</small>
	</div>
	
	<div class="col">
        <div class="from-holder">
            <div class="logo">
                {{#company.logo}}<img src="{{company.logo}}" />{{/company.logo}}
            </div>

            <div class="contact from">
                <div class="field">{{theme.from_title}}</div>
                <div class="value">
                    <div class="name">{{company.name}}</div>
                    <div class="address">{{{company.address}}}</div>
                </div>
            </div>
        </div>

        {{^invoice.ship_to}}
            <div class="contact to">
                <div class="field">{{theme.to_title}}</div>
                <div class="value">
                    {{#customer.attention_to}}<div class="attention_to">ATTN: {{customer.attention_to}}</div>{{/customer.attention_to}}
                    <div class="name">{{customer.name}}</div>
                    <div class="address">{{{customer.address}}}</div>
                </div>
            </div>
        {{/invoice.ship_to}}
        {{#invoice.ship_to}}
            <div class="two-col clearfix">
                <div class="col">
                    <div class="contact to">
                        <div class="field">{{theme.to_title}}</div>
                        <div class="value">
                            {{#customer.attention_to}}<div class="attention_to">ATTN: {{customer.attention_to}}</div>{{/customer.attention_to}}
                            <div class="name">{{customer.name}}</div>
                            <div class="address">{{{customer.address}}}</div>
                        </div>
                    </div>
                </div>
                <div class="col">
                    <div class="contact to">
                        <div class="field">{{theme.ship_to_title}}</div>
                        <div class="value">
                            {{#attention_to}}<div class="attention_to">ATTN: {{attention_to}}</div>{{/attention_to}}
                            <div class="name">{{name}}</div>
                            <div class="address">{{{address}}}</div>
                        </div>
                    </div>
                </div>
            </div>
        {{/invoice.ship_to}}
	</div>
	<div class="col">
		{{#theme.show_customer_no}}
			<div class="field-holder">
				<div class="value">{{customer.number}}</div>
				<div class="field">{{theme.customer_number_title}}</div>
			</div>
		{{/theme.show_customer_no}}
		{{#invoice.date}}
			<div class="field-holder">
				<div class="value">{{invoice.date}}</div>
				<div class="field">{{theme.date_title}}</div>
			</div>
		{{/invoice.date}}
		{{#invoice.payment_terms}}
			<div class="field-holder">
				<div class="value">{{invoice.payment_terms}}</div>
				<div class="field">{{theme.payment_terms_title}}</div>
			</div>
		{{/invoice.payment_terms}}
		{{#invoice.due_date}}
			<div class="field-holder">
				<div class="value">{{invoice.due_date}}</div>
				<div class="field">{{theme.due_date_title}}</div>
			</div>
		{{/invoice.due_date}}
		{{#invoice.purchase_order}}
			<div class="field-holder">
				<div class="value">{{invoice.purchase_order}}</div>
				<div class="field">{{theme.purchase_order_title}}</div>
			</div>
		{{/invoice.purchase_order}}
		{{#invoice.customFields}}
			<div class="field-holder">
				<div class="value">{{value}}</div>
				<div class="field">{{name}}</div>
			</div>
		{{/invoice.customFields}}
		<div class="field-holder highlight">
			<div class="value">{{{invoice.balance}}}</div>
			<div class="field">{{theme.balance_title}}</div>
		</div>
	</div>
</div>

<div class="items-holder">
	<table class="items">
		<thead>
			<tr>
				<th>
					<div>{{theme.item_header}}</div>
				</th>
				<th>
					<div>{{theme.quantity_header}}</div>
				</th>
				<th class="money-column">
					<div>{{theme.unit_cost_header}}</div>
				</th>
				<th class="money-column">
					<div>{{theme.amount_header}}</div>
				</th>
			</tr>
		</thead>
		<tbody>
			{{#invoice.items}}
				<tr class="item">
					<td class="name">{{{name}}}</td>
					<td class="quantity">{{quantity}}</td>
					<td class="unit_cost">{{{unit_cost}}}</td>
					<td class="amount">{{{amount}}}</td>
				</tr>
				{{#billing_period}}
					<tr class="details">
						<td colspan="4">
							{{{billing_period}}}
						</td>
					</tr>
				{{/billing_period}}
				{{#description}}
					<tr class="details">
						<td colspan="4">
							{{{description}}}
						</td>
					</tr>
				{{/description}}
				{{#rates}}
					<tr class="details">
						<td colspan="4">
							<div class="rates">{{{rates}}}</div>
						</td>
					</tr>
				{{/rates}}
			{{/invoice.items}}
		</tbody>
	</table>
</div>

<div class="totals clearfix">
	{{#invoice.show_subtotal}}
		<div class="field-holder">
			<div class="value">{{{invoice.subtotal}}}</div>
			<div class="field">{{theme.subtotal_title}}</div>
		</div>
	{{/invoice.show_subtotal}}
	{{#invoice.rates}}
		<div class="field-holder">
			<div class="value">{{{total}}}</div>
			<div class="field">{{name}}</div>
		</div>
		{{#expires}}
			<div class="field-holder">
				<div class="value expires">
					Expires {{expires}}
				</div>
			</div>
		{{/expires}}
	{{/invoice.rates}}
	<div class="field-holder">
		<div class="value">{{{invoice.total}}}</div>
		<div class="field">{{theme.total_title}}</div>
	</div>
	{{#invoice.amount_paid}}
		<div class="field-holder">
			<div class="value">{{{invoice.amount_paid}}}</div>
			<div class="field">{{theme.amount_paid_title}}</div>
		</div>
	{{/invoice.amount_paid}}
</div>

<div class="footer">
	{{#invoice.notes}}
		<div class="notes-holder">
			<div class="field">{{theme.notes_title}}</div>
			<div class="notes">{{{invoice.notes}}}</div>
		</div>
	{{/invoice.notes}}
	{{#invoice.terms}}
		<div class="terms-holder">
			<div class="field">{{theme.terms_title}}</div>
			<div class="terms">{{{invoice.terms}}}</div>
		</div>
	{{/invoice.terms}}
</div>