diff --git a/app/package.json b/app/package.json
index 3c523206f60e745711f2216c1367ba367b09b559..7673df313939b6a025a763981de2d6592e20c9fd 100644
--- a/app/package.json
+++ b/app/package.json
@@ -9,16 +9,13 @@
     "lint:fix": "vue-cli-service lint --fix"
   },
   "dependencies": {
-    "@panzoom/panzoom": "^4.3.2",
     "core-js": "^3.6.5",
     "file-loader": "^6.1.0",
     "ipfs": "^0.50.0",
-    "lodash": "^4.17.20",
     "marked": "^1.1.1",
     "pixi.js": "^5.3.3",
     "pouchdb": "^7.2.2",
     "vue": "^2.6.12",
-    "vue-context": "^6.0.0",
     "vue-draggable-resizable": "^2.2.0",
     "vue-emoji-picker": "^1.0.1",
     "vue-router": "^3.4.3",
diff --git a/app/src/components/DiscardLayer.vue b/app/src/components/DiscardLayer.vue
new file mode 100644
index 0000000000000000000000000000000000000000..05e59db7bceae799802f7426c3dac19dd4142843
--- /dev/null
+++ b/app/src/components/DiscardLayer.vue
@@ -0,0 +1,106 @@
+<template>
+  <div>
+    <div v-if="deleted == true">
+      <div class="nodes">
+        <p :inner-html.prop="nodetext | marked"></p>
+
+        <div class="allemoji">
+          <div
+            class="eachemoji"
+            v-for="(emojis, index) in configEmoji"
+            :key="index"
+          >
+            <p v-if="nodeid == emojis.node_id">
+              {{ emojis.emoji_text }}
+            </p>
+          </div>
+        </div>
+
+        <div class="btn-row">
+          <BaseButton buttonClass="danger" @click="restoreNode(nodeid)"
+            >Restore</BaseButton
+          >
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import marked from 'marked'
+export default {
+  name: 'ListLayer',
+
+  data: function () {
+    return {}
+  },
+
+  props: {
+    nodeid: String,
+    nodetext: String,
+    deleted: Boolean,
+  },
+
+  computed: mapState({
+    myNodes: (state) => state.myNodes,
+    configEmoji: (state) => state.configEmoji,
+  }),
+
+  filters: {
+    marked: marked,
+  },
+
+  methods: {
+    restoreNode(e) {
+      this.$store.dispatch('restoreNode', { e })
+    },
+  },
+}
+</script>
+
+<style lang="css" scoped>
+h2 {
+  color: red;
+}
+
+.nodes {
+  width: 95%;
+  border: 2px dashed black;
+  background-color: rgb(155, 194, 216);
+  margin-top: 1em;
+  margin-left: 1em;
+}
+
+p {
+  width: 90%;
+  /* height: 175px; */
+  resize: none;
+  box-sizing: border-box;
+  font-family: 'Inter var', Helvetica, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  margin: 1em;
+}
+.btn-row {
+  position: relative;
+  margin-bottom: 5px;
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  padding: 0 15px;
+  border-radius: 4px;
+}
+
+.allemoji {
+  font-size: 2em;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(0, auto));
+
+  /* float: left; */
+}
+
+.eachemoji p {
+  margin: 0em;
+}
+</style>
diff --git a/app/src/components/ListLayer.vue b/app/src/components/ListLayer.vue
index 0c3120bdf3b981d3ae5c3193c10850c8f33c4a9f..033eb3ce7ff269f2ea85e7ac7453f7f35e453630 100644
--- a/app/src/components/ListLayer.vue
+++ b/app/src/components/ListLayer.vue
@@ -1,35 +1,66 @@
 <template>
-  <div class="nodes">
-    <form>
-      <div v-if="readmode == false">
+  <div>
+    <div v-if="deleted == false">
+      <form class="nodes">
         <div v-for="value in $options.myArray" v-bind:key="value.node_id">
