Merge branch 'feature' into main

web/src/pages/Edit/Index.vue

@@ -167,6 +167,37 @@ body {
         background-color: #409EFF;
       }
     }
+
+    /* el-dialog */
+    .el-dialog {
+      background-color: #262a2e;
+
+      .el-dialog__header {
+        border-bottom: 1px solid hsla(0,0%,100%,.1);
+      }
+
+      .el-dialog__title {
+        color: hsla(0,0%,100%,.9);
+      }
+
+      .el-dialog__body {
+        background-color: #262a2e;
+      }
+
+      .el-dialog__footer {
+        border-top: 1px solid hsla(0,0%,100%,.1);
+      }
+    }
+
+    /* el-upload */
+    .el-upload__tip {
+      color: #999;
+    }
+
+    /* 富文本编辑器 */
+    .toastui-editor-main-container {
+      background-color: #fff;
+    }
   }
 }
 </style>

web/src/pages/Edit/components/Export.vue

@@ -9,7 +9,7 @@
     element-loading-spinner="el-icon-loading"
     element-loading-background="rgba(0, 0, 0, 0.8)"
   >
-    <div>
+    <div class="exportContainer" :class="{ isDark: isDark }">
       <div class="nameInputBox">
         <span class="name">{{ $t('export.filename') }}</span>
         <el-input
@@ -99,6 +99,7 @@ export default {
   computed: {
     ...mapState({
       openNodeRichText: state => state.localConfig.openNodeRichText,
+      isDark: state => state.isDark
     }),
 
     downTypeList() {
@@ -180,6 +181,22 @@ export default {
 </script>
 
 <style lang="less" scoped>
+.exportContainer {
+  &.isDark {
+    .downloadTypeList {
+      .downloadTypeItem {
+        background-color: #363b3f;
+
+        .info {
+          .name {
+            color: hsla(0,0%,100%,.9);
+          }
+        }
+      }
+    }
+  }
+}
+
 .nodeDialog {
   /deep/ .el-dialog__body {
     background-color: #f2f4f7;

web/src/pages/Edit/components/Navigator.vue

@@ -2,6 +2,7 @@
   <div
     v-if="showMiniMap"
     class="navigatorBox"
+    :class="{ isDark: isDark }"
     ref="navigatorBox"
     @mousedown="onMousedown"
     @mousemove="onMousemove"
@@ -21,6 +22,8 @@
 </template>
 
 <script>
+import { mapState } from 'vuex'
+
 export default {
   props: {
     mindMap: {
@@ -44,6 +47,9 @@ export default {
       }
     }
   },
+  computed: {
+    ...mapState(['isDark']),
+  },
   mounted() {
     this.$bus.$on('toggle_mini_map', this.toggle_mini_map)
     this.$bus.$on('data_change', this.data_change)
@@ -128,6 +134,10 @@ export default {
   cursor: pointer;
   user-select: none;
 
+  &.isDark {
+    background-color: #262a2e;
+  }
+
   .svgBox {
     position: absolute;
     left: 0;