Fixes dark mode issues

velopert · velopert · commit 666f9f8fa30e · 2022-02-01T22:30:25.000+09:00
diff --git a/public/index.html b/public/index.html
@@ -38,19 +38,7 @@
 
       gtag('config', 'UA-125599395-1');
     </script>
-    <script>
-      function loadTheme() {
-        try {
-          const theme = localStorage.getItem('theme')
-          if (!theme)
-          return
-          document.body.dataset.theme = theme
-        } catch (e) {
 
-        }
-      }
-      loadTheme()     
-    </script>
 
     <title>React App</title>
   </head>
diff --git a/src/containers/write/MarkdownEditorContainer.tsx b/src/containers/write/MarkdownEditorContainer.tsx
@@ -256,8 +256,13 @@ const MarkdownEditorContainer: React.FC<MarkdownEditorContainerProps> = () => {
 
   useSaveHotKey(() => onTempSave(true));
 
+  const isReady = useSelector(
+    (state: RootState) => state.darkMode.systemTheme !== 'not-ready',
+  );
   const theme = useTheme();
 
+  if (!isReady) return null;
+
   return (
     <>
       <Helmet>
diff --git a/src/server/Html.tsx b/src/server/Html.tsx
@@ -85,23 +85,6 @@ function Html({
           gtag('config', 'UA-125599395-1');`,
           }}
         ></script>
-        <script
-          dangerouslySetInnerHTML={{
-            __html: `
-      function loadTheme() {
-        try {
-          const theme = localStorage.getItem('theme')
-          if (!theme)
-          return
-          document.body.dataset.theme = theme
-        } catch (e) {
-
-        }
-      }
-      loadTheme()   
-        `,
-          }}
-        ></script>
       </head>
       <body data-theme={theme}>
         <div id="root" dangerouslySetInnerHTML={{ __html: content }}></div>
