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

This commit is contained in:
Pieter Vander Vennet 2023-10-09 02:07:25 +02:00
parent 5be24dbef1
commit d43f8c0080
3 changed files with 5 additions and 7 deletions

View file

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

View file

@ -11,8 +11,9 @@
<div <div
class="absolute top-0 right-0 h-screen w-screen p-4 md:p-6" class="absolute top-0 right-0 h-screen w-screen p-4 md:p-6"
style="background-color: #00000088" 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"> <div class="h-full rounded-xl">
<slot /> <slot />
</div> </div>

View file

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