Form input

					
<div className={"form-input " + this.props.required}>
<label htmlFor={this.props.id}>{this.props.label}</label>
<input
id={this.props.id}
type={this.props.type}
name={this.props.name}
value={this.props.value}
placeholder={this.props.placeholder}
onChange={this.props.onChange}
/>
{this.props.error && <span className='help-block'>{this.props.error[0]}</span>}
</div>				

					
SCSS Style:
    display: flex;
    flex-direction: row;
    border: 2px;
    border-bottom: thin solid $white;
    border-top: thin solid $white;
    padding: 10px 0;
    width: 100%;
    height: auto;
    margin: 0 10px;
    justify-content: space-between;
    font-weight: bold;
    font-size: 15px;
    line-height: 2.0;
    background-color: $white;
    opacity: 0.7;
    text-transform: uppercase;