Merge branch 'develop'

src/core/Resources/assets/css/admin.scss

@@ -805,10 +805,16 @@ label.required::after {
     }
   }
 
-  .builder-add .btn {
+  .builder-add {
-    font-size: 12px;
+    &-top {
-    line-height: 14px;
+      margin-top: 7px;
-    padding: 3px 5px;
+    }
+
+    .btn {
+      font-size: 12px;
+      line-height: 14px;
+      padding: 3px 5px;
+    }
   }
 
   .block-settings {
@@ -821,7 +827,7 @@ label.required::after {
     }
   }
 
-  .block[class*="block-depth"] .block {
+  .block .block {
     margin-top: 10px;
   }
 

src/core/Resources/assets/js/components/builder-block/BuilderBlock.vue

@@ -12,6 +12,14 @@
     :class="{'block-show-dropzone': showDragDrop}"
     class="block"
   >
+    <BuilderBlockCreate
+      :container="value"
+      :widgets="widgets"
+      :openedBlocks="openedBlocks"
+      :allowedWidgets="[]"
+      v-if="value.length > 0"
+      position="top"
+    />
     <BuilderBlockItem
       v-for="(block, key) in value"
       :key="block.id + '-' + key"
@@ -30,6 +38,7 @@
           :widgets="widgets"
           :openedBlocks="openedBlocks"
           :allowedWidgets="[]"
+          position="bottom"
         />
         <div>
           <button

src/core/Resources/assets/js/components/builder-block/BuilderBlockCreate.vue

@@ -42,7 +42,7 @@
 </style>
 
 <template>
-  <div class="builder-add">
+  <div class="builder-add" :class="{'builder-add-top': position === 'top'}">
     <button type="button" class="btn btn-secondary" v-on:click="togglePicker">
       <span class="fa fa-plus"></span>
     </button>
@@ -106,7 +106,11 @@ export default {
     openedBlocks: {
       type: Object,
       required: true
-    }
+    },
+    position: {
+      type: String,
+      required: true
+    },
   },
   data() {
     return {
@@ -129,10 +133,14 @@ export default {
         children: [],
       }
 
-      this.container.push(block)
+      if (this.position === 'bottom') {
-      this.openedBlocks[block.id] = true
+        this.container.push(block)
+      } else {
+        this.container.unshift(block)
+      }
 
       this.$emit('updateContainer', this.container)
+      this.openedBlocks[block.id] = true
       this.togglePicker()
     },
     makeId() {

src/core/Resources/assets/js/components/builder-block/BuilderBlockItem.vue

@@ -59,6 +59,17 @@
       </div>
     </div>
 
+    <div v-if="widget.isContainer" class="container">
+      <BuilderBlockCreate
+        :container="item.children"
+        :widgets="widgets"
+        :openedBlocks="openedBlocks"
+        :allowedWidgets="widget.widgets"
+        v-if="item.children.length > 0"
+        position="top"
+      />
+    </div>
+
     <Draggable
       v-if="widget.isContainer"
       v-model="item.children"
@@ -90,6 +101,7 @@
         :widgets="widgets"
         :openedBlocks="openedBlocks"
         :allowedWidgets="widget.widgets"
+        position="bottom"
       />
     </div>
   </div>