-          <div v-if="value.deleted == false">
-            <textarea
-              v-if="nodeid == value.node_id"
-              @focus="editTrue(true)"
-              @blur="editTrue(false)"
-              autofocus
-              v-model="value.node_text"
-              @input="editNode"
-              :id="value.node_id"
-              ref="nodetext"
-              placeholder="Idea goes here!"
-            ></textarea>
+          <textarea
+            v-if="nodeid == value.node_id"
+            @focus="editTrue(true)"
+            @blur="editTrue(false)"
+            autofocus
+            v-model="value.node_text"
+            @input="editNode"
+            :id="value.node_id"
+            ref="nodetext"
+            placeholder="Idea goes here!"
+          ></textarea>
+        </div>
+
+        <!-- <div v-if="localreadmode == true && deleted == false">
+          <p class="read" :id="nodeid" :inner-html.prop="nodetext | marked"></p>
+        </div> -->
+        <div class="allemoji">
+          <div
+            class="eachemoji"
+            v-for="(emojis, index) in configEmoji"
+            :key="index"
+          >
+            <p v-if="nodeid == emojis.node_id">
+              {{ emojis.emoji_text }}
+            </p>
+          </div>
+        </div>
+        <p class="info">*markdown supported &amp; autosaves</p>
+        <div class="btn-row">
+          <BaseButton buttonClass="danger" @click="deleteFlag()"
+            >Discard</BaseButton
+          >
+          <!-- <div v-if="localreadmode == true && deleted == false">
+            <BaseButton class="read" buttonClass="action" @click="readFlag()"
+              >Edit Mode
+            </BaseButton>
           </div>
+          <div v-else>
+            <BaseButton class="read" buttonClass="action" @click="readFlag()"
+              >Read Mode</BaseButton
+            >
+          </div> -->
         </div>
-      </div>
-    </form>
+      </form>
+    </div>
   </div>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-var readmode
