PB-500 fix ability to hide column groups on the front-end

Author: paras89

app/code/Magento/PageBuilder/view/adminhtml/pagebuilder/content_type/column_group.xml

@@ -51,7 +51,6 @@
                         <style name="padding" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings"/>
                         <style name="display" source="display" converter="Magento_PageBuilder/js/converter/style/display" preview_converter="Magento_PageBuilder/js/converter/style/preview/display"/>
                         <static_style source="align_self" value="stretch"/>
-                        <static_style source="display" value="flex"/>
                         <attribute name="background_images" source="data-background-images"/>
                         <attribute name="name" source="data-content-type"/>
                         <attribute name="appearance" source="data-appearance"/>
@@ -62,6 +61,9 @@
                         </filter>
                     </css>
                     </element>
+                    <element name="container">
+                        <static_style source="display" value="flex"/>
+                    </element>
                 </elements>
                 <converters>
                     <converter name="background_images" component="Magento_PageBuilder/js/mass-converter/background-images">

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

@@ -6,7 +6,7 @@
 -->
 
 <div class="pagebuilder-column-group pagebuilder-content-type-affordance pagebuilder-content-type pagebuilder-affordance-column-group"
-     ko-style="getStyle(data.main, ['marginTop', 'marginBottom', 'marginLeft', 'marginRight', 'width', 'alignSelf', 'minHeight'])"
+     ko-style="Object.assign(data.container.style, getStyle(data.main, ['marginTop', 'marginBottom', 'marginLeft', 'marginRight', 'width', 'alignSelf', 'minHeight']))"
      event="{ mouseover: onMouseOver, mouseout: onMouseOut }, mouseoverBubble: false"
      css="Object.assign(data.main.css(), {'empty-container': $parent.children().length == 0})"
      attr="data.main.attributes">