Feature: close floatover if pressed outside of it, fix #1647

src/Logic/Web/ThemeViewStateHashActor.ts

@@ -175,7 +175,6 @@ export default class ThemeViewStateHashActor {
     }
 
     private back() {
-        console.trace("Got a back event")
         const state = this._state
         // history.pushState(null, null, window.location.pathname);
         if (state.selectedElement.data) {

src/UI/Base/FloatOver.svelte

@@ -11,8 +11,9 @@
 <div
   class="absolute top-0 right-0 h-screen w-screen p-4 md:p-6"
   style="background-color: #00000088"
+  on:click={() => {dispatch("close")}}
 >
-  <div class="content normal-background">
+  <div class="content normal-background" on:click|stopPropagation={() => {}}>
     <div class="h-full rounded-xl">
       <slot />
     </div>

src/UI/ThemeViewGUI.svelte

@@ -267,7 +267,7 @@
 
 <If condition={state.guistate.themeIsOpened}>
   <!-- Theme menu -->
-  <FloatOver>
+  <FloatOver   on:close={() => state.guistate.themeIsOpened.setData(false)}>
     <span slot="close-button"><!-- Disable the close button --></span>
     <TabbedGroup tab={state.guistate.themeViewTabIndex}>
       <div slot="post-tablist">
@@ -339,7 +339,7 @@
 
 <IfHidden condition={state.guistate.backgroundLayerSelectionIsOpened}>
   <!-- background layer selector -->
-  <FloatOver on:close={() => state.guistate.backgroundLayerSelectionIsOpened.setData(false)}>
+  <FloatOver on:close={() => {state.guistate.backgroundLayerSelectionIsOpened.setData(false)}}>
     <div class="h-full p-2">
       <RasterLayerOverview
         {availableLayers}
@@ -354,9 +354,7 @@
 
 <If condition={state.guistate.menuIsOpened}>
   <!-- Menu page -->
-  <FloatOver on:close={() => {
-      selectedElement.setData(undefined)
-    }}>
+  <FloatOver on:close={() =>      state.guistate.menuIsOpened.setData(false)    }>
     <span slot="close-button"><!-- Hide the default close button --></span>
     <TabbedGroup tab={state.guistate.menuViewTabIndex}>
       <div slot="post-tablist">