🐛 Fix avoid empty space at the bottom when there are many layers

frontend/src/app/main/ui/ds/layout/tab_switcher.scss

@@ -114,6 +114,7 @@
   display: grid;
   width: 100%;
   height: 100%;
+  min-block-size: 0;
   outline: $b-1 solid var(--tab-panel-outline-color);
 }
 

frontend/src/app/main/ui/workspace/sidebar.cljs

@@ -97,9 +97,7 @@
         sitemap-height
         (if sitemap-collapsed? 32 height)]
 
-    [:article {:class (stl/css :layers-tab)
-               :style {:--height (dm/str height "px")}}
-
+    [:article {:class (stl/css :layers-tab)}
      [:> sitemap* {:layout layout
                    :height sitemap-height
                    :collapsed sitemap-collapsed?

frontend/src/app/main/ui/workspace/sidebar.scss

@@ -79,13 +79,15 @@
 
 .layers-tab {
   padding-block-start: var(--sp-xs);
-  overflow-x: hidden;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  min-block-size: 0;
 }
 
 .layers-tab-resize-area {
   background-color: var(--color-background-primary);
-  position: absolute;
-  inset-inline-start: 0;
+  flex: 0 0 auto;
   inline-size: 100%;
   padding: px2rem(3) 0 px2rem(1);
   block-size: $sz-6;
@@ -120,11 +122,16 @@
 .left-sidebar-content {
   grid-area: content;
   inset-inline-end: calc(-1 * var(--sp-s));
+  min-block-size: 0;
+  overflow: hidden;
 }
 
 .left-sidebar-tabs {
   --tabs-nav-padding-inline-start: var(--sp-m);
   --tabs-nav-padding-inline-end: var(--sp-m);
+
+  block-size: 100%;
+  min-block-size: 0;
 }
 
 .left-sidebar-resize-area {

frontend/src/app/main/ui/workspace/sidebar/layers.scss

@@ -31,11 +31,10 @@
 }
 
 .tool-window-content {
-  --calculated-height: calc(#{px2rem(136)} + var(--height, #{$sz-200}));
-
   display: flex;
   flex-direction: column;
-  block-size: calc(100vh - var(--calculated-height));
+  flex: 1 1 auto;
+  min-block-size: 0;
   inline-size: calc(var(--left-sidebar-width) + var(--depth) * var(--layer-indentation-size));
   overflow: auto;
   scrollbar-gutter: stable;
@@ -117,6 +116,10 @@
 
 .layers {
   position: relative;
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-block-size: 0;
 }
 
 .replace-wrapper {

frontend/src/app/main/ui/workspace/sidebar/sitemap.scss

@@ -15,7 +15,8 @@
   position: relative;
   display: flex;
   flex-direction: column;
-  flex: 1;
+  flex: 0 0 auto;
+  flex-shrink: 0;
   inline-size: 100%;
   block-size: var(--height, $sz-200);
 }