diff options
Diffstat (limited to 'src/components/Form')
| -rw-r--r-- | src/components/Form/Form.module.scss | 12 | ||||
| -rw-r--r-- | src/components/Form/Input/Input.tsx | 19 | ||||
| -rw-r--r-- | src/components/Form/TextArea/TextArea.tsx | 13 |
3 files changed, 12 insertions, 32 deletions
diff --git a/src/components/Form/Form.module.scss b/src/components/Form/Form.module.scss index e805c52..6ccdb11 100644 --- a/src/components/Form/Form.module.scss +++ b/src/components/Form/Form.module.scss @@ -27,14 +27,6 @@ max-width: 45ch; } -.label { - display: block; - color: var(--color-primary-darker); - font-size: var(--font-size-sm); - font-variant: small-caps; - font-weight: 600; -} - .field { width: 100%; padding: var(--spacing-2xs) var(--spacing-xs); @@ -63,10 +55,6 @@ min-height: fun.convert-px(200); } -.required { - color: var(--color-secondary); -} - .wrapper--search { > input { padding-right: calc(var(--btn-size) + var(--spacing-2xs)); diff --git a/src/components/Form/Input/Input.tsx b/src/components/Form/Input/Input.tsx index 986ea63..07f0410 100644 --- a/src/components/Form/Input/Input.tsx +++ b/src/components/Form/Input/Input.tsx @@ -1,4 +1,10 @@ -import { ChangeEvent, ForwardedRef, forwardRef, SetStateAction } from 'react'; +import { + ChangeEvent, + ForwardedRef, + forwardRef, + ReactElement, + SetStateAction, +} from 'react'; import styles from '../Form.module.scss'; type InputType = 'text' | 'email' | 'number' | 'search'; @@ -10,7 +16,6 @@ const Input = ( value, setValue, type = 'text', - required = false, label, }: { id: string; @@ -18,8 +23,7 @@ const Input = ( value: string; setValue: (value: SetStateAction<string>) => void; type?: InputType; - required?: boolean; - label?: string; + label?: ReactElement; }, ref: ForwardedRef<HTMLInputElement> ) => { @@ -29,12 +33,7 @@ const Input = ( return ( <> - {label && ( - <label htmlFor={id} className={styles.label}> - {label} - {required && <span className={styles.required}> *</span>} - </label> - )} + {label} <input ref={ref} type={type} diff --git a/src/components/Form/TextArea/TextArea.tsx b/src/components/Form/TextArea/TextArea.tsx index e1e7e0f..b8894ab 100644 --- a/src/components/Form/TextArea/TextArea.tsx +++ b/src/components/Form/TextArea/TextArea.tsx @@ -1,4 +1,4 @@ -import { ChangeEvent, SetStateAction } from 'react'; +import { ChangeEvent, ReactElement, SetStateAction } from 'react'; import styles from '../Form.module.scss'; const TextArea = ({ @@ -6,15 +6,13 @@ const TextArea = ({ name, value, setValue, - required = false, label, }: { id: string; name: string; value: string; setValue: (value: SetStateAction<string>) => void; - required?: boolean; - label?: string; + label?: ReactElement; }) => { const updateValue = (e: ChangeEvent<HTMLTextAreaElement>) => { setValue(e.target.value); @@ -22,12 +20,7 @@ const TextArea = ({ return ( <> - {label && ( - <label htmlFor={id} className={styles.label}> - {label} - {required && <span className={styles.required}> *</span>} - </label> - )} + {label} <textarea id={id} name={name} |
