deleting old code from default.css and building QuestionBox component

client/talk-plugin-questionbox/QuestionBox.js

@@ -1,17 +1,23 @@
 import React from 'react';
-const packagename = 'talk-plugin-questionbox';
+import cn from 'classnames';
+import styles from './QuestionBox.css';
+import {Icon} from 'coral-ui';
+
 import Slot from 'coral-framework/components/Slot';
 
-const QuestionBox = ({enable, content}) =>
-<div className={`${packagename}-info ${enable ? null : 'hidden'}` }>
-  <div className={`${packagename}-box`}>
-    <i className={`${packagename}-icon material-icons bubble`}>chat_bubble</i>
-    <i className={`${packagename}-icon material-icons person`}>person</i>
+const QuestionBox = ({content, enable}) => (
+  <div className={cn(styles.qbInfo, {[styles.hidden]: !enable}, 'questionbox-info')}>
+    <div className={cn(styles.qbBox, 'questionbox-box')}>
+      <Icon name="chat_bubble" className={cn(styles.iconBubble)} />
+      <Icon name="person" className={cn(styles.iconPerson)} />
+    </div>
+
+    <div className={cn(styles.qbContent, 'questionbox-content')}>
+      {content}
+    </div>
+
+    <Slot fill="streamQuestionArea" />
   </div>
-  <div className={`${packagename}-content`}>
-    {content}
-  </div>
-  <Slot fill="streamQuestionArea" />
-</div>;
+);
 
 export default QuestionBox;