Sticky header

origo-map · Nov 24, 2023 · 9d8d1fa · 9d8d1fa
1 parent cc45e70
commit 9d8d1fa
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 4 deletions.
diff --git a/scss/ui/_slidenav.scss b/scss/ui/_slidenav.scss
@@ -2,15 +2,13 @@
   box-sizing: border-box;
   display: inline-block;
   line-height: 0;
-  overflow: hidden;
   position: relative;
   transition: height 0.3s;
 
   >.main {
     box-sizing: border-box;
     display: inline-block;
     left: 0;
-    overflow: hidden;
     position: relative;
     top: 0;
     transition: all 0.3s;
@@ -70,5 +68,7 @@
       opacity: 1;
       transform: none;
     }
+
+    overflow: hidden
   }  
 }
diff --git a/scss/ui/helpers/_helpers.scss b/scss/ui/helpers/_helpers.scss
@@ -64,6 +64,10 @@
   overflow-y: auto;
 }
 
+.overflow-unset {
+  overflow: unset;
+}
+
 // position
 .absolute {
   position: absolute;

diff --git a/src/controls/legend/group.js b/src/controls/legend/group.js
@@ -112,7 +112,8 @@ const Group = function Group(viewer, options = {}) {
 
   const GroupHeader = function GroupHeader() {
     const headerComponent = CollapseHeader({
-      cls: 'hover padding-x padding-y-small grey-lightest border-bottom text-small',
+      cls: 'hover padding-x padding-y-small grey-lightest border-bottom text-small sticky bg-white z-index-low',
+      style: 'top: 0;',
       icon,
       title
     });

diff --git a/src/ui/slidenav.js b/src/ui/slidenav.js
@@ -132,7 +132,7 @@ export default function Slidenav(options = {}) {
     getState,
     onInit() {
       mainContainer = Element({
-        cls: 'main'
+        cls: 'main overflow-unset'
       });
       backButton = Button({
         cls: 'icon-small padding-small',