Merge remote-tracking branch 'origin/feature/draggable' into main

app/src/components/ModesCardorg.vue

@@ -7,6 +7,7 @@
       :x="50"
       :y="15"
       :z="1"
+      :scale="scale"
       :draggable="true"
       :resizable="true"
       style="background-color: #6fcf97"
@@ -138,6 +139,7 @@ export default {
 
   computed: mapState({
     hidetipsstate: (state) => state.hidetipsstate,
+    scale: (state) => state.ui.scale,
   }),
 
   methods: {

app/src/components/OnBoard.vue

@@ -8,6 +8,7 @@
         :x="5"
         :y="15"
         :z="1"
+        :scale="scale"
         :draggable="true"
         :resizable="false"
         style="background-color: #6fcf97"
@@ -53,6 +54,7 @@
         :x="600"
         :y="15"
         :z="1"
+        :scale="scale"
         :draggable="true"
         :resizable="false"
         style="background-color: #6fcf97"
@@ -157,6 +159,7 @@
 import draggable from '@/experimental/Draggable'
 import Router from '@/router'
 import marked from 'marked'
+import { mapState } from 'vuex'
 
 export default {
   data: function () {
@@ -221,6 +224,9 @@ export default {
       this.$refs.microcosm.focus()
     },
   },
+  computed: mapState({
+        scale: (state) => state.ui.scale
+  }),
   components: {
     draggable,
   },

app/src/components/TipsLayer.vue

@@ -8,6 +8,7 @@
         :x="540"
         :y="15"
         :z="1"
+        :scale="scale"
         :draggable="true"
         :resizable="false"
         style="background-color: #6fcf97"
@@ -31,6 +32,7 @@
 <script>
 import marked from 'marked'
 import draggable from '@/experimental/Draggable'
+import { mapState } from 'vuex'
 export default {
   data: function () {
     return {
@@ -39,8 +41,9 @@ export default {
       tipsplease: true,
     }
   },
-
-  mounted() {},
+  computed: mapState({
+    scale: (state) => state.ui.scale,
+  }),
   filters: {
     marked: marked,
   },