diff options
| -rw-r--r-- | src/commonStyles.tsx | 8 | ||||
| -rw-r--r-- | src/components/InputTypes/TextArea.tsx | 10 |
2 files changed, 9 insertions, 9 deletions
diff --git a/src/commonStyles.tsx b/src/commonStyles.tsx index 89a2746..f5a5beb 100644 --- a/src/commonStyles.tsx +++ b/src/commonStyles.tsx @@ -1,4 +1,5 @@ import { css } from "@emotion/react"; +import colors from "./colors"; const selectable = css` -moz-user-select: text; @@ -50,6 +51,12 @@ const textInputs = css` border-radius: 8px; `; +const invalidStyles = css` + .invalid-box { + box-shadow: 0 0 10px ${colors.error}; + border: none; + } +`; export { selectable, @@ -57,4 +64,5 @@ export { hiddenInput, multiSelectInput, textInputs, + invalidStyles }; diff --git a/src/components/InputTypes/TextArea.tsx b/src/components/InputTypes/TextArea.tsx index a09ce8a..6729499 100644 --- a/src/components/InputTypes/TextArea.tsx +++ b/src/components/InputTypes/TextArea.tsx @@ -1,9 +1,8 @@ /** @jsx jsx */ import { jsx, css } from "@emotion/react"; import React, { ChangeEvent } from "react"; -import { textInputs } from "../../commonStyles"; +import { invalidStyles, textInputs } from "../../commonStyles"; import ErrorMessage from "../ErrorMessage"; -import colors from "../../colors"; interface TextAreaProps { handler: (event: ChangeEvent<HTMLTextAreaElement>) => void, @@ -21,13 +20,6 @@ const styles = css` padding: 1rem; `; -const invalidStyles = css` - .invalid-box { - box-shadow: 0 0 10px ${colors.error}; - border: none; - } -`; - export default function TextArea(props: TextAreaProps): JSX.Element { return ( <div css={invalidStyles}> |