@micromag/screen-image 0.3.230 → 0.3.233

package/assets/css/styles.css

@@ -1 +1 @@
-.micromag-screen-image-container .micromag-screen-image-image{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-image-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-image-disabled.micromag-screen-image-container{overflow:hidden;pointer-events:none}.micromag-screen-image-hidden.micromag-screen-image-container{display:none;visibility:hidden}.micromag-screen-image-placeholder.micromag-screen-image-container .micromag-screen-image-content{position:relative;padding:6px}.micromag-screen-image-container .micromag-screen-image-emptyImage,.micromag-screen-image-container .micromag-screen-image-emptyLegend,.micromag-screen-image-container .micromag-screen-image-emptyText,.micromag-screen-image-container .micromag-screen-image-emptyTitle{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-image-container .micromag-screen-image-content{position:relative;height:100%}.micromag-screen-image-container .micromag-screen-image-emptyImage,.micromag-screen-image-container .micromag-screen-image-emptyLegend,.micromag-screen-image-container .micromag-screen-image-emptyText,.micromag-screen-image-container .micromag-screen-image-emptyTitle{width:100%;margin:10px auto}.micromag-screen-image-container .micromag-screen-image-emptyImage{height:100%}.micromag-screen-image-container .micromag-screen-image-emptyTitle{height:100px}.micromag-screen-image-container .micromag-screen-image-emptyText{height:80px}.micromag-screen-image-container .micromag-screen-image-emptyLegend{height:50px}.micromag-screen-image-container .micromag-screen-image-imageContainer{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-screen-image-container .micromag-screen-image-placeholderImage{height:100%}.micromag-screen-image-container.micromag-screen-image-isPlaceholder .micromag-screen-image-layout{padding:10px}.micromag-screen-image-container.micromag-screen-image-isCard .micromag-screen-image-placeholderImage{margin:-10px -10px 0}.micromag-screen-image-container.micromag-screen-image-isCardReverse .micromag-screen-image-placeholderImage{margin:10px -10px 0}.micromag-screen-image-container.micromag-screen-image-isCardReverse .micromag-screen-image-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-image-container.micromag-screen-image-isFullscreen .micromag-screen-image-layout{padding:0}.micromag-screen-image-container.micromag-screen-image-isFullscreen .micromag-screen-image-callToAction{position:absolute;bottom:0;width:100%;margin-top:0}
+.micromag-screen-image-container .micromag-screen-image-background,.micromag-screen-image-container .micromag-screen-image-image{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-image-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-image-disabled.micromag-screen-image-container{overflow:hidden;pointer-events:none}.micromag-screen-image-hidden.micromag-screen-image-container{display:none;visibility:hidden}.micromag-screen-image-placeholder.micromag-screen-image-container .micromag-screen-image-content{position:relative;padding:6px}.micromag-screen-image-container .micromag-screen-image-emptyImage,.micromag-screen-image-container .micromag-screen-image-emptyLegend,.micromag-screen-image-container .micromag-screen-image-emptyText,.micromag-screen-image-container .micromag-screen-image-emptyTitle{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-image-container .micromag-screen-image-background{z-index:0}.micromag-screen-image-container .micromag-screen-image-content{position:relative;z-index:1;height:100%}.micromag-screen-image-container .micromag-screen-image-emptyImage,.micromag-screen-image-container .micromag-screen-image-emptyLegend,.micromag-screen-image-container .micromag-screen-image-emptyText,.micromag-screen-image-container .micromag-screen-image-emptyTitle{width:100%;margin:10px auto}.micromag-screen-image-container .micromag-screen-image-emptyImage{height:100%}.micromag-screen-image-container .micromag-screen-image-emptyTitle{height:100px}.micromag-screen-image-container .micromag-screen-image-emptyText{height:80px}.micromag-screen-image-container .micromag-screen-image-emptyLegend{height:50px}.micromag-screen-image-container .micromag-screen-image-imageContainer{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-screen-image-container .micromag-screen-image-placeholderImage{height:100%}.micromag-screen-image-container.micromag-screen-image-isPlaceholder .micromag-screen-image-layout{padding:10px}.micromag-screen-image-container.micromag-screen-image-isCard .micromag-screen-image-placeholderImage{margin:-10px -10px 0}.micromag-screen-image-container.micromag-screen-image-isCardReverse .micromag-screen-image-placeholderImage{margin:10px -10px 0}.micromag-screen-image-container.micromag-screen-image-isCardReverse .micromag-screen-image-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-image-container.micromag-screen-image-isFullscreen .micromag-screen-image-layout{padding:0}.micromag-screen-image-container.micromag-screen-image-isFullscreen .micromag-screen-image-callToAction{position:absolute;bottom:0;width:100%;margin-top:0}

package/es/index.js

@@ -21,7 +21,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import { Image, Heading1, Text as Text$1, Container as Container$1 } from '@micromag/transforms/apple-news';
 
-var styles = {"container":"micromag-screen-image-container","image":"micromag-screen-image-image","disabled":"micromag-screen-image-disabled","hidden":"micromag-screen-image-hidden","placeholder":"micromag-screen-image-placeholder","content":"micromag-screen-image-content","emptyImage":"micromag-screen-image-emptyImage","emptyLegend":"micromag-screen-image-emptyLegend","emptyText":"micromag-screen-image-emptyText","emptyTitle":"micromag-screen-image-emptyTitle","imageContainer":"micromag-screen-image-imageContainer","placeholderImage":"micromag-screen-image-placeholderImage","isPlaceholder":"micromag-screen-image-isPlaceholder","layout":"micromag-screen-image-layout","isCard":"micromag-screen-image-isCard","isCardReverse":"micromag-screen-image-isCardReverse","callToAction":"micromag-screen-image-callToAction","isFullscreen":"micromag-screen-image-isFullscreen"};
+var styles = {"container":"micromag-screen-image-container","background":"micromag-screen-image-background","image":"micromag-screen-image-image","disabled":"micromag-screen-image-disabled","hidden":"micromag-screen-image-hidden","placeholder":"micromag-screen-image-placeholder","content":"micromag-screen-image-content","emptyImage":"micromag-screen-image-emptyImage","emptyLegend":"micromag-screen-image-emptyLegend","emptyText":"micromag-screen-image-emptyText","emptyTitle":"micromag-screen-image-emptyTitle","imageContainer":"micromag-screen-image-imageContainer","placeholderImage":"micromag-screen-image-placeholderImage","isPlaceholder":"micromag-screen-image-isPlaceholder","layout":"micromag-screen-image-layout","isCard":"micromag-screen-image-isCard","isCardReverse":"micromag-screen-image-isCardReverse","callToAction":"micromag-screen-image-callToAction","isFullscreen":"micromag-screen-image-isFullscreen"};
 
 var propTypes = {
   layout: PropTypes.oneOf(['normal', 'fullscreen', 'reverse', 'card', 'card-reverse', 'title-top']),
@@ -295,19 +295,10 @@ var ImageScreen = function ImageScreen(_ref) {
   return /*#__PURE__*/React.createElement("div", {
     className: classNames([styles.container, (_ref2 = {}, _defineProperty(_ref2, className, className !== null), _defineProperty(_ref2, styles.isReversed, isReversed), _defineProperty(_ref2, styles.isPlaceholder, isPlaceholder), _defineProperty(_ref2, styles.isCard, isCard), _defineProperty(_ref2, styles.isCardReverse, isCardReverse), _defineProperty(_ref2, styles.isFullscreen, isFullscreen), _ref2)]),
     "data-screen-ready": ready
-  }, !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
-    background: background,
+  }, /*#__PURE__*/React.createElement(Container, {
     width: width,
     height: height,
-    resolution: resolution,
-    playing: backgroundPlaying,
-    muted: muted,
-    shouldLoad: mediaShouldLoad,
-    mediaRef: mediaRef,
-    withoutVideo: isPreview
-  }) : null, /*#__PURE__*/React.createElement(Container, {
-    width: width,
-    height: height
+    className: styles.content
   }, /*#__PURE__*/React.createElement(Layout, {
     className: styles.layout,
     fullscreen: true,
@@ -316,7 +307,18 @@ var ImageScreen = function ImageScreen(_ref) {
       paddingTop: paddingTop,
       paddingBottom: paddingBottom
     } : null
-  }, items)));
+  }, items)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
+    background: background,
+    width: width,
+    height: height,
+    resolution: resolution,
+    playing: backgroundPlaying,
+    muted: muted,
+    shouldLoad: mediaShouldLoad,
+    mediaRef: mediaRef,
+    withoutVideo: isPreview,
+    className: styles.background
+  }) : null);
 };
 
 ImageScreen.propTypes = propTypes;

package/lib/index.js

@@ -43,7 +43,7 @@ var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
 var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
 var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
 
-var styles = {"container":"micromag-screen-image-container","image":"micromag-screen-image-image","disabled":"micromag-screen-image-disabled","hidden":"micromag-screen-image-hidden","placeholder":"micromag-screen-image-placeholder","content":"micromag-screen-image-content","emptyImage":"micromag-screen-image-emptyImage","emptyLegend":"micromag-screen-image-emptyLegend","emptyText":"micromag-screen-image-emptyText","emptyTitle":"micromag-screen-image-emptyTitle","imageContainer":"micromag-screen-image-imageContainer","placeholderImage":"micromag-screen-image-placeholderImage","isPlaceholder":"micromag-screen-image-isPlaceholder","layout":"micromag-screen-image-layout","isCard":"micromag-screen-image-isCard","isCardReverse":"micromag-screen-image-isCardReverse","callToAction":"micromag-screen-image-callToAction","isFullscreen":"micromag-screen-image-isFullscreen"};
+var styles = {"container":"micromag-screen-image-container","background":"micromag-screen-image-background","image":"micromag-screen-image-image","disabled":"micromag-screen-image-disabled","hidden":"micromag-screen-image-hidden","placeholder":"micromag-screen-image-placeholder","content":"micromag-screen-image-content","emptyImage":"micromag-screen-image-emptyImage","emptyLegend":"micromag-screen-image-emptyLegend","emptyText":"micromag-screen-image-emptyText","emptyTitle":"micromag-screen-image-emptyTitle","imageContainer":"micromag-screen-image-imageContainer","placeholderImage":"micromag-screen-image-placeholderImage","isPlaceholder":"micromag-screen-image-isPlaceholder","layout":"micromag-screen-image-layout","isCard":"micromag-screen-image-isCard","isCardReverse":"micromag-screen-image-isCardReverse","callToAction":"micromag-screen-image-callToAction","isFullscreen":"micromag-screen-image-isFullscreen"};
 
 var propTypes = {
   layout: PropTypes__default["default"].oneOf(['normal', 'fullscreen', 'reverse', 'card', 'card-reverse', 'title-top']),
@@ -317,19 +317,10 @@ var ImageScreen = function ImageScreen(_ref) {
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classNames__default["default"]([styles.container, (_ref2 = {}, _defineProperty__default["default"](_ref2, className, className !== null), _defineProperty__default["default"](_ref2, styles.isReversed, isReversed), _defineProperty__default["default"](_ref2, styles.isPlaceholder, isPlaceholder), _defineProperty__default["default"](_ref2, styles.isCard, isCard), _defineProperty__default["default"](_ref2, styles.isCardReverse, isCardReverse), _defineProperty__default["default"](_ref2, styles.isFullscreen, isFullscreen), _ref2)]),
     "data-screen-ready": ready
-  }, !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
-    background: background,
+  }, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
     width: width,
     height: height,
-    resolution: resolution,
-    playing: backgroundPlaying,
-    muted: muted,
-    shouldLoad: mediaShouldLoad,
-    mediaRef: mediaRef,
-    withoutVideo: isPreview
-  }) : null, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
-    width: width,
-    height: height
+    className: styles.content
   }, /*#__PURE__*/React__default["default"].createElement(Layout__default["default"], {
     className: styles.layout,
     fullscreen: true,
@@ -338,7 +329,18 @@ var ImageScreen = function ImageScreen(_ref) {
       paddingTop: paddingTop,
       paddingBottom: paddingBottom
     } : null
-  }, items)));
+  }, items)), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
+    background: background,
+    width: width,
+    height: height,
+    resolution: resolution,
+    playing: backgroundPlaying,
+    muted: muted,
+    shouldLoad: mediaShouldLoad,
+    mediaRef: mediaRef,
+    withoutVideo: isPreview,
+    className: styles.background
+  }) : null);
 };
 
 ImageScreen.propTypes = propTypes;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/screen-image",
