diff options
| author | Jean-Nicolas Veigel <art.jnveigel@gmail.com> | 2024-03-17 18:35:48 +0100 |
|---|---|---|
| committer | Louis Pilfold <louis@lpil.uk> | 2024-03-26 10:31:25 +0000 |
| commit | bf5e64da6c7f2e79d853b956d1842a1c45dae91b (patch) | |
| tree | 9a36065d287a77340550c6aed7a60a8fb900b430 /static | |
| parent | a2c2f131b42b75b70f730da20d9b1aba9be68be2 (diff) | |
| download | tour-bf5e64da6c7f2e79d853b956d1842a1c45dae91b.tar.gz tour-bf5e64da6c7f2e79d853b956d1842a1c45dae91b.zip | |
fix: FOUC on /everyting when on dark theme
Diffstat (limited to 'static')
| -rw-r--r-- | static/css/pages/lesson.css | 0 | ||||
| -rw-r--r-- | static/css/theme.css | 25 |
2 files changed, 25 insertions, 0 deletions
diff --git a/static/css/pages/lesson.css b/static/css/pages/lesson.css new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/static/css/pages/lesson.css diff --git a/static/css/theme.css b/static/css/theme.css index c098cfa..a85ccb1 100644 --- a/static/css/theme.css +++ b/static/css/theme.css @@ -52,3 +52,28 @@ html.theme-dark { --color-text-accent: var(--color-accent); color-scheme: dark; } + +/* Hide body while theme init is occurring (50ms) */ +html.theme-init body { + opacity: 0 +} + +/* +removes all transitions in the page during first theme render to avoid FOUC +(the theme-init class is removed from DOM 1 frame after the page content loads) +*/ +html.theme-init * { + transition: none !important; +} + +body { + opacity: 1; + transition: opacity 300ms ease-out 0s; +} + +html * { + transition-duration: 150ms, 300ms; + transition-property: color, background; + transition-timing-function: ease-out; + transition-delay: 0; +}
\ No newline at end of file |