|
|
@ -7,13 +7,7 @@ import { FaAngleLeft, FaAngleRight } from 'react-icons/lib/fa' |
|
|
|
import zapLogo from 'icons/zap_logo.svg' |
|
|
|
import styles from './FormContainer.scss' |
|
|
|
|
|
|
|
const FormContainer = ({ |
|
|
|
title, |
|
|
|
description, |
|
|
|
back, |
|
|
|
next, |
|
|
|
children |
|
|
|
}) => ( |
|
|
|
const FormContainer = ({ title, description, back, next, children }) => ( |
|
|
|
<div className={styles.container}> |
|
|
|
<div className={styles.titleBar} /> |
|
|
|
|
|
|
@ -29,22 +23,20 @@ const FormContainer = ({ |
|
|
|
<p>{description}</p> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div className={styles.content}> |
|
|
|
{children} |
|
|
|
</div> |
|
|
|
<div className={styles.content}>{children}</div> |
|
|
|
|
|
|
|
<footer className={styles.footer}> |
|
|
|
<div className={styles.buttonsContainer}> |
|
|
|
<section> |
|
|
|
{back && ( |
|
|
|
<div onClick={back} className={styles.backButton} > |
|
|
|
{back && ( |
|
|
|
<div onClick={back} className={styles.backButton}> |
|
|
|
<FaAngleLeft style={{ verticalAlign: 'top' }} /> Back |
|
|
|
</div> |
|
|
|
)} |
|
|
|
</section> |
|
|
|
<section> |
|
|
|
{next && ( |
|
|
|
<div onClick={next} className={styles.nextButton} > |
|
|
|
<div onClick={next} className={styles.nextButton}> |
|
|
|
Next <FaAngleRight style={{ verticalAlign: 'top' }} /> |
|
|
|
</div> |
|
|
|
)} |
|
|
@ -54,7 +46,6 @@ const FormContainer = ({ |
|
|
|
</div> |
|
|
|
) |
|
|
|
|
|
|
|
|
|
|
|
FormContainer.propTypes = { |
|
|
|
title: PropTypes.string.isRequired, |
|
|
|
description: PropTypes.string.isRequired, |
|
|
|