scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 01:25:52 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Format validation; redo of PR 3116

Browse source
This commit is contained in:
Ben Wheeler 2019-07-12 11:39:04 -04:00
parent 62f30c7a8b
commit 911ecc8516
2 changed files with 13 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/components/formik-forms/formik-input.jsx
View file

@ -11,9 +11,10 @@ require('../forms/row.scss');
const FormikInput = ({ const FormikInput = ({
className, className,
error, error,
validationClassName,
...props ...props
}) => ( }) => (
<div className="col-sm-9 row"> <div className="col-sm-9 row row-relative">
<Field <Field
className={classNames( className={classNames(
'input', 'input',
@ -22,7 +23,10 @@ const FormikInput = ({
{...props} {...props}
/> />
{error && ( {error && (
<ValidationMessage message={error} /> <ValidationMessage
className={validationClassName}
message={error}
/>
)} )}
</div> </div>
); );
@ -31,7 +35,8 @@ const FormikInput = ({
FormikInput.propTypes = { FormikInput.propTypes = {
className: PropTypes.string, className: PropTypes.string,
error: PropTypes.string, error: PropTypes.string,
type: PropTypes.string type: PropTypes.string,
validationClassName: PropTypes.string
}; };
module.exports = FormikInput; module.exports = FormikInput;

5
src/components/forms/row.scss
View file

@ -21,6 +21,11 @@
} }
} }
/* allow elements such as validation errors to position relative to this row */
.row-relative {
position: relative;
}
.row-label { .row-label {
margin-bottom: .75rem; margin-bottom: .75rem;
line-height: 1.7rem; line-height: 1.7rem;