---
receipt:   Oz-Ware Purchase Invoice
date:      2007-08-06
prettyDate: <%= grunt.template.date(date, 'yyyy-mm-dd') %>
customer:
  given:   Dorothy
  family:  Gale

items:
  - part_no:   A4786
    descrip:   Water Bucket (Filled)
    price:     1.47
    quantity:  4

  - part_no:   E1628
    descrip:   High Heeled "Ruby" Slippers
    size:      8
    price:     100.27
    quantity:  1

bill-to:  &id001
  street: |
          123 Tornado Alley
          Suite 16
  city:   East Centerville
  state:  KS

ship-to:  *id001

specialDelivery: >
  Follow the Yellow Brick
  Road to the Emerald City.
  Pay no attention to the
  man behind the curtain.
---
<div class="page-header">
  <h4>{{{title}}}</h4>
</div>


<!-- Customer Information
============================================ -->
<div class="customer-information">
  <h4 style="background: #eee; display: block">Customer Information</h4>
  <dl class="dl-horizontal">
    <dt>Receipt:</dt>
    <dd>{{receipt}}</dd>

    <dt>Date:</dt>
    <dd>{{prettyDate}}</dd>

    <dt>First Name:</dt>
    <dd>{{customer.given}}</dd>

    <dt>Last Name:</dt>
    <dd>{{customer.family}}</dd>
  </dl>
</div>

<hr>

<!-- Order Information
============================================ -->
<div class="customer-information">
  <h4 style="background: #eee; display: block">Order Information</h4>
  <dl class="dl-horizontal">
    <dt>Items:</dt>
    {{#each items}}
    <dd>
      <strong class="muted" style="border-bottom: 1px solid #ddd; display: block">Item #{{@index}}</strong>
      <dl class="dl-horizontal">
        <dt>Part No: </dt>
        <dd> {{part_no}} </dd>
        <dt>Description: </dt>
        <dd> {{descrip}} </dd>
        <dt>Price: </dt>
        <dd> ${{price}} </dd>
        <dt>Qty: </dt>
        <dd> {{quantity}} </dd>
      </dl>
    </dd>
    {{/each}}
  </dl>
</div>
<hr>

<!-- Bill To
============================================ -->
<div class="bill-to">
  <h4 style="background: #eee; display: block">Address Information</h4>
  <strong>Bill To:</strong>
  <dl class="dl-horizontal">
    <dt>Billing Street: </dt>
    <dd> {{bill-to.street}} </dd>
    <dt>Billing City: </dt>
    <dd> {{bill-to.city}} </dd>
    <dt>Billing State: </dt>
    <dd> {{bill-to.state}} </dd>
  </dl>
  <strong>Ship To:</strong>
  <dl class="dl-horizontal">
    <dt>Shipping Street: </dt>
    <dd> {{ship-to.street}} </dd>
    <dt>Shipping City: </dt>
    <dd> {{ship-to.city}} </dd>
    <dt>Shipping State: </dt>
    <dd> {{ship-to.state}} </dd>
    </dd>
  </dl>
</div>

<!-- Special Instructions
============================================ -->
<div class="special-instructions" style="margin-bottom: 120px;">
  <h4 style="background: #eee; display: block">Delivery Instructions</h4>
  <p>{{{specialDelivery}}}</p>
</div>