Markdown Editor Added and Working

client/coral-configure/components/QuestionBoxBuilder.css

@@ -38,4 +38,8 @@
   left: 0;
   width: 100%;
   height: 100%;
+}
+
+.qb {
+  margin: 10px 0;
 }

client/coral-configure/components/QuestionBoxBuilder.js

@@ -54,6 +54,7 @@ class QuestionBoxBuilder extends React.Component {
         </ul>
 
         <QuestionBox
+          className={styles.qb} 
           enable={true}
           icon={questionBoxIcon}  
           content={questionBoxContent}
@@ -63,7 +64,7 @@ class QuestionBoxBuilder extends React.Component {
           value={questionBoxContent}
           onChange={(value) => handleChange({}, {questionBoxContent: value})}
         />
-        
+
       </div>
     );
   }

client/coral-configure/containers/ConfigureStreamContainer.js

@@ -27,11 +27,9 @@ class ConfigureStreamContainer extends Component {
   handleApply (e) {
     e.preventDefault();
     const {elements} = e.target;
-    const {questionBoxIcon} = this.state.dirtySettings;
+    const {questionBoxIcon, questionBoxContent} = this.state.dirtySettings;
     const premod = elements.premod.checked;
     const questionBoxEnable = elements.qboxenable.checked;
-    const questionBoxContent = elements.qboxcontent.value;
-
     const premodLinksEnable = elements.plinksenable.checked;
     const {changed} = this.state;
 
@@ -70,8 +68,6 @@ class ConfigureStreamContainer extends Component {
       changes.premodLinksEnable = e.target.value;
     }
 
-    console.log(changes)
-
     this.setState({
       changed: true,
       dirtySettings: {

client/coral-framework/components/MarkdownEditor.css

@@ -467,7 +467,6 @@ $fullscreenZIndex: 10;
       text-align: center;
       text-decoration: none!important;
       color: #2c3e50!important;
-      width: 30px;
       height: 30px;
       margin: 0;
       border: 1px solid transparent;
@@ -475,6 +474,8 @@ $fullscreenZIndex: 10;
       cursor: pointer;
       outline: 0;
       margin-right: 2px;
+      font-size: 1.5em;
+      width: 25px;
       &.active {
         background: #fcfcfc;
         border-color: #95a5a6;

client/talk-plugin-questionbox/QuestionBox.js

@@ -5,8 +5,8 @@ import {Icon} from 'coral-ui';
 
 import Slot from 'coral-framework/components/Slot';
 
-const QuestionBox = ({content, enable, icon = ''}) => (
-  <div className={cn(styles.qbInfo, {[styles.hidden]: !enable}, 'questionbox-info')}>
+const QuestionBox = ({content, enable, icon = '', className = ''}) => (
+  <div className={cn(styles.qbInfo, {[styles.hidden]: !enable}, 'questionbox-info', className)}>
     {
       icon === 'default' ? (
         <div className={cn(styles.qbIconContainer)}>