-    "version": "0.3.230",
+    "version": "0.3.233",
     "description": "",
     "keywords": [
         "javascript"
@@ -49,15 +49,15 @@
     },
     "dependencies": {
         "@babel/runtime": "^7.13.10",
-        "@micromag/core": "^0.3.230",
-        "@micromag/element-background": "^0.3.230",
-        "@micromag/element-call-to-action": "^0.3.230",
-        "@micromag/element-container": "^0.3.230",
-        "@micromag/element-heading": "^0.3.230",
-        "@micromag/element-layout": "^0.3.230",
-        "@micromag/element-text": "^0.3.230",
-        "@micromag/element-visual": "^0.3.230",
-        "@micromag/transforms": "^0.3.230",
+        "@micromag/core": "^0.3.233",
+        "@micromag/element-background": "^0.3.233",
+        "@micromag/element-call-to-action": "^0.3.233",
+        "@micromag/element-container": "^0.3.233",
+        "@micromag/element-heading": "^0.3.233",
+        "@micromag/element-layout": "^0.3.233",
+        "@micromag/element-text": "^0.3.233",
+        "@micromag/element-visual": "^0.3.233",
+        "@micromag/transforms": "^0.3.233",
         "classnames": "^2.2.6",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
@@ -67,5 +67,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "e69201dc3a0c466c0140d3f9d382c9873b1cead9"
+    "gitHead": "1849b8fc36ca5b6c6a13045db441495bba22184f"
 }