diff --git a/src/components/AppRoutes.js b/src/components/AppRoutes.js
index e89d16b..aed538f 100644
--- a/src/components/AppRoutes.js
+++ b/src/components/AppRoutes.js
@@ -66,6 +66,12 @@ const AppRoutes = () => {
     </div>
   );
 
+  const darken =
+    darkMode === "dark" ||
+    (darkMode === "browser" &&
+      window.matchMedia &&
+      window.matchMedia("(prefers-color-scheme: dark)").matches);
+
   const fetchProgram = useStoreActions((actions) => actions.fetchProgram);
 
   useEffect(() => {
@@ -74,14 +80,7 @@ const AppRoutes = () => {
   }, []);
 
   return (
-    <ThemeSelector
-      isDark={
-        darkMode === "dark" ||
-        (darkMode === "browser" &&
-          window.matchMedia &&
-          window.matchMedia("(prefers-color-scheme: dark)").matches)
-      }
-    >
+    <ThemeSelector isDark={darken}>
       <Router basename={configData.BASE_PATH}>
         <ScrollToTop>{theApp}</ScrollToTop>
       </Router>
diff --git a/src/components/ThemeSelector.js b/src/components/ThemeSelector.js
index 19f3f93..3599a74 100644
--- a/src/components/ThemeSelector.js
+++ b/src/components/ThemeSelector.js
@@ -5,11 +5,11 @@ const DarkStyle = React.lazy(() => import("./DarkStyle"));
 
 const ThemeSelector = ({ isDark, children }) => (
   <>
-      <React.Suspense fallback={() => null}>
-         {!isDark && <LightStyle />}
-         {isDark && <DarkStyle />}
-      </React.Suspense>
-      {children}
+    <React.Suspense fallback={() => null}>
+      {!isDark && <LightStyle />}
+      {isDark && <DarkStyle />}
+    </React.Suspense>
+    {children}
   </>
 );