From 00c2440163272ba39787f117ec2ad77d6b0b14d5 Mon Sep 17 00:00:00 2001
From: Alfred Melch <dev@melch.pro>
Date: Sun, 22 Dec 2019 19:57:07 +0100
Subject: [PATCH] Style textinput

---
 src/components/TextInput.css | 9 +++++++++
 src/components/TextInput.js  | 7 ++++++-
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 src/components/TextInput.css

diff --git a/src/components/TextInput.css b/src/components/TextInput.css
new file mode 100644
index 0000000..54f6a94
--- /dev/null
+++ b/src/components/TextInput.css
@@ -0,0 +1,9 @@
+.area {
+  box-sizing: border-box;
+  width: 100%;
+  height: 300px;
+}
+
+.load {
+  width: 100%;
+}
diff --git a/src/components/TextInput.js b/src/components/TextInput.js
index bbbe373..0a275c1 100644
--- a/src/components/TextInput.js
+++ b/src/components/TextInput.js
@@ -3,6 +3,8 @@ import { useDispatch } from 'react-redux'
 
 import { setText } from '../store/actions.js'
 
+import styles from './TextInput.css'
+
 const lorem =
   'Excepteur aliqua cupidatat ullamco laboris cupidatat elit sint cillum incididunt. Anim sit excepteur laboris commodo ullamco consequat tempor. Velit elit eiusmod aute aliquip amet sunt minim deserunt voluptate esse ea sint. Commodo ipsum dolor dolor Lorem et consectetur minim ut in voluptate. Nulla qui consectetur nostrud sint anim minim duis qui amet. Ipsum reprehenderit eiusmod quis Lorem. Consectetur ipsum quis incididunt proident ea sit mollit veniam in excepteur.'
 
@@ -12,10 +14,13 @@ export const TextInput = () => {
   return (
     <div>
       <textarea
+        className={styles.area}
         defaultValue={text}
         onInput={e => setTextState(e.target.value)}
       ></textarea>
-      <button onClick={() => dispatch(setText(text))}>Load</button>
+      <button className={styles.load} onClick={() => dispatch(setText(text))}>
+        Load
+      </button>
     </div>
   )
 }