<div class="container mt-5">
  <div class="row">
    <div class="col-12">
      <table class="table table-cover" style="cursor: pointer;">
        <thead class="thead-light">
          <tr>
            <th>Order</th>
            <th>Total</th>
            <th>Date</th>
            <th>Status</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let order of orders" routerLink="/orders/{{order.id}}">
            <th># {{order.id}}</th>
            <td>{{order.orderDate | date: 'medium'}}</td>
            <td>{{order.total | currency}}</td>
            <td>{{order.status}}</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</div>
