basic list view

The loops need reviewing I think there is a  better way but will do for now

app/src/components/ControlsLayer.vue

@@ -2,7 +2,7 @@
   <div class="controls">
     <div class="btn-row">
       <BaseButton buttonClass="action" @click="addNode()">Create Node</BaseButton>
-      <BaseButton buttonClass="action" @click="listView()">List View</BaseButton>
+      <BaseButton buttonClass="action" @click="listView()">Switch View</BaseButton>
       <BaseButton buttonClass="action" @click="removeLocal()">Join another microcosm</BaseButton>
       <!-- <BaseButton @click="exportStorage()">Export my contributions</BaseButton>
     <BaseButton buttonClass="danger" v-on:click="deleteClient">

app/src/views/Home.vue

 <template>
   <div class="home">
     <div v-if="clientset">
-      <OtherNodeslayer
-        v-for="value in otherNodes"
-        v-bind:key="value.node_id"
-        v-bind:nodeid="value.node_id"
-        v-bind:nodetext="value.node_text"
-      />
-
-      <NodesLayer
-        @editTrue="e => editTrue(e)"
-        v-for="value in myNodes"
-        v-bind:key="value.node_id"
-        v-bind:nodeid="value.node_id"
-        v-bind:nodetext="value.node_text"
-      />
       <div v-if="listview">
         <ListLayer
           v-for="value in myNodes"
@@ -30,6 +16,22 @@
           v-bind:nodetext="value.node_text"
         />
       </div>
+      <div v-else>
+        <OtherNodeslayer
+          v-for="value in otherNodes"
+          v-bind:key="value.node_id"
+          v-bind:nodeid="value.node_id"
+          v-bind:nodetext="value.node_text"
+        />
+
+        <NodesLayer
+          @editTrue="e => editTrue(e)"
+          v-for="value in myNodes"
+          v-bind:key="value.node_id"
+          v-bind:nodeid="value.node_id"
+          v-bind:nodetext="value.node_text"
+        />
+      </div>
       <ControlsLayer @listView="listView()" />
     </div>
     <OnBoard v-else @clientAdded="clientAdded()" />