PB-378: Full height Banner

Author: omiroshnichenko

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

@@ -50,7 +50,7 @@
                         <style name="border_width" source="border_width" converter="Magento_PageBuilder/js/converter/style/border-width"/>
                         <style name="border_radius" source="border_radius" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
                         <style name="padding" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings"/>
-                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
+                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/min-height"/>
                         <style name="text_align" source="text_align"/>
                         <attribute name="background_images" source="data-background-images"/>
                     </element>
@@ -115,7 +115,7 @@
                         <style name="border_width" source="border_width" converter="Magento_PageBuilder/js/converter/style/border-width"/>
                         <style name="border_radius" source="border_radius" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
                         <style name="padding" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings"/>
-                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
+                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/min-height"/>
                         <style name="text_align" source="text_align"/>
                         <attribute name="background_images" source="data-background-images"/>
                     </element>
@@ -180,7 +180,7 @@
                         <style name="border_width" source="border_width" converter="Magento_PageBuilder/js/converter/style/border-width"/>
                         <style name="border_radius" source="border_radius" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
                         <style name="padding" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings"/>
-                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
+                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/min-height"/>
                         <style name="text_align" source="text_align"/>
                         <attribute name="background_images" source="data-background-images"/>
                     </element>
@@ -250,7 +250,7 @@
                     </element>
                     <element name="overlay">
                         <style name="border_radius" source="border_radius" converter="Magento_PageBuilder/js/converter/style/overlay-border-radius" persistence_mode="write"/>
-                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
+                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/min-height"/>
                         <style name="overlay_color" source="background_color" converter="Magento_PageBuilder/js/content-type/banner/converter/style/overlay-background-color" persistence_mode="write"/>
                         <style name="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings"/>
                         <attribute name="overlay_color_attribute" storage_key="overlay_color" source="data-overlay-color" converter="Magento_PageBuilder/js/content-type/banner/converter/attribute/overlay-color"/>

app/code/Magento/PageBuilder/view/adminhtml/ui_component/pagebuilder_banner_form.xml

@@ -67,21 +67,14 @@
             </formElements>
         </field>
         <field name="min_height" sortOrder="20" formElement="input">
-            <argument name="data" xsi:type="array">
-                <item name="config" xsi:type="array">
-                    <item name="default" xsi:type="number">300</item>
-                </item>
-            </argument>
             <settings>
                 <label translate="true">Minimum Height</label>
+                <notice translate="true">Minimum height can be a single number with any valid CSS unit (50px, 50%, 50em, 50vh) or a calculation (50% + 50px).</notice>
                 <additionalClasses>
-                    <class name="admin__field-small">true</class>
+                    <class name="admin__field-medium">true</class>
                 </additionalClasses>
-                <addAfter translate="true">px</addAfter>
-                <dataType>text</dataType>
-                <dataScope>min_height</dataScope>
                 <validation>
-                    <rule name="validate-number" xsi:type="boolean">true</rule>
+                    <rule name="validate-calc" xsi:type="boolean">true</rule>
                 </validation>
             </settings>
         </field>