Merge branch 'fix-layout' into 'master'

layout fix + question creation

See merge request !376

editors/demo/src/HHMI/layout/HhmiLayout.js

@@ -60,12 +60,14 @@ const EditorArea = styled.div`
 `;
 
 const WaxSurfaceScroll = styled.div`
+  padding: 25px 25% 0 25%;
   box-sizing: border-box;
   display: flex;
   height: 100%;
   overflow-y: auto;
-  padding: 25px 25% 0 25%;
+  position: relative;
   width: 100%;
+
   /* PM styles  for main content*/
   ${EditorElements};
 `;
@@ -73,6 +75,7 @@ const WaxSurfaceScroll = styled.div`
 const EditorContainer = styled.div`
   height: 100%;
   width: 100%;
+  position: relative;
 
   .ProseMirror {
     box-shadow: 0 0 8px #ecedf1;

wax-prosemirror-components/src/components/link/LinkComponent.js

@@ -7,6 +7,7 @@ import { DocumentHelpers } from 'wax-prosemirror-utilities';
 
 const Wrapper = styled.div`
   background: #fff;
+  display: flex;
   border-radius: 1.03093% / 8%;
   box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px 0px,
     rgba(9, 30, 66, 0.31) 0px 0px 1px 0px;
@@ -38,7 +39,7 @@ const Input = styled.input`
 `;
 
 const ButtonGroup = styled.div`
-  display: inline-block;
+  display: flex;
 `;
 
 const StyledButton = styled.button`

wax-prosemirror-core/src/styles/styles.css

@@ -143,14 +143,6 @@ img.ProseMirror-separator {
 
 /* -- Selection Plugin ---------------------------------- */
 
-  p::selection,
-  p > *::selection {
-    background-color: #c0c0c0;
-  }
-  .katex-html *::selection {
-    background-color: none !important;
-  }
-
   .math-node.math-select .math-render {
     background-color: #c0c0c0ff;
   }

wax-prosemirror-services/src/MultipleChoiceQuestionService/components/EditorComponent.js

@@ -27,6 +27,14 @@ const EditorWrapper = styled.div`
       outline: none;
     }
 
+    :empty::before {
+      content: 'Type your answer';
+      color: #aaa;
+      float: left;
+      font-style: italic;
+      pointer-events: none;
+    }
+
     p.empty-node:first-child::before {
       content: attr(data-content);
     }

wax-prosemirror-services/src/MultipleChoiceQuestionService/components/QuestionEditorComponent.js

@@ -32,6 +32,14 @@ const EditorWrapper = styled.div`
       outline: none;
     }
 
+    :empty::before {
+      content: 'Type your question';
+      color: #aaa;
+      float: left;
+      font-style: italic;
+      pointer-events: none;
+    }
+
     p.empty-node:first-child::before {
       content: attr(data-content);
     }

wax-prosemirror-services/src/MultipleChoiceQuestionService/helpers/helpers.js

@@ -79,11 +79,11 @@ const createOptions = (main, context, parentType, questionType, answerType) => {
   tr.replaceSelectionWith(secondOption);
   dispatch(tr);
 
-  setTimeout(() => {
-    createEmptyParagraph(context, firstOption.attrs.id);
-    createEmptyParagraph(context, secondOption.attrs.id);
-    createEmptyParagraph(context, question.attrs.id);
-  }, 50);
+  // setTimeout(() => {
+  //   createEmptyParagraph(context, firstOption.attrs.id);
+  //   createEmptyParagraph(context, secondOption.attrs.id);
+  //   createEmptyParagraph(context, question.attrs.id);
+  // }, 50);
 
   return true;
 };