Feat(Theme): Support dark mode

src/pages/Tools/Edit.tsx

@@ -1,6 +1,6 @@
 import Draggable from 'react-draggable'
 import Icon from '@ant-design/icons'
-import styles from '@/assets/css/pages/tools/edit.module.less'
+import useStyles from '@/assets/css/pages/tools/edit.style'
 import {
     DATABASE_NO_RECORD_FOUND,
     DATABASE_SELECT_SUCCESS,
@@ -11,6 +11,7 @@ import {
 import { navigateToRepository } from '@/util/navigation'
 import editorExtraLibs from '@/util/editorExtraLibs'
 import { r_tool_category_get, r_tool_detail, r_tool_update } from '@/services/tool'
+import { AppContext } from '@/App'
 import { IFiles, IImportMap, ITsconfig } from '@/components/Playground/shared'
 import {
     base64ToFiles,
@@ -26,6 +27,8 @@ import LoadingMask from '@/components/common/LoadingMask'
 import Card from '@/components/common/Card'
 
 const Edit = () => {
+    const { styles } = useStyles()
+    const { isDarkMode } = useContext(AppContext)
     const blocker = useBlocker(
         ({ currentLocation, nextLocation }) =>
             currentLocation.pathname !== nextLocation.pathname && hasEdited
@@ -420,9 +423,10 @@ const Edit = () => {
         <>
             <FitFullscreen className={styles.root}>
                 <Card className={styles.rootBox}>
-                    <FlexBox direction={'horizontal'} className={styles.rootContent}>
+                    <FlexBox direction={'horizontal'} className={styles.content}>
                         <LoadingMask hidden={!isLoading}>
                             <Playground.CodeEditor
+                                isDarkMode={isDarkMode}
                                 tsconfig={tsconfig}
                                 files={{
                                     ...files,