fix: make items in toolbars and navigation use the align-items: flex-…

…start strategy and tooltips in the same containers relate to the items (#1984)
origo-map · Apr 9, 2024 · 8930b3c · 8930b3c
1 parent de2d006
commit 8930b3c
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/scss/_viewer.scss b/scss/_viewer.scss
@@ -17,6 +17,14 @@
   margin-top: .5rem;
 }
 
+.o-navigation button {
+  position: relative;
+}
+
+.o-maptools button {
+  position: relative;
+}
+
 .o-footer {
   background-color: $black;
   background-color: rgba(0, 0, 0, 0.8);

diff --git a/src/components/main.js b/src/components/main.js
@@ -6,8 +6,8 @@ export default function Main(options = {}) {
   } = options;
 
   const cls = `${clsSettings} o-main transparent relative flex column grow transparent height-full no-margin`.trim();
-  const navigation = El({ cls: 'o-navigation flex column relative transparent spacing-vertical-small' });
-  const mapTools = El({ cls: 'o-maptools flex column relative transparent spacing-vertical-small' });
+  const navigation = El({ cls: 'o-navigation flex column relative transparent spacing-vertical-small align-start' });
+  const mapTools = El({ cls: 'o-maptools flex column relative transparent spacing-vertical-small align-start' });
   const miscTools = El({ cls: 'o-misc flex column relative transparent spacing-vertical-small' });
   const bottomTools = El({ cls: 'o-tools-bottom absolute transparent bottom-left width-full no-margin' });