diff --git a/packages/gallery/src/components/item/imageItem.js b/packages/gallery/src/components/item/imageItem.js
index 9230464ba..96f279441 100644
--- a/packages/gallery/src/components/item/imageItem.js
+++ b/packages/gallery/src/components/item/imageItem.js
@@ -59,7 +59,7 @@ class ImageItem extends React.Component {
}
getImageContainer(imageRenderer, classNames, extraNodes) {
- const { imageDimensions, id, actions } = this.props;
+ const { id, actions } = this.props;
return (
{imageRenderer()}
{extraNodes}
@@ -115,7 +115,7 @@ class ImageItem extends React.Component {
settings && settings.imageProps && typeof settings.imageProps === 'function' ? settings.imageProps(id) : {};
// eslint-disable-next-line no-unused-vars
- const { marginLeft, marginTop, ...imageSizing } = imageDimensions;
+ const { marginLeft, marginTop } = imageDimensions;
const image = () => {
const imagesComponents = [];
@@ -150,7 +150,6 @@ class ImageItem extends React.Component {
key={'image_preload_blur-' + id}
src={createUrl(GALLERY_CONSTS.urlSizes.RESIZED, GALLERY_CONSTS.urlTypes.LOW_RES)}
style={{
- ...imageSizing,
...preloadStyles,
...blockDownloadStyles,
}}
@@ -166,7 +165,6 @@ class ImageItem extends React.Component {
key={'image_preload_main_color-' + id}
src={createUrl(GALLERY_CONSTS.urlSizes.PIXEL, GALLERY_CONSTS.urlTypes.HIGH_RES)}
style={{
- ...imageSizing,
...preloadStyles,
...blockDownloadStyles,
}}
@@ -199,7 +197,6 @@ class ImageItem extends React.Component {
onLoad={this.handleHighResImageLoad}
loading={this.props.isPrerenderMode ? 'lazy' : 'eager'}
style={{
- ...imageSizing,
...blockDownloadStyles,
...(!shouldRenderHighResImages && preloadStyles),
}}
diff --git a/packages/gallery/src/components/item/itemView.js b/packages/gallery/src/components/item/itemView.js
index ebcd39920..109ab88d7 100644
--- a/packages/gallery/src/components/item/itemView.js
+++ b/packages/gallery/src/components/item/itemView.js
@@ -710,7 +710,6 @@ class ItemView extends React.Component {
getItemWrapperStyles() {
const { createUrl, options, style, type, offset } = this.props;
- const { height, width, innerWidth, innerHeight } = style;
const { innerTop, innerLeft } = offset;
let styles = {};
if (type === 'text') {
@@ -732,7 +731,6 @@ class ItemView extends React.Component {
styles = {
...styles,
background: `url(${createUrl(GALLERY_CONSTS.urlSizes.PIXEL, GALLERY_CONSTS.urlTypes.HIGH_RES)})`,
- backgroundSize: `${innerWidth}px ${innerHeight}px`,
backgroundRepeat: 'no-repeat',
backgroundPosition: `top ${innerTop}px left ${innerLeft}px`,
};
@@ -741,8 +739,6 @@ class ItemView extends React.Component {
if (options[optionsMap.behaviourParams.item.content.hoverAnimation] === TILT) {
styles['--tiltAngleValue'] = options[optionsMap.behaviourParams.item.content.tiltAngleValue];
}
- styles.height = height + 'px';
- styles.width = width + 'px';
styles.margin = -options[optionsMap.stylingParams.itemBorderWidth] + 'px';
return styles;
@@ -974,6 +970,7 @@ class ItemView extends React.Component {
this.props.options[optionsMap.layoutParams.info.placement],
this.props.idx
) && { float: 'right' }),
+ height: '100%',
}}
>
{!isItemWrapperEmpty && (