Refactor fab container

apps/client/src/app/components/admin-market-data/admin-market-data.scss

@@ -2,11 +2,4 @@
 
 :host {
   display: block;
-
-  .fab-container {
-    bottom: 2rem;
-    position: fixed;
-    right: 2rem;
-    z-index: 999;
-  }
 }

apps/client/src/app/components/user-account-access/user-account-access.scss

@@ -5,13 +5,6 @@
   gf-access-table {
     overflow-x: auto;
   }
-
-  .fab-container {
-    bottom: 2rem;
-    position: fixed;
-    right: 2rem;
-    z-index: 999;
-  }
 }
 
 :host-context(.is-dark-theme) {

apps/client/src/app/pages/accounts/accounts-page.scss

@@ -4,11 +4,4 @@
   .accounts {
     overflow-x: auto;
   }
-
-  .fab-container {
-    position: fixed;
-    right: 2rem;
-    bottom: 2rem;
-    z-index: 999;
-  }
 }

apps/client/src/app/pages/portfolio/activities/activities-page.scss

@@ -1,10 +1,3 @@
 :host {
   display: block;
-
-  .fab-container {
-    position: fixed;
-    right: 2rem;
-    bottom: 2rem;
-    z-index: 999;
-  }
 }

apps/client/src/styles.scss

@@ -491,6 +491,13 @@ ngx-skeleton-loader {
   flex-direction: column;
   overflow-y: auto;
 
+  .fab-container {
+    bottom: 2rem;
+    position: fixed;
+    right: 2rem;
+    z-index: 999;
+  }
+
   &:not(.has-tabs) {
     @media (min-width: 576px) {
       padding: 2rem 0;
@@ -502,6 +509,10 @@ ngx-skeleton-loader {
     padding-bottom: env(safe-area-inset-bottom);
     padding-bottom: constant(safe-area-inset-bottom);
 
+    .fab-container {
+      bottom: 5rem;
+    }
+
     .mat-mdc-tab-nav-bar {
       --mat-tab-header-active-focus-indicator-color: transparent;
       --mat-tab-header-active-hover-indicator-color: transparent;