MC-3870: Background does not conform to border radius for banner, image, contained row & video

Address CR feedback

Author: danmooney2

app/code/Magento/PageBuilder/view/adminhtml/web/css/source/content-type/banner/_default.less

@@ -15,6 +15,7 @@
         -moz-transition: background-color 500ms ease;
         -o-transition: background-color 500ms ease;
         -webkit-transition: background-color 500ms ease;
+        border-radius: inherit;
         transition: background-color 500ms ease;
     }
 

app/code/Magento/PageBuilder/view/adminhtml/web/css/source/content-type/image/_default.less

@@ -10,31 +10,34 @@
 .pagebuilder-image {
     border: 1px solid transparent;
     width: 100%;
+}
 
-    figure {
-        box-sizing: border-box;
-        margin: 0;
+[data-role="image"] {
+    box-sizing: border-box;
+    margin: 0;
 
-        div.pagebuilder-image-empty-preview {
-            align-items: center;
-            background: @color-white-fog;
-            display: flex;
-            height: 300px;
-            justify-content: center;
-            width: 100%;
+    div.pagebuilder-image-empty-preview {
+        align-items: center;
+        background: @color-white-fog;
+        border-radius: inherit;
+        display: flex;
+        height: 300px;
+        justify-content: center;
+        width: 100%;
 
-            span {
-                color: @color-gray65-lighten;
-            }
+        span {
+            color: @color-gray65-lighten;
         }
+    }
 
-        figcaption {
-            padding: 15px 0;
-            word-wrap: break-word;
-        }
+    figcaption {
+        padding: 15px 0;
+        word-wrap: break-word;
+    }
 
-        .preview-image {
-            border-radius: inherit;
-        }
+    .preview-image,
+    [data-element="link"],
+    [data-element="link"] img {
+        border-radius: inherit;
     }
 }

app/code/Magento/PageBuilder/view/adminhtml/web/css/source/form/element/uploader/preview/_image.less

@@ -14,6 +14,7 @@
 
 .pagebuilder-image-uploader-container {
     align-items: center;
+    border-radius: inherit;
     display: flex;
     visibility: hidden;
 

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

@@ -6,7 +6,7 @@
 -->
 
 <div attr="data.main.attributes" ko-style="data.main.style" css="data.main.css">
-    <div class="pagebuilder-video-wrapper" attr="data.wrapper.attributes" ko-style="data.wrapper.style" css="data.wrapper.css">
+    <div class="pagebuilder-video-wrapper" attr="data.wrapper.attributes" ko-style="Object.assign(data.wrapper.style(), {backgroundColor: data.wrapper.style().borderColor})" css="data.wrapper.css">
         <div class="pagebuilder-video-container" if="data.video.attributes().src">
             <iframe frameborder="0" allowfullscreen attr="data.video.attributes"/>
         </div>

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

@@ -7,7 +7,7 @@
 
 <div class="pagebuilder-content-type pagebuilder-video" event="{ mouseover: onMouseOver, mouseout: onMouseOut }, mouseoverBubble: false">
     <div attr="data.main.attributes" ko-style="data.main.style" css="data.main.css">
-        <div class="pagebuilder-video-wrapper" attr="data.wrapper.attributes" ko-style="data.wrapper.style" css="data.wrapper.css">
+        <div class="pagebuilder-video-wrapper" attr="data.wrapper.attributes" ko-style="Object.assign(data.wrapper.style(), {backgroundColor: data.wrapper.style().borderColor})" css="data.wrapper.css">
             <div class="pagebuilder-video-container">
                 <iframe frameborder="0" allowfullscreen attr="data.video.attributes"/>
                 <i class="icon-pagebuilder-video pagebuilder-video-placeholder" ifnot="data.video.attributes().src"/>

app/code/Magento/PageBuilder/view/frontend/web/css/source/content-type/banner/_default.less

@@ -33,6 +33,7 @@
         -moz-transition: background-color 500ms ease;
         -o-transition: background-color 500ms ease;
         -webkit-transition: background-color 500ms ease;
+        border-radius: inherit;
         box-sizing: border-box;
         transition: background-color 500ms ease;
 

app/code/Magento/PageBuilder/view/frontend/web/css/source/content-type/slide/_default.less

@@ -27,13 +27,15 @@
 }
 
 .pagebuilder-slide-wrapper {
+    border-radius: inherit;
     box-sizing: border-box;
     word-break: break-all;
 
     .pagebuilder-overlay {
         -moz-transition: background-color 500ms ease;
         -o-transition: background-color 500ms ease;
         -webkit-transition: background-color 500ms ease;
+        border-radius: inherit;
         box-sizing: border-box;
         transition: background-color 500ms ease;