Update table hover colours

packages/bbui/src/Table/Table.svelte

@@ -558,10 +558,7 @@
     display: contents;
   }
   .spectrum-Table-row:hover .spectrum-Table-cell {
-    /*background-color: var(--hover-bg) !important;*/
-  }
-  .spectrum-Table-row:hover .spectrum-Table-cell:after {
-    background-color: var(--spectrum-alias-highlight-hover);
+    background-color: var(--spectrum-global-color-gray-100);
   }
   .wrapper--quiet .spectrum-Table-row {
     border-left: none;
@@ -594,24 +591,13 @@
     border-bottom: 1px solid var(--spectrum-alias-border-color-mid);
     background-color: var(--table-bg);
     z-index: auto;
+    transition: background-color 130ms ease-out;
   }
   .spectrum-Table-cell--edit {
     position: sticky;
     left: 0;
     z-index: 2;
   }
-  .spectrum-Table-cell:after {
-    content: "";
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    background-color: transparent;
-    top: 0;
-    left: 0;
-    pointer-events: none;
-    transition: background-color
-      var(--spectrum-global-animation-duration-100, 0.13s) ease-in-out;
-  }
 
   /* Placeholder  */
   .placeholder {

packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte

@@ -166,36 +166,38 @@
   </Layout>
   <Divider />
   <Layout noPadding gap="L">
-    <Layout noPadding gap="S">
-      <div class="title">
-        <Heading size="S">Users</Heading>
-        <Button secondary on:click={assignmentModal.show}>Assign user</Button>
-      </div>
-      <Table
-        customPlaceholder
-        data={appUsers}
-        schema={userSchema}
-        allowEditRows={false}
-        {customRenderers}
-      >
-        <div class="placeholder" slot="placeholder">
-          <Heading size="S">You have no users assigned yet</Heading>
+    {#if $usersFetch.loaded}
+      <Layout noPadding gap="S">
+        <div class="title">
+          <Heading size="S">Users</Heading>
+          <Button secondary on:click={assignmentModal.show}>Assign user</Button>
         </div>
-      </Table>
-      {#if $usersFetch.hasPrevPage || $usersFetch.hasNextPage}
-        <div class="pagination">
-          <Pagination
-            page={$usersFetch.pageNumber + 1}
-            hasPrevPage={$usersFetch.hasPrevPage}
-            hasNextPage={$usersFetch.hasNextPage}
-            goToPrevPage={$usersFetch.loading ? null : usersFetch.prevPage}
-            goToNextPage={$usersFetch.loading ? null : usersFetch.nextPage}
-          />
-        </div>
-      {/if}
-    </Layout>
+        <Table
+          customPlaceholder
+          data={appUsers}
+          schema={userSchema}
+          allowEditRows={false}
+          {customRenderers}
+        >
+          <div class="placeholder" slot="placeholder">
+            <Heading size="S">You have no users assigned yet</Heading>
+          </div>
+        </Table>
+        {#if $usersFetch.hasPrevPage || $usersFetch.hasNextPage}
+          <div class="pagination">
+            <Pagination
+              page={$usersFetch.pageNumber + 1}
+              hasPrevPage={$usersFetch.hasPrevPage}
+              hasNextPage={$usersFetch.hasNextPage}
+              goToPrevPage={$usersFetch.loading ? null : usersFetch.prevPage}
+              goToNextPage={$usersFetch.loading ? null : usersFetch.nextPage}
+            />
+          </div>
+        {/if}
+      </Layout>
+    {/if}
 
-    {#if $licensing.groupsEnabled && appGroups.length}
+    {#if $usersFetch.loaded && $licensing.groupsEnabled && appGroups.length}
       <Layout noPadding gap="S">
         <div class="title">
           <Heading size="S">Groups</Heading>