Loading screen in dark mode

9 replies · opened Sep 23, 2023

Eenero_55Sep 23, 2023

I am using the dark theme, but the loading screen is still the standard white one. Shouldn't the loading screen also be dark in the dark theme?

SSemicolon WebSTAFFSep 24, 2023

Hello,

The Page Loading is Dark on the Dark Theme and it appears to be working fine for us on the Live Previews: https://canvastemplate.com/index-dark.html . Consider checking this in the Customizer Panel, by clicking on the different Loading Options.

Additionally, can you please provide us with a Live URL so that we can check out the exact issue and provide you with more accurate assistance on this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

Eenero_55Sep 24, 2023

I checked a bit closer and I can see that the loader page (with the loader animation) is indeed dark, but there is something else that causes the page to flash white just after the loader page but before the actual content is showed. What is that?

Unfortunately, the site is still under development and I therefore do not have a url to share.

EDIT: applied throttling on the page from the Chrome dev tool and I saw that the white flash is the screen that is faded out once the loader page has finished. So, is there a way to change that fade-out screen color? In other words: the loading screen is dark, but after that, when the page content is showed, the screen that fades out is white, causing a white flash during the fade-out. Where can the css to the "fade-out" be found?

SSemicolon WebSTAFFSep 25, 2023

Hello,

We have identified the issue and it is due to a minor bug in the Body Background Color Codes. We will release an Update shortly to address this. Meanwhile, you can fix this yourself by finding the following CSS Code in the style.css File:
[ch_pre type="css"]--cnvs-body-bg-boxed: var(--cnvs-contrast-0);[/ch_pre]

and replace it with:
[ch_pre type="css"]--cnvs-body-bg-boxed: var(--cnvs-body-bg);[/ch_pre]

This will definitely fix the issue. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Eenero_55Sep 25, 2023

I've done some more digging and I have found that it is the fade-out animation of the #wrapper element that has the "wrong" color. Where can I change that color?

SSemicolon WebSTAFFSep 25, 2023

Hello,

Please use the Codes provided above and we assure you that this issue will be resolved. No other Codes requires modifications. Thanks for your Patience.

Let us know if we can help you with anything else or if you find any further issues with Canvas.

Eenero_55Sep 25, 2023

Ok, never mind my previous post.

We are using Canvas version 5.7 and we have never done an update. Do you have some kind of documentation of how to do an update? What files do we need to replace?

SSemicolon WebSTAFFSep 25, 2023

Hello,

We are using Canvas version 5.7

Ohh! The above codes will not work in this case and we will need a Live URL so that we can check out the exact codes causing this and provide you with more accurate assistance on this. Thanks for your Patience.

Updated should be done based on the Changelogs provided: https://docs.semicolonweb.com/docs/changelog/ but since you are using v5.7, you will likely need to Update from Scratch since it is more than 3 Years old and we have changed the codes significantly.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

Eenero_55Sep 25, 2023

I understand.

As mentioned, I cannot provide a live url at the moment since the site is under development. Please let me come back with a new ticket once we have opened our site again.

This ticket can now be closed.

SSemicolon WebSTAFFSep 26, 2023

Hello,

Sure. Please let us know if you face any further issues. Additionally, we are keeping this Ticket open, so you can simply add new replies relating to this issue here. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard