From cb9a52082e35623bfd480d08106d1fed141284ed Mon Sep 17 00:00:00 2001
From: Kyle Gill <kylerobertgill@gmail.com>
Date: Thu, 28 Mar 2019 17:35:10 -0600
Subject: [PATCH] chore: accessibility for textarea

---
 src/components/screens/Day/Day.js | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/src/components/screens/Day/Day.js b/src/components/screens/Day/Day.js
index 68eaa61..617fa3f 100644
--- a/src/components/screens/Day/Day.js
+++ b/src/components/screens/Day/Day.js
@@ -16,6 +16,7 @@ const JournalHeading = styled.h2`
 const JournalEntryArea = styled.textarea`
   flex-grow: 1;
   color: ${props => props.theme.colors.primary};
+  caret-color: ${props => props.theme.colors.secondary};
   background-color: transparent;
   line-height: 1.5;
   letter-spacing: 0.5px;
@@ -24,9 +25,17 @@ const JournalEntryArea = styled.textarea`
   resize: none;
   outline: none;
   font-size: ${SIZES.small};
+  border-radius: 3px;
+  margin-top: ${SIZES.tiny};
+  padding-top: 0px;
+  padding-bottom: 0px;
   &::placeholder {
     color: ${props => props.theme.colors.tertiary};
   }
+  &:focus {
+    box-shadow: 0 0 0 8px ${props => props.theme.colors.bodyBackground},
+      0 0 0 10px ${props => props.theme.colors.hover};
+  }
 `;
 
 class Day extends Component {