<div [class]=" direction == 'rtl' ?  ' wrapper wrapper_left' : 'wrapper  wrapper_right '">
  <div class="circle pulse"></div>
  <div class="circle">
      <ion-fab class="fab-i ">

          <ion-fab-button [ngClass]="type === 'add' ? 'addnon' : 'cbookApointmentBtn' " (click)="onClick()"  >
              <!-- <img style="width: 39%; margin-top: -29%;" src="assets/icon/booking.png" /> -->
             <div *ngIf="type != 'add' "> 
                 <ion-icon class="iconFab" name="finger-print"></ion-icon>
              <p class="fab-p">{{ 'attendance-tracking,title' | translate }} </p>
            </div>
            <div *ngIf="type === 'add' ">
                    <ion-icon   style="margin-top:0px" class="iconFab" name="add"></ion-icon>
                    <!-- <ion-icon name="add-outline"></ion-icon> -->
            </div>
          </ion-fab-button>

      </ion-fab>
  </div>
</div>