+//var readmode
 export default {
   name: 'ListLayer',
 
   data: function () {
-    return {}
+    return {
+      // localreadmode: false,
+    }
   },
 
   props: {
@@ -41,7 +72,7 @@ export default {
   computed: mapState({
     myNodes: (state) => state.myNodes,
     configPositions: (state) => state.configPositions,
-    //  shortcutstate: (state) => state.shortcutstate,
+    configEmoji: (state) => state.configEmoji,
   }),
 
   myArray: null,
@@ -60,26 +91,31 @@ export default {
       this.$emit('editTrue', e)
     },
 
-    readFlag(e) {
+    deleteFlag(e) {
       e = this.nodeid
-
-      var i
-      for (i = 0; i < Object.keys(this.configPositions).length; i++) {
-        if (this.configPositions[i].node_id == this.nodeid) {
-          this.localreadmode = this.configPositions[i].read_mode
-        }
-      }
-
-      if (this.localreadmode == true) {
-        readmode = false
-        this.$store.dispatch('readFlag', { e, readmode })
-        this.mode = 'Read'
-      } else {
-        readmode = true
-        this.$store.dispatch('readFlag', { e, readmode })
-        this.mode = 'Edit'
-      }
+      this.$store.dispatch('deleteFlag', { e })
     },
+
+    // readFlag(e) {
+    //   e = this.nodeid
+
+    //   var i
+    //   for (i = 0; i < Object.keys(this.configPositions).length; i++) {
+    //     if (this.configPositions[i].node_id == this.nodeid) {
+    //       this.localreadmode = this.configPositions[i].read_mode
+    //     }
+    //   }
+
+    //   if (this.localreadmode == true) {
+    //     readmode = false
+    //     this.$store.dispatch('readFlag', { e, readmode })
+    //     this.mode = 'Read'
+    //   } else {
+    //     readmode = true
+    //     this.$store.dispatch('readFlag', { e, readmode })
+    //     this.mode = 'Edit'
+    //   }
+    // },
   },
 }
 </script>
@@ -111,4 +147,25 @@ textarea {
   background-color: rgb(187, 227, 255);
   scrollbar-color: yellow rgb(187, 227, 255);
 }
+.btn-row {
+  position: relative;
+  margin-bottom: 5px;
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  padding: 0 15px;
+  border-radius: 4px;
+}
+
+.allemoji {
+  font-size: 2em;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(0, auto));
+
+  /* float: left; */
+}
+
+.eachemoji p {
+  margin: 0em;
+}
 </style>
diff --git a/app/src/components/OnBoard.vue b/app/src/components/OnBoard.vue
index c78df8ad1d31ef8104e70840da729557f75fd91f..e7a4a373fe2f7c4624b83a212ef895e6fe85c2e8 100644
--- a/app/src/components/OnBoard.vue
+++ b/app/src/components/OnBoard.vue
@@ -44,7 +44,7 @@
         class="innernode"
         :w="310"
         :h="375"
-        :x="850"
+        :x="600"
         :y="15"
         :z="1"
         :draggable="true"
@@ -202,10 +202,6 @@ export default {
 </script>
 
 <style lang="css" scoped>
-.start {
-  opacity: 0;
-  filter: alpha(opacity=0);
-}
 .vdr {
   padding: 0 0.5em;
 }
diff --git a/app/src/components/OtherListlayer.vue b/app/src/components/OtherListlayer.vue
index c2c267ff8131a96e79f15bfd22b60d634b38673b..348f2af0d0410021eaae61a452c4bc821a3bc2a1 100644
--- a/app/src/components/OtherListlayer.vue
+++ b/app/src/components/OtherListlayer.vue
@@ -20,17 +20,17 @@ export default {
   name: 'OtherListlayer',
   props: {
     nodeid: String,
-    nodetext: String
+    nodetext: String,
   },
 
   computed: mapState({
-    otherNodes: state => state.otherNodes
+    otherNodes: (state) => state.otherNodes,
   }),
 
   filters: {
     // need to write a reverse data filter I suspect here so new data is at the top of list
-    marked: marked
-  }
+    marked: marked,
+  },
 }
 </script>
 
diff --git a/app/src/components/OtherNodeslayer.vue b/app/src/components/OtherNodeslayer.vue
index 584f84b288901af5a9492ae0dcd092856c13f977..ffcf6783fa026a4077e0b8be40962c94e9445292 100644
--- a/app/src/components/OtherNodeslayer.vue
+++ b/app/src/components/OtherNodeslayer.vue
@@ -4,7 +4,7 @@
       <div v-if="toolmode == 'move'">
         <!-- make draggable false as we are panning around -->
         <vue-draggable-resizable
-          v-if="nodeid == value.node_id"
+          v-if="nodeid == value.node_id && deleted == false"
           :w="value.width"
           :h="value.height"
           :x="value.x_pos"
@@ -109,7 +109,7 @@
 
       <div v-else>
         <vue-draggable-resizable
-          v-if="nodeid == value.node_id"
+          v-if="nodeid == value.node_id && deleted == false"
           :w="value.width"
           :h="value.height"
           :x="value.x_pos"
@@ -229,6 +229,7 @@ export default {
     nodetext: String,
     nodewidth: Number,
     nodeheight: Number,
+    deleted: Boolean,
   },
 
   data() {
diff --git a/app/src/components/TipsLayer.vue b/app/src/components/TipsLayer.vue
index dbc57ba803df002375b4d4fe00608272e1ae9c92..4e56d99c9fb666d461a0af70b1d6696ade8ed87a 100644
--- a/app/src/components/TipsLayer.vue
+++ b/app/src/components/TipsLayer.vue
@@ -54,10 +54,6 @@ export default {
 </script>
 
 <style lang="css" scoped>
-.start {
-  opacity: 0;
-  filter: alpha(opacity=0);
-}
 .vdr {
   padding: 0 0.5em;
 }
diff --git a/app/src/router/index.js b/app/src/router/index.js
index d368bee13fbfdc085c7607a83050d07d4efceb8c..fabc5fd3cb8601e50422199b89df05691ecf3602 100644
--- a/app/src/router/index.js
+++ b/app/src/router/index.js
@@ -3,6 +3,7 @@ import VueRouter from 'vue-router'
 import Home from '../views/Home.vue'
 import List from '../views/List.vue'
 import Discarded from '../views/Discarded.vue'
+import Leave from '../views/Leave.vue'
 // import Oldhome from '../views/Oldhome'
 //import Test from '../views/Test'
 
@@ -24,6 +25,11 @@ export const routes = [
     name: 'Discarded',
     component: Discarded,
   },
+  {
+    path: '/leave',
+    name: 'Leave',
+    component: Leave,
+  },
   {
     path: '/about',
     name: 'About',
diff --git a/app/src/views/Discarded-old.vue b/app/src/views/Discarded-old.vue
new file mode 100644
index 0000000000000000000000000000000000000000..901dfabf9aced6fe7847536cce55a39b0f1fb2cd
--- /dev/null
+++ b/app/src/views/Discarded-old.vue
@@ -0,0 +1,202 @@
+<template>
+  <div id="discardwrapper">
+    <h1 class="restore">Your discarded nodes</h1>
+
+    <div v-if="clientset">
+      <form>
+        <div v-for="value in myNodes" v-bind:key="value.node_id">
+          <div v-if="value.deleted == true">
+            {{ value.node_text }}
+
+            <div class="btn-row">
+              <BaseButton
+                class="new"
+                buttonClass="action"
+                @click="restoreNode(value.node_id)"
+                >Restore</BaseButton
+              >
+            </div>
+          </div>
+        </div>
+      </form>
+    </div>
+    <!-- // onboarding for list view -->
+    <div v-else>
+      <form>
+        <div>
+          <p id="nodeid" :inner-html.prop="nodetext1 | marked"></p>
+
+          <div v-if="name == false">
+            <input
+              type="text"
+              v-model.trim="clientid"
+              placeholder="device name"
+              autocorrect="off"
+              autocapitalize="none"
+              ref="objectname"
+              v-on:keyup.enter="setClient()"
+              @focus="editTrue(true)"
+              @blur="editTrue(false)"
+            />
+            <div class="btn-row">
+              <BaseButton buttonClass="special" @click="setClient()"
+                >Store</BaseButton
+              >
+            </div>
+          </div>
+          <div v-else>
+            <h4>Saved</h4>
+          </div>
+        </div>
+      </form>
+
+      <form>
+        <div>
+          <p id="nodeid" :inner-html.prop="nodetext2 | marked"></p>
+          <div v-if="microcosm == false">
+            <input
+              type="text"
+              v-model.trim="localmicrocosm"
+              placeholder="microcosm name"
+              autocorrect="off"
+              autocapitalize="none"
+              autofocus
+              v-on:keyup.enter="createMicrocosm()"
+              @focus="editTrue(true)"
+              @blur="editTrue(false)"
+            />
+            <div class="btn-row">
+              <BaseButton
+                buttonClass="special"
+                @click="createMicrocosm(), letsGo()"
+                >Create Microcosm</BaseButton
+              >
+            </div>
+          </div>
+          <div v-else>
+            <h4>Loading...</h4>
+          </div>
+        </div>
+      </form>
+    </div>
+  </div>
+  <!-- </div> -->
+</template>
+
+<script>
+// import OffLine from '@/components/OffLine'
+// import OnBoard from '@/components/OnBoard.vue'
+import Router from '@/router'
+
+import { mapState } from 'vuex'
+import marked from 'marked'
+import { shortcutsMixin } from '@/components/mixins/shortcutsMixin.js'
+
+export default {
+  name: 'Discarded',
+  mixins: [shortcutsMixin],
+  data: function () {
+    return {
+      localmicrocosm: Router.currentRoute.params.microcosm,
+      clientid: '',
+      clientset: false,
+      offline: false,
+      nodetext1:
+        '## What shall we call you ? 👩‍🚀 \n First we need to connect this device to your ideas. This name is what allows you to create and edit your nodes and can be anything you like and this name is always anonymous.',
+      nodetext2:
+        '## Join/Start a microcosm ! 🚀 \n Now you can create your own microcosm to store your ideas and ask people to join you, either just tell them the name of the microcosm or share the alpha.nodenogg.in URL and add the ending; </br><em><b>/microcosm/nameofyourmicrocosm</b></em>',
+      name: false,
+      microcosm: false,
+    }
+  },
+
+  props: {
+    nodeid: String,
+    nodetext: String,
+    deleted: Boolean,
+  },
+
+  computed: mapState({
+    myNodes: (state) => state.myNodes,
+    configPositions: (state) => state.configPositions,
+    shortcutstate: (state) => state.shortcutstate,
+  }),
+
+  created() {
+    if (typeof window !== 'undefined') {
+      document.addEventListener('keydown', this.handleKeyPress)
+    }
+  },
+
+  beforeDestroy() {
+    if (typeof window !== 'undefined') {
+      document.removeEventListener('keydown', this.handleKeyPress)
+    }
+  },
+
+  mounted() {
+    if (localStorage.myNNClient && localStorage.mylastMicrocosm) {
+      this.clientid = localStorage.myNNClient
+      this.localmicrocosm = localStorage.mylastMicrocosm
+      this.createMicrocosm()
+      this.setClient()
+      this.letsGo()
+      this.clientset = 'true'
+    }
+  },
+
+  components: {
+    // OnBoard,
+    // OffLine,
+    //ModeToolbar,
+  },
+
+  filters: {
+    marked: marked,
+  },
+  methods: {
+    clientAdded() {
+      this.clientset = !this.clientset
+    },
+
+    createMicrocosm() {
+      this.$store.dispatch('createMicrocosm', this.localmicrocosm)
+      localStorage.setItem('mylastMicrocosm', this.localmicrocosm)
+      this.microcosm = true
+    },
+    setClient() {
+      this.$store.dispatch('setClient', this.clientid),
+        localStorage.setItem('myNNClient', this.clientid)
+      this.name = true
+    },
+
+    letsGo() {
+      this.clientset = !this.clientset
+      this.$emit('clientAdded')
+    },
+
+    restoreNode(e) {
+      this.$store.dispatch('restoreNode', { e })
+    },
+
+    editTrue(e) {
+      this.$store.dispatch('shortcutState', e)
+    },
+
+    editNode(e) {
+      var nodeid = e.target.id
+      var nodetext = e.target.value
+      this.$store.dispatch('editNode', { nodeid, nodetext })
+    },
+  },
+}
+</script>
+
+<style lang="css" scoped>
+textarea {
+  width: 95%;
+  height: 100px;
+  margin-left: 1em;
+  margin-bottom: 1em;
+}
+</style>
diff --git a/app/src/views/Discarded.vue b/app/src/views/Discarded.vue
index 901dfabf9aced6fe7847536cce55a39b0f1fb2cd..7679a79e670010c89b0421d5e1c455cb778707b4 100644
--- a/app/src/views/Discarded.vue
+++ b/app/src/views/Discarded.vue
@@ -1,99 +1,34 @@
 <template>
-  <div id="discardwrapper">
-    <h1 class="restore">Your discarded nodes</h1>
-
+  <div id="listwrapper">
     <div v-if="clientset">
-      <form>
-        <div v-for="value in myNodes" v-bind:key="value.node_id">
-          <div v-if="value.deleted == true">
-            {{ value.node_text }}
-
-            <div class="btn-row">
-              <BaseButton
-                class="new"
-                buttonClass="action"
-                @click="restoreNode(value.node_id)"
-                >Restore</BaseButton
-              >
-            </div>
-          </div>
-        </div>
-      </form>
+      <h1 class="mobile">dicarded nodes - list view</h1>
+
+      <DiscardLayer
+        v-for="value in myNodes"
+        v-bind:key="value.node_id"
+        v-bind:nodeid="value.node_id"
+        v-bind:nodetext="value.node_text"
+        v-bind:deleted="value.deleted"
+      />
     </div>
-    <!-- // onboarding for list view -->
-    <div v-else>
-      <form>
-        <div>
-          <p id="nodeid" :inner-html.prop="nodetext1 | marked"></p>
-
-          <div v-if="name == false">
-            <input
-              type="text"
-              v-model.trim="clientid"
-              placeholder="device name"
-              autocorrect="off"
-              autocapitalize="none"
-              ref="objectname"
-              v-on:keyup.enter="setClient()"
-              @focus="editTrue(true)"
-              @blur="editTrue(false)"
-            />
-            <div class="btn-row">
-              <BaseButton buttonClass="special" @click="setClient()"
-                >Store</BaseButton
-              >
-            </div>
-          </div>
-          <div v-else>
-            <h4>Saved</h4>
-          </div>
-        </div>
-      </form>
 
-      <form>
-        <div>
-          <p id="nodeid" :inner-html.prop="nodetext2 | marked"></p>
-          <div v-if="microcosm == false">
-            <input
-              type="text"
-              v-model.trim="localmicrocosm"
-              placeholder="microcosm name"
-              autocorrect="off"
-              autocapitalize="none"
-              autofocus
-              v-on:keyup.enter="createMicrocosm()"
-              @focus="editTrue(true)"
-              @blur="editTrue(false)"
-            />
-            <div class="btn-row">
-              <BaseButton
-                buttonClass="special"
-                @click="createMicrocosm(), letsGo()"
-                >Create Microcosm</BaseButton
-              >
-            </div>
-          </div>
-          <div v-else>
-            <h4>Loading...</h4>
-          </div>
-        </div>
-      </form>
+    <div v-else>
+      <OnBoard @clientAdded="clientAdded()" @editTrue="(e) => editTrue(e)" />
     </div>
   </div>
-  <!-- </div> -->
 </template>
 
 <script>
-// import OffLine from '@/components/OffLine'
-// import OnBoard from '@/components/OnBoard.vue'
 import Router from '@/router'
-
+import DiscardLayer from '@/components/DiscardLayer'
+import OnBoard from '@/components/OnBoard'
 import { mapState } from 'vuex'
 import marked from 'marked'
 import { shortcutsMixin } from '@/components/mixins/shortcutsMixin.js'
 
 export default {
   name: 'Discarded',
+
   mixins: [shortcutsMixin],
   data: function () {
     return {
@@ -101,10 +36,6 @@ export default {
       clientid: '',
       clientset: false,
       offline: false,
-      nodetext1:
-        '## What shall we call you ? 👩‍🚀 \n First we need to connect this device to your ideas. This name is what allows you to create and edit your nodes and can be anything you like and this name is always anonymous.',
-      nodetext2:
-        '## Join/Start a microcosm ! 🚀 \n Now you can create your own microcosm to store your ideas and ask people to join you, either just tell them the name of the microcosm or share the alpha.nodenogg.in URL and add the ending; </br><em><b>/microcosm/nameofyourmicrocosm</b></em>',
       name: false,
       microcosm: false,
     }
@@ -116,11 +47,14 @@ export default {
     deleted: Boolean,
   },
 
-  computed: mapState({
-    myNodes: (state) => state.myNodes,
-    configPositions: (state) => state.configPositions,
-    shortcutstate: (state) => state.shortcutstate,
-  }),
+  computed: {
+    ...mapState({
+      myNodes: (state) => state.myNodes,
+      // otherNodes: (state) => state.otherNodes,
+      shortcutstate: (state) => state.shortcutstate,
+      toolmode: (state) => state.ui.mode,
+    }),
+  },
 
   created() {
     if (typeof window !== 'undefined') {
@@ -134,69 +68,35 @@ export default {
     }
   },
 
-  mounted() {
-    if (localStorage.myNNClient && localStorage.mylastMicrocosm) {
-      this.clientid = localStorage.myNNClient
-      this.localmicrocosm = localStorage.mylastMicrocosm
-      this.createMicrocosm()
-      this.setClient()
-      this.letsGo()
-      this.clientset = 'true'
-    }
-  },
-
-  components: {
-    // OnBoard,
-    // OffLine,
-    //ModeToolbar,
-  },
-
-  filters: {
-    marked: marked,
-  },
   methods: {
     clientAdded() {
       this.clientset = !this.clientset
     },
 
-    createMicrocosm() {
-      this.$store.dispatch('createMicrocosm', this.localmicrocosm)
-      localStorage.setItem('mylastMicrocosm', this.localmicrocosm)
-      this.microcosm = true
-    },
-    setClient() {
-      this.$store.dispatch('setClient', this.clientid),
-        localStorage.setItem('myNNClient', this.clientid)
-      this.name = true
-    },
-
-    letsGo() {
-      this.clientset = !this.clientset
-      this.$emit('clientAdded')
-    },
-
-    restoreNode(e) {
-      this.$store.dispatch('restoreNode', { e })
+    addNode() {
+      this.$store.dispatch('addNode')
     },
 
     editTrue(e) {
       this.$store.dispatch('shortcutState', e)
     },
-
-    editNode(e) {
-      var nodeid = e.target.id
-      var nodetext = e.target.value
-      this.$store.dispatch('editNode', { nodeid, nodetext })
-    },
+  },
+  components: {
+    DiscardLayer,
+    OnBoard,
+  },
+  filters: {
+    marked: marked,
   },
 }
 </script>
 
 <style lang="css" scoped>
-textarea {
-  width: 95%;
-  height: 100px;
+.mobile {
   margin-left: 1em;
+  font-size: 1em;
+}
+.new {
   margin-bottom: 1em;
 }
 </style>
diff --git a/app/src/views/Home.vue b/app/src/views/Home.vue
index 1d5d53482d83a4e50dd686fd61da4dab05d67bb7..f1e58a81c5d1c23e287be904b0e8d300725985c3 100644
--- a/app/src/views/Home.vue
+++ b/app/src/views/Home.vue
@@ -41,6 +41,7 @@
               v-bind:key="value.node_id"
               v-bind:nodeid="value.node_id"
               v-bind:nodetext="value.node_text"
+              v-bind:deleted="value.deleted"
             />
             <NodesLayer
               @editTrue="(e) => editTrue(e)"
@@ -60,6 +61,7 @@
               v-bind:key="value.node_id"
               v-bind:nodeid="value.node_id"
               v-bind:nodetext="value.node_text"
+              v-bind:deleted="value.deleted"
             />
             <NodesLayer
               @editTrue="(e) => editTrue(e)"
diff --git a/app/src/views/Leave.vue b/app/src/views/Leave.vue
new file mode 100644
index 0000000000000000000000000000000000000000..2a0432d2a45a2f95f2e99729e31596669958fdf9
--- /dev/null
+++ b/app/src/views/Leave.vue
@@ -0,0 +1,25 @@
+<template>
+  <div class="leave"></div>
+</template>
+<script>
+export default {
+  name: 'Leave',
+
+  created() {
+    this.removeLocal()
+  },
+
+  methods: {
+    removeLocal: function () {
+      localStorage.removeItem('myNNClient')
+      localStorage.removeItem('mylastMicrocosm')
+
+      location.assign(
+        process.env.VUE_APP_HTTP + '://' + process.env.VUE_APP_URL + '/'
+      )
+    },
+  },
+}
+</script>
+
+<style lang="css" scoped></style>
diff --git a/app/src/views/List.vue b/app/src/views/List.vue
index 6d6492c8983e577b207792c70f89e1e064823fb6..618b5db0de1170067a7886904ea2a361dc4aa72a 100644
--- a/app/src/views/List.vue
+++ b/app/src/views/List.vue
@@ -56,7 +56,7 @@ export default {
   computed: {
     ...mapState({
       myNodes: (state) => state.myNodes,
-      otherNodes: (state) => state.otherNodes,
+      // otherNodes: (state) => state.otherNodes,
       shortcutstate: (state) => state.shortcutstate,
       toolmode: (state) => state.ui.mode,
     }),