style case title input area,

relates #148
fac-14 · Oct 18, 2018 · f358a96 · f358a96
1 parent 3233bce
commit f358a96
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 5 deletions.
diff --git a/src/components/Pages/AddNew/AddNewContainer.js b/src/components/Pages/AddNew/AddNewContainer.js
@@ -53,6 +53,22 @@ const StyledButton = styled.input`
   }
 `;
 
+const StyledTextArea = styled.textarea`
+  resize: none;
+  margin: 16px;
+  padding: 8px;
+  width: calc(100vw - 48px);
+  height: calc(100vh - 322px);
+  border: none;
+  font-size: 16px;
+  line-height: 1.2;
+  font-family: "Roboto", Helvetica, sans-serif;
+
+  :focus {
+    outline-color: #c7c7b2;
+  }
+`;
+
 const MarkSchemeList = styled.ul`
   width: 100%;
 `;
@@ -116,7 +132,7 @@ export default class AddNewContainer extends React.Component {
             {this.props.caseDetailsDisplayed ? (
               <div id="add-new-text" data-testid="new-case-details">
                 <InstructionText text={"Case details"} />
-                <textarea
+                <StyledTextArea
                   onChange={this.props.caseDetailsChange}
                   placeholder="Add patient details"
                   max-length="5000"

diff --git a/src/components/Pages/AddNew/NewTileTextInput.js b/src/components/Pages/AddNew/NewTileTextInput.js
@@ -11,11 +11,8 @@ const NewTileTextInputElement = styled.input`
   width: 100%;
   border: none;
   border-bottom: solid black 2px;
-
-  color: #009f5c;
   font-size: 20px;
-  font-family: "Nova Round", Helvetica, sans-serif;
-  text-transform: uppercase;
+  font-family: "Roboto", Helvetica, sans-serif;
   line-height: 1.2;
   letter-spacing: 1px;