diff --git a/CHANGELOG.md b/CHANGELOG.md
index 496c3f96c7adc3d652e8ebc1b0d3887c0d2cfd35..23582027bd789ebd2b0419dc7b2b7bbc2197a970 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,15 @@
+# 0.1.19
+
+_13th July 2020_
+
+### Changes
+
+- List view has be renamed mobile view and works better on smaller devices. Allow for quick capture of ideas whislt using a smaller screen (not perfect but better than before)
+
+### Fixed
+
+- IPFS Media is working (updated code for 0.49.0)
+
 # 0.1.18
 
 _2nd July 2020_
diff --git a/app/package.json b/app/package.json
index 4e539ec362dda9199ddba606ac6ed3e5cbdf3923..70d471c9a66a5c599dc4efb23a5ac6fdab814274 100644
--- a/app/package.json
+++ b/app/package.json
@@ -1,6 +1,6 @@
 {
   "name": "nodenogg.in",
-  "version": "0.1.18",
+  "version": "0.1.19",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
diff --git a/app/src/components/UploadLayer.vue b/app/src/components/UploadLayer.vue
index 52759c1cb6fc8160f8cd286088b692717deea0e0..a0f300b27bb7ccfffbfc7932e445e0592ed3af51 100644
--- a/app/src/components/UploadLayer.vue
+++ b/app/src/components/UploadLayer.vue
@@ -9,12 +9,12 @@
         ref="fileInput"
         @change="onFileSelected"
       />
-      <!-- <h1>{{ status }}</h1>
+      <h1>{{ status }}</h1>
       <h2>ID: {{ id }}</h2>
-      <h2>Agent version: {{ agentVersion }}</h2> -->
-      <!-- 
+      <h2>Agent version: {{ agentVersion }}</h2>
+
       <button type="button" @click="saveIPFS">Upload</button>
-      <button type="button" @click="getIPFS">Get IPFS</button> -->
+      <button type="button" @click="getIPFS">Get IPFS</button>
       <!-- {{ uploadready }} -->
       <textarea id="ipfshash" v-model="copytext"></textarea>
       <div class="btn-row">
@@ -103,13 +103,8 @@ export default {
 
     async saveIPFS() {
       try {
-        for await (const result of node.add(this.selectedFile)) {
-          //console.log(result.cid.string)
-          this.fileContents = result
-          // console.log(this.fileContents.path)
-          // node.swarm.peers().then((a) => console.log(a))
-          this.getIPFS()
-        }
+        this.fileContents = await node.add(this.selectedFile)
+        this.getIPFS()
       } catch (err) {
         // Set error status text.
         this.status = `Error: ${err}`
@@ -153,7 +148,7 @@ export default {
 </script>
 
 <style lang="css" scoped>
-.fileInput {
+/* .fileInput {
   display: none;
 }
 
@@ -163,5 +158,5 @@ textarea {
   height: 0px;
   width: 0px;
   padding: 0px;
-}
+} */
 </style>
diff --git a/app/src/experimental/ModeToolbar.vue b/app/src/experimental/ModeToolbar.vue
index 488e13e6c24cdd69be11f471479ebd800a658b5b..f6e0c8d959ed90d48124296b3f132e0929b54992 100644
--- a/app/src/experimental/ModeToolbar.vue
+++ b/app/src/experimental/ModeToolbar.vue
@@ -113,33 +113,39 @@ export default {
 
 <style scoped>
 nav {
-  position: fixed;
-
-  bottom: 1em;
-  left: 1em;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  justify-content: space-between;
-}
-button {
-  border: none;
-  width: 50px;
-  height: 50px;
-  padding: 0;
-  margin: 0;
-  margin-top: 1em;
-  background: white;
-  border-radius: 25px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: white;
-  outline: none;
-  box-shadow: 0px 0px 0px 2px rgba(0, 0, 0, 0.1);
-  margin-right: 10px;
+  display: none;
 }
-button.active {
-  background: rgb(30, 30, 30);
+
+@media (min-width: 450px) {
+  nav {
+    position: fixed;
+
+    bottom: 1em;
+    left: 1em;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+  }
+  button {
+    border: none;
+    width: 50px;
+    height: 50px;
+    padding: 0;
+    margin: 0;
+    margin-top: 1em;
+    background: white;
+    border-radius: 25px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: white;
+    outline: none;
+    box-shadow: 0px 0px 0px 2px rgba(0, 0, 0, 0.1);
+    margin-right: 10px;
+  }
+  button.active {
+    background: rgb(30, 30, 30);
+  }
 }
 </style>
diff --git a/app/src/experimental/PanZoomContainer.vue b/app/src/experimental/PanZoomContainer.vue
index 2f258e4f792bcd13436ac8ac6463a1d8584e73e9..9580d9308a318d08353424ebd6f9395c7602474c 100644
--- a/app/src/experimental/PanZoomContainer.vue
+++ b/app/src/experimental/PanZoomContainer.vue
@@ -133,7 +133,7 @@ export default {
       if (!this.interaction.origin) {
         return
       }
-      // console.log('touch')
+      //console.log(e.touches.length)
       e.preventDefault()
       const isPinchAction =
         e.touches.length == 2 && this.interaction.origin.points.length > 1
diff --git a/app/src/router/index.js b/app/src/router/index.js
index 7e5919bf63bb056c539db74b4306a6385b5256d7..f95e43fa2ee5835177cca232ba875faee62c5b6e 100644
--- a/app/src/router/index.js
+++ b/app/src/router/index.js
@@ -13,6 +13,11 @@ export const routes = [
     name: 'Home',
     component: Home,
   },
+  {
+    path: '/mobile',
+    name: 'Mobile',
+    component: List,
+  },
   {
     path: '/about',
     name: 'About',
@@ -22,11 +27,6 @@ export const routes = [
     component: () =>
       import(/* webpackChunkName: "about" */ '../views/About.vue'),
   },
-  {
-    path: '/list',
-    name: 'List Test',
-    component: List,
-  },
 
   // {
   //   path: '/test',
diff --git a/app/src/views/List.vue b/app/src/views/List.vue
index 30bb86eb58a1e8d1db58c0056aa69d1627fcce5c..36cf66ac8e4d23a6a1056338f29ebc31fa071820 100644
--- a/app/src/views/List.vue
+++ b/app/src/views/List.vue
@@ -2,7 +2,6 @@
   <div id="listwrapper">
     <!-- <div v-for="(posvalue, index) in configPositions" v-bind:key="index"> -->
     <h1 class="mobile">Your nodes - list mode</h1>
-    <h2>Testing Only</h2>
     <!-- <OffLine
       v-for="value in myNodes"
       v-bind:key="value.node_id"
@@ -10,79 +9,92 @@
       v-bind:nodetext="value.node_text"
       @editTrue="(e) => editTrue(e)"
     /> -->
+    <div v-if="clientset">
+      <div class="btn-row">
+        <BaseButton class="new" buttonClass="action" @click="addNode()"
+          >Create Node</BaseButton
+        >
+      </div>
 
-    <form>
-      <div>
-        <p id="nodeid" :inner-html.prop="nodetext1 | marked"></p>
-        <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
-          >
+      <form>
+        <!-- <div v-if="posvalue.read_mode == false"> -->
+        <div
+          v-for="value in myNodes.slice().reverse()"
+          v-bind:key="value.node_id"
+        >
+          <textarea
+            @focus="editTrue(true)"
+            @blur="editTrue(false)"
+            autofocus
+            @input="editNode"
+            v-model="value.node_text"
+            :id="nodeid"
+            ref="nodetext"
+            placeholder="Idea goes here!"
+          ></textarea>
         </div>
-      </div>
-    </form>
-
-    <form>
-      <div>
-        <p id="nodeid" :inner-html.prop="nodetext2 | marked"></p>
-        <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
-          >
+      </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>
-      </div>
-    </form>
-    <div class="btn-row">
-      <BaseButton class="new" buttonClass="action" @click="addNode()"
-        >Create Node</BaseButton
-      >
+      </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>
 
-    <form>
-      <!-- <div v-if="posvalue.read_mode == false"> -->
-      <div
-        v-for="value in myNodes.slice().reverse()"
-        v-bind:key="value.node_id"
-      >
-        <textarea
-          @focus="editTrue(true)"
-          @blur="editTrue(false)"
-          autofocus
-          @input="editNode"
-          v-model="value.node_text"
-          :id="nodeid"
-          ref="nodetext"
-          placeholder="Idea goes here!"
-        ></textarea>
-      </div>
-      <!-- </div> -->
-      <!-- <div v-if="posvalue.read_mode == true">
-          <p class="read" :id="nodeid" :inner-html.prop="nodetext | marked"></p>
-        </div> -->
-    </form>
-
     <ModeToolbar />
   </div>
   <!-- </div> -->
@@ -108,9 +120,10 @@ export default {
       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:
         '## Start those engines ! 🏎 \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,
     }
   },
 
@@ -145,6 +158,7 @@ export default {
       this.createMicrocosm()
       this.setClient()
       this.letsGo()
+      this.clientset = 'true'
     }
   },
 
@@ -165,13 +179,16 @@ export default {
     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')
     },