Feature/restore background color of Floating Action Buttons (FAB) to primary color (#5322)

* Restore background color of Floating Action Buttons (FAB) to primary color

apps/client/src/styles.scss

@@ -251,13 +251,6 @@ body {
       }
     }
 
-    .mat-mdc-fab {
-      &.mat-primary {
-        --mat-fab-icon-color: rgba(var(--dark-primary-text));
-        --mat-mdc-fab-color: rgba(var(--dark-primary-text));
-      }
-    }
-
     .mat-mdc-paginator {
       background-color: rgba(var(--palette-foreground-base-dark), 0.02);
     }
@@ -432,15 +425,6 @@ ngx-skeleton-loader {
   }
 }
 
-.mat-mdc-fab {
-  color: var(--mat-mdc-fab-color, inherit) !important;
-
-  &.mat-primary {
-    --mat-fab-icon-color: rgba(var(--light-primary-text));
-    --mat-mdc-fab-color: rgba(var(--light-primary-text));
-  }
-}
-
 .mat-mdc-form-field {
   &.without-hint {
     .mat-mdc-form-field-subscript-wrapper {

apps/client/src/styles/theme.scss

@@ -165,7 +165,11 @@ $_tertiary: map.merge(map.get($_palettes, tertiary), $_rest);
       title-text-line-height: 1.2
     )
   );
-
+  @include mat.fab-overrides(
+    (
+      container-color: var(--gf-theme-primary-500)
+    )
+  );
   @include mat.table-overrides(
     (
       row-item-outline-color: rgba(var(--dark-dividers))
@@ -199,7 +203,11 @@ $_tertiary: map.merge(map.get($_palettes, tertiary), $_rest);
       title-text-line-height: 1.2
     )
   );
-
+  @include mat.fab-overrides(
+    (
+      container-color: var(--gf-theme-primary-500)
+    )
+  );
   @include mat.table-overrides(
     (
       row-item-outline-color: rgba(var(--light-dividers))