Strange effect on images

[popescualinflorin]

Checklist

• I have read and accepted the contributing guidelines.

How did you create the site?

Built from jekyll-theme-chirpy

Description

hello

i used the code from "Text and Typography" to add images like "{: width="972" height="589" .w-75 .normal}"
but every image apper with somthing like this:
https://github.com/cotes2020/jekyll-theme-chirpy/assets/46263308/56324716-a335-493d-b8b9-bdeef0a5178f

there is a strange line that pass over the image

Operations you have already tried

I tested it on different post, re-downloaded the template, tested on different browser
On the HTML site i notice that class=" img-link w-50 right shimmer" removing shimmer was solving the problem, but I don't know how to solve it on all the posts

Anything else?

No response

[huanyushi]

The OP didn't offer any source code. The only thing I know is that when the link address of your image is wrong, it will always have this loading animation. So the OP should check whether the image address is wrong.

This animation effect is generally used to remind users that the page is loading images. The relevent settings can be seen here: shimmer. If you want to cancel this animation, you can add the following code to assets/css/jekyll-theme-chirpy.scss:

.shimmer::before{
  content:""
}

[popescualinflorin]

thanks a lot i fount the shimmer under _sass/addons/commons.scss and removed the part that you indicated and it solved the problem.
Thanks again

[huanyushi]

@popescualinflorin I think the best way is to overwrite the code of the original theme instead of deleting it. This will also make it easier to follow theme updates. As I said above, add code in assets/css/jekyll-theme-chirpy.scss may be a better choice:

.shimmer::before{
    content:""
}

(Just a suggestion...)