Removed all mr-5, mb-5 and basis tailwind classes.

Will soon remove tailwind totally.

bookie/src/app/product/product-detail/product-detail.component.html

@@ -4,18 +4,18 @@
   </mat-card-header>
   <mat-card-content>
     <form [formGroup]="form" class="flex flex-col">
-      <div class="flex flex-row justify-around content-start items-start">
-        <mat-form-field class="flex-auto basis-3/4 mr-5">
+      <div class="row-container">
+        <mat-form-field class="flex-auto basis-3-4">
           <mat-label>Name</mat-label>
           <input matInput #name formControlName="name" />
         </mat-form-field>
-        <mat-form-field class="flex-auto basis-1/4">
+        <mat-form-field class="flex-auto basis-1-4">
           <mat-label>Units</mat-label>
           <input matInput formControlName="units" />
         </mat-form-field>
       </div>
-      <div class="flex flex-row justify-around content-start items-start">
-        <mat-form-field class="flex-auto mr-5">
+      <div class="row-container">
+        <mat-form-field class="flex-auto">
           <mat-label>Price</mat-label>
           <input matInput type="number" formControlName="price" />
         </mat-form-field>
@@ -24,12 +24,12 @@
           <input matInput type="number" formControlName="quantity" />
         </mat-form-field>
       </div>
-      <div class="flex flex-row justify-around content-start items-start">
+      <div class="row-container">
         <mat-checkbox formControlName="hasHappyHour">Has Happy Hour?</mat-checkbox>
         <mat-checkbox formControlName="isNotAvailable">Is Not Available?</mat-checkbox>
       </div>
-      <div class="flex flex-row justify-around content-start items-start">
-        <mat-form-field class="flex-auto mr-5">
+      <div class="row-container">
+        <mat-form-field class="flex-auto">
           <mat-label>Menu Category</mat-label>
           <mat-select formControlName="menuCategory">
             @for (mc of menuCategories; track mc) {
@@ -52,8 +52,8 @@
       </div>
     </form>
   </mat-card-content>
-  <mat-card-actions>
-    <button mat-raised-button color="primary" class="mr-5" (click)="save()">Save</button>
+  <mat-card-actions class="row-container">
+    <button mat-raised-button color="primary" class="" (click)="save()">Save</button>
     @if (!!item.id) {
       <button mat-raised-button color="warn" (click)="confirmDelete()">Delete</button>
     }