better more info modal

src/renderer/views/components/moreinfo-modal.ejs

@@ -0,0 +1,42 @@
+<script type="text/x-template" id="moreinfo-modal">
+    <div class="modal-fullscreen spatialproperties-panel moreinfo-modal" @click.self="if(timedelay) close()">
+        <div class="modal-window" >
+            <div class="modal-header">
+                <div class="modal-title">{{data.title}}</div>
+                <div class="modal-subtitle modal-title">{{data.subtitle ?? ""}}</div>
+                <button class="close-btn" @click="close()"></button>
+            </div>
+            <div class="modal-content">
+                <div class="content" v-html="data.content">
+                </div>
+            </div>    
+        </div>
+    </div>
+</script>
+
+<script>
+    Vue.component('moreinfo-modal', {
+        template: '#moreinfo-modal',
+        data: function () {
+            return {
+                app: this.$root,
+                timedelay: false,
+            }
+        },
+        props: ["data"],
+        mounted() {
+            let self = this;
+            this.$nextTick(()=>{
+                setTimeout(function(){
+                    self.timedelay = true
+                }, 1000);
+            })
+          
+        },
+        methods: {
+            close() {
+                app.modals.moreInfo = false;
+            },
+        }
+    });
+</script>