From 7e8f3fb598966e5a7bca3dfab3b24594d726666b Mon Sep 17 00:00:00 2001 From: Andrej Gorovoj Date: Thu, 24 Oct 2019 12:58:01 +0100 Subject: [PATCH 1/3] adjsut turnary --- src/components/LazyLoadImage.jsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/LazyLoadImage.jsx b/src/components/LazyLoadImage.jsx index 56cb826..0532940 100644 --- a/src/components/LazyLoadImage.jsx +++ b/src/components/LazyLoadImage.jsx @@ -73,8 +73,8 @@ class LazyLoadImage extends React.Component { className={wrapperClassName + ' lazy-load-image-background ' + effect + loadedClassName} style={{ - backgroundImage: loaded ? '' : 'url( ' + placeholderSrc + ')', - backgroundSize: loaded ? '' : '100% 100%', + backgroundImage: loaded ? '' : (placeholderSrc ? 'url( ' + placeholderSrc + ')' : ''), + backgroundSize: loaded ? '' : (placeholderSrc ? '100% 100%' : ''), color: 'transparent', display: 'inline-block', height: height, @@ -120,7 +120,7 @@ LazyLoadImage.defaultProps = { delayMethod: 'throttle', delayTime: 300, effect: '', - placeholderSrc: '', + placeholderSrc: null, threshold: 100, useIntersectionObserver: true, visibleByDefault: false, From aaa71e5759d59d031f8a3b541e294383922cb042 Mon Sep 17 00:00:00 2001 From: Andrej Gorovoj Date: Sat, 9 Nov 2019 21:57:07 +0000 Subject: [PATCH 2/3] make nested turnary more readable --- src/components/LazyLoadImage.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/LazyLoadImage.jsx b/src/components/LazyLoadImage.jsx index 0532940..471e18e 100644 --- a/src/components/LazyLoadImage.jsx +++ b/src/components/LazyLoadImage.jsx @@ -73,8 +73,8 @@ class LazyLoadImage extends React.Component { className={wrapperClassName + ' lazy-load-image-background ' + effect + loadedClassName} style={{ - backgroundImage: loaded ? '' : (placeholderSrc ? 'url( ' + placeholderSrc + ')' : ''), - backgroundSize: loaded ? '' : (placeholderSrc ? '100% 100%' : ''), + backgroundImage: loaded || !placeholderSrc ? '' : 'url( ' + placeholderSrc + ')', + backgroundSize: loaded || !placeholderSrc ? '' : '100% 100%, color: 'transparent', display: 'inline-block', height: height, From 0e6d7ef3253a0195d408cfeceb9300eaf5d78fd6 Mon Sep 17 00:00:00 2001 From: Andrej Gorovoj Date: Sat, 9 Nov 2019 22:01:14 +0000 Subject: [PATCH 3/3] this is what happens when you edit directly inside github.. --- src/components/LazyLoadImage.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/LazyLoadImage.jsx b/src/components/LazyLoadImage.jsx index 471e18e..a59eda2 100644 --- a/src/components/LazyLoadImage.jsx +++ b/src/components/LazyLoadImage.jsx @@ -73,8 +73,8 @@ class LazyLoadImage extends React.Component { className={wrapperClassName + ' lazy-load-image-background ' + effect + loadedClassName} style={{ - backgroundImage: loaded || !placeholderSrc ? '' : 'url( ' + placeholderSrc + ')', - backgroundSize: loaded || !placeholderSrc ? '' : '100% 100%, + backgroundImage: loaded || !placeholderSrc ? '' : `url(${placeholderSrc})`, + backgroundSize: loaded || !placeholderSrc ? '' : '100% 100%', color: 'transparent', display: 'inline-block', height: height,