Update layouts in nav tree to new full width style

packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/LayoutDropdownMenu.svelte

@@ -65,3 +65,10 @@
     <Input thin type="text" label="Name" bind:value={name} />
   </ModalContent>
 </Modal>
+
+<style>
+  .icon {
+    display: grid;
+    place-items: center;
+  }
+</style>

packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte

@@ -148,15 +148,21 @@
         </BBUILayout>
         <div class="nav-items-container" bind:this={scrollRef}>
           <ComponentNavigationTree />
-          <div class="overlay" />
         </div>
       </div>
     </Tab>
     <Tab title="Layouts">
       <div class="tab-content-padding">
-        {#each $store.layouts as layout, idx (layout._id)}
+        <div
-          <Layout {layout} border={idx > 0} />
+          class="nav-items-container nav-items-container--layouts"
-        {/each}
+          bind:this={scrollRef}
+        >
+          <div class="layouts-container">
+            {#each $store.layouts as layout, idx (layout._id)}
+              <Layout {layout} border={idx > 0} />
+            {/each}
+          </div>
+        </div>
         <Modal bind:this={newLayoutModal}>
           <NewLayoutModal />
         </Modal>
@@ -212,4 +218,12 @@
     height: 0;
     position: relative;
   }
+  .nav-items-container--layouts {
+    border-top: none;
+    margin-top: calc(-1 * var(--spectrum-global-dimension-static-size-150));
+  }
+
+  .layouts-container {
+    min-width: max-content;
+  }
 </style>