MC-3571: Implement overlay for MC-1405

- Refactored overlay implementation to not add additional elements

Author: nathanjosiah

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

@@ -21,19 +21,24 @@
             font-weight: lighter;
         }
     }
-    .pagebuilder-block-overlay {
-        -moz-transition: background-color 500ms ease;
-        -o-transition: background-color 500ms ease;
-        -webkit-transition: background-color 500ms ease;
-        height: 100%;
-        opacity: .7;
-        position: absolute;
-        transition: background-color 500ms ease;
-        width: 100%;
-        z-index: 10;
+    > div:first-child {
+        &:before {
+            content: '';
+            height: 100%;
+            opacity: .7;
+            position: absolute;
+            -moz-transition: background-color 500ms ease;
+            -o-transition: background-color 500ms ease;
+            -webkit-transition: background-color 500ms ease;
+            transition: background-color 500ms ease;
+            width: 100%;
+            z-index: 10;
+        }
 
         &:hover {
-            background-color: @color-gray98;
+            &:before {
+                background-color: @color-gray98;
+            }
         }
     }
     .rendered-content {

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

@@ -7,12 +7,9 @@
 
 <div class="pagebuilder-content-type pagebuilder-block" event="{ mouseover: onMouseOver, mouseout: onMouseOut }, mouseoverBubble: false">
     <div attr="data.main.attributes" ko-style="data.main.style" css="data.main.css">
-        <div class="pagebuilder-block-wrapper">
-            <div class="pagebuilder-block-overlay"></div>
-            <div if="displayPreview" class="rendered-content" html="data.main.html" afterRender="initializeWidgets"></div>
-            <div ifnot="displayPreview" class="pagebuilder-block-placeholder">
-                <span class="placeholder-text" text="placeholderText"/>
-            </div>
+        <div if="displayPreview" class="rendered-content" html="data.main.html" afterRender="initializeWidgets"></div>
+        <div ifnot="displayPreview" class="pagebuilder-block-placeholder">
+            <span class="placeholder-text" text="placeholderText"/>
         </div>
     </div>
     <div data-role="spinner"