Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Image.svelte blur class img target #80

Open
meigo opened this issue Oct 26, 2020 · 1 comment
Open

Image.svelte blur class img target #80

meigo opened this issue Oct 26, 2020 · 1 comment

Comments

@meigo
Copy link
Contributor

meigo commented Oct 26, 2020

I'm a little bit confused about css blur class been set to final img element

...
  {#if blurhash}
	<canvas class="placeholder" use:decodeBlurhash width={blurhashSize.width} height={blurhashSize.height} />
  {:else}
	<img class="placeholder {placeholderClass}" {src} {alt} />
  {/if}
  <picture>
	<source type="image/webp" srcset="{srcsetWebp}" {sizes} />
	<source {srcset} {sizes} />
	<img
	  ...
	  class:blur
	  ...
	/>
  </picture>
...

Shouldn't it be on placeholder img for smoothing out the ugly pixelation?

@dikaio
Copy link
Contributor

dikaio commented Nov 12, 2020

I also was interested in this. The blur option is a nice addition but being that there's pixelation to the image it doesn't have the desired effect. imho the blur should have the same effect as gridsome's blur, example here.

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants