add css

Author: WordsofDefiance

src/components/add-note/AddNote.component.jsx

@@ -1,13 +1,16 @@
 import React from 'react'
 import { Link } from 'react-router-dom'
+import './add-note.styles.css'
 
 export const AddNote = () => {
     return (
         <>
-        <h1>Add Note</h1>
-        <input id="title" type='text' placeholder='Enter a Title'></input>
-        <textarea id="body" placeholder='Enter the note'></textarea>
-        <button>ADDING NOTES COMING SOON!</button>
+        <h1>Add Note (To Do)</h1>
+        <form id="add-note" action='/'>
+            <input id="title" type='text' placeholder='Enter a Title'></input>
+            <textarea id="body" placeholder='Enter the note'></textarea>
+            <button onClick={e => e.preventDefault()} type="submit">ADDING NOTES COMING SOON!</button>
+        </form>
         <Link to='/'>Go Back</Link>
         </>
     )

src/components/add-note/add-note.styles.css

@@ -0,0 +1,4 @@
+#add-note * {
+    display: block;
+    margin-bottom: 15px;
+}