Shopify packing slip template for Order Printer.

<style>
  @page {
    size: 4in 6in;
    margin: 0.12in;
  }

  body {
    margin: 0;
    font-family: Arial, sans-serif;
    font-size: 11px;
    line-height: 1.3;
    color: #111;
  }

  .opk-slip {
    width: 100%;
  }

  .opk-header,
  .opk-ship-to,
  .opk-items {
    border-bottom: 1px solid #111;
    padding-bottom: 8px;
    margin-bottom: 8px;
  }

  .opk-header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
  }

  .opk-order-name {
    font-size: 18px;
    font-weight: 700;
  }

  .opk-barcode {
    max-width: 1.5in;
    text-align: right;
  }

  .opk-items table {
    width: 100%;
    border-collapse: collapse;
  }

  .opk-items th,
  .opk-items td {
    padding: 4px 0;
    text-align: left;
    vertical-align: top;
  }

  .opk-qty {
    width: 28px;
    font-weight: 700;
  }

  .opk-item-title {
    overflow-wrap: anywhere;
  }

  .opk-sku {
    width: 82px;
    font-size: 10px;
  }

  .opk-muted {
    color: #555;
  }
</style>

<div class="opk-slip">
  <div class="opk-header">
    <div>
      <div class="opk-order-name">{{ order.name }}</div>
      <div>{{ order.created_at | date: "%b %d, %Y" }}</div>
    </div>
    <div class="opk-barcode">
      <s-barcode value="{{ order.name }}" />
    </div>
  </div>

  <div class="opk-ship-to">
    <strong>Ship to</strong><br>
    {{ shipping_address.name }}<br>
    {{ shipping_address.address1 }}{% if shipping_address.address2 != blank %}, {{ shipping_address.address2 }}{% endif %}<br>
    {{ shipping_address.city }}, {{ shipping_address.province_code }} {{ shipping_address.zip }}<br>
    {{ shipping_address.country }}
  </div>

  <div class="opk-items">
    <table>
      <thead>
        <tr>
          <th class="opk-qty">Qty</th>
          <th>Item</th>
          <th>SKU</th>
        </tr>
      </thead>
      <tbody>
        {% for line_item in line_items %}
          <tr>
            <td class="opk-qty">{{ line_item.quantity }}</td>
            <td class="opk-item-title">{{ line_item.title }}</td>
            <td class="opk-sku">{{ line_item.sku | default: "No SKU" }}</td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

  {% if note != blank %}
    <div class="opk-note">
      <strong>Order note</strong><br>
      {{ note }}
    </div>
  {% endif %}
</div>