src/App.vue

@@ -1,14 +1,6 @@
 <template>
   <div id="app">
-    <NoteList />
+    <img alt="Vue logo" src="./assets/logo.png" />
+    <h1>Welcome to Your Vue.js App</h1>
   </div>
 </template>
-
-<script>
-import NoteList from '@/components/NoteList.vue'
-export default {
-  components: {
-    NoteList
-  }
-}
-</script>

src/components/NoteList.vue

@@ -1,12 +1,14 @@
 <template>
   <textarea
     @keyup.enter="addNote"
-    onfocus="this.value=''"
-    onblur="this.value = 'Start typing something…'"
     v-model="content"
+    cols="30"
     rows="10"
   ></textarea>
-  <div class="note" v-for="note in notes" :key="note.id">{{ note.text }}</div>
+  <button type="submit" @click="addNote">
+    Submit
+  </button>
+  <div v-for="note in notes" :key="note.id">{{ note.text }}</div>
 </template>
 
 <script>
@@ -26,17 +28,4 @@ export default {
 }
 </script>
 
-<style scoped>
+<style></style>
-textarea {
-  width: 100%;
-  border-width: 0 0 1px 0;
-  border-color: black;
-  resize: none;
-}
-
-.note {
-  border-width: 1px;
-  padding: 5px;
-  margin-bottom: 5px;
-}
-</style>