Chore: Removed @angular/flex-layout and replaced it with tailwind.

Chore: Upgraded some packages

overlord/src/app/incentive/incentive.component.html

@@ -3,9 +3,9 @@
     <mat-card-title>Incentives</mat-card-title>
   </mat-card-title-group>
   <mat-card-content>
-    <form [formGroup]="form" fxLayout="column">
-      <div fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutGap.lt-md="0px">
-        <mat-form-field fxFlex>
+    <form [formGroup]="form" class="flex flex-col">
+      <div class="flex flex-row justify-around content-start items-start">
+        <mat-form-field class="flex-auto">
           <input
             matInput
             [matDatepicker]="date"
@@ -18,7 +18,7 @@
           <mat-datepicker #date></mat-datepicker>
         </mat-form-field>
       </div>
-      <div fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutGap.lt-md="0px">
+      <div class="flex flex-row justify-around content-start items-start">
         Total Incentive: <strong>{{ voucher.incentive | number: '1.2-2' }}</strong> Total Points:
         <strong>{{ totalPoints() | number: '1.2-2' }}</strong> Point Value:
         <strong>{{ pointValue() | number: '1.2-2' }}</strong>
@@ -54,7 +54,7 @@
         <ng-container matColumnDef="points">
           <mat-header-cell *matHeaderCellDef class="center">Service Points</mat-header-cell>
           <mat-cell *matCellDef="let row; let i = index" class="center" [formGroupName]="i">
-            <mat-form-field fxFlex="80%">
+            <mat-form-field class="flex-auto max-w-[80%]">
               <button
                 mat-stroked-button
                 mat-icon-button
@@ -69,7 +69,7 @@
                 formControlName="points"
                 autocomplete="off"
                 (change)="change(row, i)"
-                fxFlex="80%"
+                class="flex-auto max-w-[80%]"
               />
               <button
                 mat-stroked-button