search

lxndrblz / anatole

Anatole is a minimalistic two-column theme for Hugo.
https://themes.gohugo.io/themes/anatole/
MIT License
651 stars 363 forks source link

A brief flash of light theme when changing pages in dark mode #333

Closed vinhphm closed 1 year ago

vinhphm commented 2 years ago

Hi, firstly, thank you so much for your work on this incredible theme. Here is something I know notice during using the theme.

Describe the bug When the page is in dark mode, changing to another page of the website could cause a brief flash of light theme before it set back to dark. It's like the flash light of a camera.

To Reproduce Steps to reproduce the behavior:

  1. Without the theme settings in config.toml, go to the website.
  2. Set the theme to dark if it's not in dark mode already.
  3. Click to access other pages like "Posts", "Portfolio", "About",...
  4. See error

Expected behavior The transition should be smooth and not flash a light theme appearance.

Screenshots

Screen Shot 2022-03-20 at 6 52 03 PM

Desktop (please complete the following information):

Additional context

lxndrblz commented 2 years ago

@vinhphm Thanks for your report. Would you mind recording a short video that displays the issues?

vinhphm commented 2 years ago

@lxndrblz Sure. I don’t have a computer right now but here is how it happens on mobile:

https://user-images.githubusercontent.com/75784849/159194536-c8b86d83-8eef-4e6b-8ad1-0a405bfeb683.MOV

lxndrblz commented 2 years ago

@vinhphm Thanks for the video. I will need to investigate if there is a way this brief flicker good be resolved.

Sohn123 commented 1 year ago

I had the same issue and I resolved it with the following post. Instead of applying the theme class to the body of the document, apply it to the HTML tag directly. This way the theme can be set before the initial render and there is no white flash. If I have time, I'll refactor my code and open a PR the next days.