All images will be displayed when switching images (including light and dark mode).

[huanyushi]

Checklist

• I have read and accepted the contributing guidelines.

How did you create the site?

Generated from chirpy-starter

Describe the bug

The image-switching feature was introduced in version 7.0.0.

When we specify images for both the light and dark modes separately within a post, we can switch to the next image using a button. However, it will display all images (regardless of whether they are for the light or dark mode) uniformly.

Steps To Reproduce

For example, if we have a post like

para1

![fig1](fig1-light.png){: .light}
![fig1](fig1-dark.png){: .dark}

para2

![fig2](fig2-light.png){: .light}
![fig2](fig2-dark.png){: .dark}

When we switch images using the button, the displayed image sequence is fig1-light.png, fig1-dark.png, fig2-light.png, fig2-dark.png.

Expected Behavior

I think that when switching images, only the images corresponding to the current mode are displayed. For example, when we are in light mode, the displayed image sequence is fig1-light.png, fig2-light.png.

Environment

• Ruby: 3.2.1
• Jekyll: 4.3.3
• Chirpy: 7.0.0

Anything else?

Nothing.

[cotes2020]

Sorry, I don't understand what the "switching image" is, could you please provide a screenshot to illustrate the problem?

[kungfux]

If I understand correctly, the issue is about glightbox and the ability to view all images by "switching" to the next/previous image in the gallery.

Here is a live example https://chirpy.cotes.page/posts/text-and-typography/#darklight-mode--shadow. The post contains images created specifically for light and dark themes. If you open an image and toggle to next/previous, you will see an image not for the current theme in the gallery.

[huanyushi]

Yes, what @kungfux said was exactly what I wanted to feedback on.

If you click an image on https://chirpy.cotes.page/posts/text-and-typography/#darklight-mode--shadow, you can see the next button,

If you click the button it will switch to the next image and you will see all images (regardless of whether they are for the light or dark mode).

[cotes2020]

I'm just keeping Glightbox's default behavior, to hide images that don't fit the theme mode, you may need to modify Glightbox configuration, or have Glightbox disable looping images, and just use its zoom.

Either way, you're welcome to submit a PR to help improve this!