From d1ce184c7226f452d414ac59ecb3b3288bd70795 Mon Sep 17 00:00:00 2001 From: Kristóf Marussy Date: Sun, 15 May 2022 14:56:32 +0200 Subject: fix(renderer): reduce white flash on start MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit We inject a CSS file that applies the theme background color even before the javascript for the renderer is loaded. Signed-off-by: Kristóf Marussy --- packages/renderer/src/index.tsx | 1 + packages/renderer/src/style.css | 29 +++++++++++++++++++++++++++++ 2 files changed, 30 insertions(+) create mode 100644 packages/renderer/src/style.css (limited to 'packages') diff --git a/packages/renderer/src/index.tsx b/packages/renderer/src/index.tsx index 09b9b74..964494a 100644 --- a/packages/renderer/src/index.tsx +++ b/packages/renderer/src/index.tsx @@ -28,6 +28,7 @@ import { addDisposer } from 'mobx-state-tree'; import React, { Suspense, lazy } from 'react'; import { createRoot } from 'react-dom/client'; +import './style.css'; import Loading from './components/Loading'; import ThemeProvider from './components/ThemeProvider'; import { exposeToReduxDevtools, hotReload } from './devTools'; diff --git a/packages/renderer/src/style.css b/packages/renderer/src/style.css new file mode 100644 index 0000000..d0bf2fb --- /dev/null +++ b/packages/renderer/src/style.css @@ -0,0 +1,29 @@ +/* + * Copyright (C) 2022 Kristóf Marussy + * + * This file is part of Sophie. + * + * Sophie is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, version 3. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + * + * SPDX-License-Identifier: AGPL-3.0-only + */ + +body { + background-color: #fff; +} + +@media (prefers-color-scheme: dark) { + body { + background-color: #121212; + } +} -- cgit v1.2.3-54-g00ecf