Translate: Receipt

Language selection view

by Eugene Trounev

HTML

<link rel="stylesheet" href="https://appcdn2.docsie.io/js/onboarding/current/css/main.css">
<div class="container">
  <div class="my-5 mb-4 text-left">
    <h2>
      Order accepted {order number}
    </h2>
  </div>
  <div class="row">
    <div class="col-md-6 order-md-2">
      <h4 class="d-flex justify-content-between align-items-center mb-4">
        <span class="text-muted">Your Order</span>
      </h4>
      <ul class="list-group mb-4">
        <li class="list-group-item d-flex justify-content-between lh-condensed">
          <div>
            <h6 class="my-0">Translation service</h6>
            <small class="text-muted">Total of all jobs</small>
          </div>
          <span class="text-muted">$120</span>
        </li>
        <li class="list-group-item d-flex justify-content-between lh-condensed">
          <div>
            <h6 class="my-0">Editing</h6>
          </div>
          <span class="text-muted">$8</span>
        </li>
        <li class="list-group-item d-flex justify-content-between lh-condensed">
          <div>
            <h6 class="my-0">Proofreading</h6>
          </div>
          <span class="text-muted">$5</span>
        </li>
        <li class="list-group-item d-flex justify-content-between">
          <span>Total (USD)</span>
          <strong>$210</strong>
        </li>
      </ul>
    </div>
    <div class="col-md-6 order-md-1">
      <h4 class="mb-3">
        <span class="text-muted">Billing information</span>
      </h4>
      <div class="form-group mb-2">
        <label class="control-label">Ordering organization</label>
        <input class="form-control" value="Big Organization" disabled>
      </div>
      <div class="form-group mb-3">
        <label class="control-label">Order placed by</label>
        <input class="form-control" value="Jane Doe" disabled>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-12">
      ... stripe receipt iframe...
    </div>
  </div>
</div>