MC-3479: Remove Accordion

- add back getBackgroundStyles and getPaddingStyles for slide

Author: krissyhiserote

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/slide/preview.js

@@ -46,6 +46,69 @@ export default class Preview extends BasePreview {
         });
     }
 
+    /**
+     * Get the background wrapper attributes for the preview
+     *
+     * @returns {any}
+     */
+    public getBackgroundStyles() {
+        const desktopStyles = this.data.desktop_image.style();
+        return {
+            ...desktopStyles,
+            paddingBottom: "",
+            paddingLeft: "",
+            paddingRight: "",
+            paddingTop: "",
+            borderStyle: "none",
+            borderRadius: "0px",
+        };
+    }
+
+    /**
+     * Get the slide wrapper attributes for the preview
+     *
+     * @returns {any}
+     */
+    public getPaddingStyles() {
+        const previewData = this.previewData;
+        const appearance = this.data.main.attributes()["data-appearance"];
+        const paddingData: any =  {};
+        switch (appearance) {
+            case "collage-centered":
+                paddingData.paddingLeft = `calc(25% + ${this.data.desktop_image.style().paddingLeft})`;
+                paddingData.paddingRight = `calc(25% + ${this.data.desktop_image.style().paddingRight})`;
+                break;
+            case "collage-left":
+                paddingData.paddingRight = `calc(50% + ${this.data.desktop_image.style().paddingRight})`;
+                break;
+            case "collage-right":
+                paddingData.paddingLeft = `calc(50% + ${this.data.desktop_image.style().paddingLeft})`;
+                break;
+            default:
+                break;
+        }
+        let backgroundImage: string = "none";
+        if (previewData.background_image() && previewData.background_image() !== "" &&
+            previewData.background_image() !== undefined &&
+            previewData.background_image()[0] !== undefined) {
+            backgroundImage = "url(" + previewData.background_image()[0].url + ")";
+        }
+        const styles =  {
+            backgroundImage,
+            backgroundSize: previewData.background_size(),
+            minHeight: previewData.min_height() ? previewData.min_height() + "px" : "300px",
+            overflow: "hidden",
+            paddingBottom: this.data.desktop_image.style().paddingBottom || "",
+            paddingLeft: this.data.desktop_image.style().paddingLeft || "",
+            paddingRight: this.data.desktop_image.style().paddingRight || "",
+            paddingTop: this.data.desktop_image.style().paddingTop || "",
+        };
+        return {
+            ...styles,
+            ...paddingData,
+        };
+    }
+
     /**
      * Set state based on overlay mouseover event for the preview
      */