Fix blurhash visible under transparent img (#721)
This commit is contained in:
parent
542ac4f4e1
commit
728c5434bb
1 changed files with 3 additions and 2 deletions
|
@ -158,6 +158,7 @@ function Image({
|
|||
name, width, height, link, file, type, blurhash,
|
||||
}) {
|
||||
const [url, setUrl] = useState(null);
|
||||
const [blur, setBlur] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
let unmounted = false;
|
||||
|
@ -176,8 +177,8 @@ function Image({
|
|||
<div className="file-container">
|
||||
<FileHeader name={name} link={url || link} type={type} external />
|
||||
<div style={{ height: width !== null ? getNativeHeight(width, height) : 'unset' }} className="image-container">
|
||||
{ blurhash && <BlurhashCanvas hash={blurhash} punch={1} />}
|
||||
{ url !== null && <img src={url || link} alt={name} />}
|
||||
{ blurhash && blur && <BlurhashCanvas hash={blurhash} punch={1} />}
|
||||
{ url !== null && <img onLoad={() => setBlur(false)} src={url || link} alt={name} />}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue