<div class="container-fluid" *ngIf="customer">
    <div class="row justify-content-center">
      <div class="col-8 offset-2 ">
        <div class="card shadow">
          <div class="card-body">
            <div class="col-6 col-sm-12 text-center mb-4">
                <img src="/assets/images/users/4.jpg" class="navbar-brand-img brand-sm mx-auto mb-4" alt="...">
                
                <h3 class="mb-0 text-uppercase">{{customer.customerName}}</h3>
                 <p> <small>{{customer.email}}</small></p>                  
              </div>
         
            </div>
            <hr>
            <div class="row  ml-4">
                <p><strong>العنوان</strong></p>
                <p>المدينة {{customer.address.city}}</p>
                <p>الشارع {{customer.address.streetName}} {{customer.address.streetNumber}}</p>
                
                
            </div>
            <div class="row mb-4">

                <button class="col-4 offset-1 m-4 btn btn-danger" (click)="onDelete(customer.id)">إزالة</button>
                <button class="col-4 m-4 btn btn-info" (click)="addContact(customer.id)">إضافة معلومة اتصال</button>
            
            </div>
            
          </div> <!-- /.card-body -->
        </div> <!-- /.card -->
      </div> <!-- /.col-12 -->
</div> <!-- .row -->
  