Move to use FormField the right way.

client/coral-configure/components/ConfigureCommentStream.css

@@ -36,34 +36,6 @@ p {
   margin-bottom: 20px;
 }
 
-.configSettingQuestionBox {
-  min-height: 100px;
-  margin-bottom: 20px;
-  cursor: pointer;
-  width: auto;
-  height: auto;
-  text-align: left;
-  overflow: visible;
-}
-
 .hidden {
   display: none;
 }
-
-/* Question Box Styles */
-
-.configSettingQuestionBox {
-  background: white;
-}
-
-.configSettingQuestionBoxInfo {
-  top: 0;
-  border: 10px;
-  background: white;
-  color: inherit;
-  width: 100%;
-  text-align: left;
-  padding: 5px;
-  font-weight: bold;
-  display: block;
-}

client/coral-configure/components/ConfigureCommentStream.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import {Button, Checkbox, TextField} from 'coral-ui';
+import {Button, Checkbox, FormField} from 'coral-ui';
 
 import styles from './ConfigureCommentStream.css';
 
@@ -46,10 +46,9 @@ export default ({handleChange, handleApply, changed, updateQuestionBoxContent, .
               description: lang.t('configureCommentStream.enableQuestionBoxDescription')
             }} />
 
-          <div className={`${styles.configSettingQuestionBox} ${props.questionBoxEnable ? null : styles.hidden}`} >
-            <TextField
-              name="qboxcontent"
-              className={`${styles.configSettingQuestionBoxInfo}`}
+          <div className={`${props.questionBoxEnable ? null : styles.hidden}`} >
+            <FormField
+              id="qboxcontent"
               onChange={updateQuestionBoxContent}
               rows={3}
               value={props.questionBoxContent}

client/coral-ui/components/TextField.js

@@ -1,20 +0,0 @@
-import React, {Component} from 'react';
-import {Textfield as TextFieldMDL} from 'react-mdl';
-import 'material-design-lite';
-
-export default class TextField extends Component {
-  render() {
-    const {name, className, onChange, label, rows, value, style} = this.props;
-    return (
-      <TextFieldMDL
-        name={name}
-        className={className}
-        onChange={onChange}
-        label={label}
-        rows={rows}
-        value={value}
-        style={style}
-      />
-    );
-  }
-}

client/coral-ui/index.js

@@ -14,7 +14,6 @@ export {default as List} from './components/List';
 export {default as Item} from './components/Item';
 export {default as Card} from './components/Card';
 export {default as FormField} from './components/FormField';
-export {default as TextField} from './components/TextField';
 export {default as Success} from './components/Success';
 export {default as Pager} from './components/Pager';
 export {default as Wizard} from './components/Wizard';