add label

wax-prosemirror-services/src/FillTheGapQuestionService/CreateGapService/CreateGap.js

@@ -8,6 +8,7 @@ class CreateGap extends Tools {
   title = 'Create Gap Option';
   icon = 'insertGap';
   name = 'Create Gap';
+  label = 'Create Gap';
 
   get run() {
     return (state, dispatch) => {

wax-prosemirror-services/src/FillTheGapQuestionService/components/FillTheGapContainerComponent.js

@@ -11,11 +11,11 @@ const FillTheGapContainer = styled.div`
 `;
 
 const FillTheGapContainerTool = styled.div`
-  background: #f5f5f7;
+  border: 3px solid #f5f5f7;
+  border-bottom: none;
 
   span {
     position: relative;
-    left: 5px;
     top: 3px;
   }
 `;
@@ -47,7 +47,6 @@ export default ({ node, view, getPos }) => {
       <div>
         <span> Fill The Gap</span>
         <FillTheGapContainerTool>
-          <span> Insert Gap :</span>
           <FillTheGapTool />
         </FillTheGapContainerTool>
       </div>

wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/CreateDropDown.js

@@ -9,6 +9,7 @@ class CreateDropDown extends Tools {
   title = 'Create Drop Down';
   icon = 'mulitpleDropDown';
   name = 'Create_Drop_Down';
+  label = 'Insert Drop Down';
 
   get run() {
     return (state, dispatch) => {

wax-prosemirror-services/src/MultipleDropDownService/components/MultipleDropDownContainerComponent.js

@@ -11,10 +11,11 @@ const MultipleDropDownpWrapper = styled.div`
 `;
 
 const MultipleDropDownContainerTool = styled.div`
-  background: #f5f5f7;
+  border: 3px solid #f5f5f7;
+  border-bottom: none;
+
   span {
     position: relative;
-    left: 5px;
     top: 3px;
   }
 `;
@@ -46,7 +47,6 @@ export default ({ node, view, getPos }) => {
       <div>
         <span>Multiple Drop Down</span>
         <MultipleDropDownContainerTool>
-          <span> Insert Drop Down :</span>
           <MultipleDropDown />
         </MultipleDropDownContainerTool>
       </div>