element-hq / element-hq/element-web

White flash while loading the page [Dark Mode]

Open
#28,333 14 comments 1 reaction 0 assignees View on GitHub
A-Appearance O-Frequent S-Tolerable T-Defect
Dominant language
TypeScript
Stars
13.5k
Forks
2.8k
PR merge metrics
PR metrics pending

Description

### Steps to reproduce

1. I have dark mode enabled in the system and "Match System" mode in app.element.io.
2. I visit the page https://app.element.io/

### Outcome

#### What did you expect?
3. I expected to see a dark page before the app.element.io interface loads.

The page should detect the dark mode in CSS, even before the interface loads, and set a dark background during loading.

Alternatively, a cookie from the server should contain information about the user's account preference from the first response from the page.

So, a simple CSS needs to be included already on the loading screen, still in the basic skeleton of the page, in the initial HTML file (template file).

#### What happened instead?
3. I see a completely white page before the app.element.io interface loads.

Of course, this is not the fault of the web browser, as Firefox has a dark blank page in dark mode.

### Operating system

Arch Linux with Cinnamon and GNOME apps

### Browser information

Firefox 130.0 (64 bity)

### URL for webapp

app.element.io

### Application version

1.11.83

### Homeserver

matrix.org

### Will you send logs?

No

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.