MC-2363: Add vertical alignment and min height to row configuration

- apply main and container styles to master and preview templates

Author: anthoula

app/code/Magento/PageBuilder/view/adminhtml/web/template/content-type/row/default/master.html

@@ -5,6 +5,8 @@
  */
 -->
 
-<div data-bind="attr: data.main.attributes, style: data.main.style, css: data.main.css">
-    <!-- ko template: renderChildTemplate --><!-- /ko -->
+<div attr="data.main.attributes"
+     ko-style="Object.assign(data.container.style(), data.main.style())"
+     css="data.main.css">
+    <render args="renderChildTemplate"/>
 </div>

app/code/Magento/PageBuilder/view/adminhtml/web/template/content-type/row/default/preview.html

@@ -7,7 +7,15 @@
 
 <div class="pagebuilder-content-type type-container pagebuilder-row children-min-height" data-bind="attr: data.main.attributes, style: data.main.style, css: Object.assign(data.main.css(), {'empty-container': parent.children().length == 0, 'jarallax': data.main.attributes()['data-enable-parallax'] == 1}), event: {mouseover: onMouseOver, mouseout: onMouseOut }, mouseoverBubble: false, afterRender: function (element) { setTimeout(function () { initParallax.call($data, element); }, 0) }">
     <!-- ko template: getOptions().template --><!-- /ko -->
-    <!-- ko template: previewChildTemplate --><!-- /ko -->
+    <div class="element-children content-type-container" each="parent.getChildren()" ko-style="data.container.style" css="getChildrenCss()" attr="{id: parent.id + '-children'}" data-bind="sortable: getSortableOptions()" afterRender="function (element) { if (typeof afterChildrenRender === 'function') { afterChildrenRender(element); } }">
+        <if args="$parent.isContainer()">
+            <div class="pagebuilder-drop-indicator"></div>
+        </if>
+        <div class="pagebuilder-content-type-wrapper" template="{ name: preview.previewTemplate, data: preview, afterRender: function () { preview.dispatchAfterRenderEvent.apply(preview, arguments); } }" attr="{ id: id }"></div>
+        <if args="$parent.isContainer() && $index() === $parent.parent.getChildren()().length - 1">
+            <div class="pagebuilder-drop-indicator"></div>
+        </if>
+    </div>
     <div class="pagebuilder-display-label" data-bind="text: function () { return displayLabel().toUpperCase(); }()"></div>
     <div class="pagebuilder-empty-container empty-placeholder" data-bind="css: {visible: parent.children().length == 0}, i18n: 'Drag content types or columns here'"></div>
 </div>