Style: Allow a layer to open the popup-view in a floatover

Models/ThemeConfig/Json/LayerConfigJson.ts

@@ -399,4 +399,9 @@ export interface LayerConfigJson {
      * no-question-hint-check: disables a check in MiscTagRenderingChecks which complains about 'div', 'span' or 'class=subtle'-HTML elements in the tagRendering
      */
     "#"?: string | "no-question-hint-check"
+
+    /**
+     * If set, open the selectedElementView in a floatOver instead of on the right
+     */
+    popupInFloatover?: boolean
 }

Models/ThemeConfig/LayerConfig.ts

@@ -69,6 +69,7 @@ export default class LayerConfig extends WithContextLoader {
     public readonly syncSelection: typeof LayerConfig.syncSelectionAllowed[number] // this is a trick to conver a constant array of strings into a type union of these values
 
     public readonly _needsFullNodeDatabase = false
+    public readonly popupInFloatover
 
     constructor(json: LayerConfigJson, context?: string, official: boolean = true) {
         context = context + "." + json.id
@@ -414,6 +415,8 @@ export default class LayerConfig extends WithContextLoader {
                 ": showIf. Did you mean 'isShown' instead?"
             )
         }
+        this.popupInFloatover = json.popupInFloatover ?? false
+
     }
 
     public defaultIcon(): BaseUIElement | undefined {

UI/ThemeViewGUI.svelte

@@ -121,12 +121,18 @@
   </If>
 </div>
 
-<If condition={selectedViewElement.map(v => v !== undefined && selectedLayer.data !== undefined,[ selectedLayer] )}>
+<If condition={selectedViewElement.map(v => v !== undefined && selectedLayer.data !== undefined && !selectedLayer.data.popupInFloatover,[ selectedLayer] )}>
   <ModalRight on:close={() => {selectedElement.setData(undefined)}}>
     <ToSvelte construct={new VariableUiElement(selectedViewElement)}></ToSvelte>
   </ModalRight>
 </If>
 
+<If condition={selectedViewElement.map(v => v !== undefined && selectedLayer.data !== undefined && selectedLayer.data.popupInFloatover,[ selectedLayer] )}>
+  <FloatOver on:close={() => {selectedElement.setData(undefined)}}>
+    <ToSvelte construct={new VariableUiElement(selectedViewElement)}></ToSvelte>
+  </FloatOver>
+</If>
+
 <If condition={state.guistate.themeIsOpened}>
   <!-- Theme page -->
   <FloatOver on:close={() => state.guistate.themeIsOpened.setData(false)}>

assets/layers/last_click/last_click.json

@@ -10,6 +10,7 @@
   },
   "name": null,
   "titleIcons": [],
+  "popupInFloatover": true,
   "title": {
     "mappings": [
       {