适配暗黑模式

src/assets/options.js

@@ -391,7 +391,7 @@
             autoCloseBrackets: true,
             styleActiveLine: true,
             keyMap: "sublime",
-            theme: "mdn-like",
+            theme: utools.isDarkColors() ? 'material-darker' : "mdn-like",
             extraKeys: {
                 "Alt-Enter": () => {
                     $('.CodeMirror').hasClass('CodeMirror-fullscreen') &&
@@ -1030,7 +1030,6 @@
         $("#customize").css({ top: '0px', padding: '0px' });
         $("span.customscript > input").css({"height": "30px"})
         var db = getDB('codeHistory')
-        window.editor.setOption("theme", "ambiance")
         if (file) {
             var fileinfo = getFileInfo({ type: 'file', argvs: file, readfile: true })
             console.log(fileinfo);

src/assets/plugins/codemirrorloader.js

@@ -40,9 +40,8 @@ styles = [
     "./assets/plugins/codemirror/lib/codemirror.css",
     "./assets/plugins/codemirror/addon/hint/show-hint.css",
     "./assets/plugins/codemirror/addon/display/fullscreen.css",
-    "./assets/plugins/codemirror/theme/ambiance.css",
-    "./assets/plugins/codemirror/theme/mdn-like.css",
-    "./assets/plugins/codemirror/addon/dialog/dialog.css"
+    "./assets/plugins/codemirror/theme/mdn-like-modified.css",
+    "./assets/plugins/codemirror/theme/material-darker-modified.css",
 ]
 
 styles.forEach(s => {

src/assets/style/darkmode.css

@@ -0,0 +1,141 @@
+#out,
+#featureList,
+#featureList *,
+#quicktextarea textarea,
+#quickselect .select2-dropdown {
+    background: #303133;
+    color: #e4e4e4;
+}
+
+/*配置界面*/
+
+#options .keyword {
+    background: #505050;
+    color: #f1f2f3;
+    border: 1px solid #ffffff1f;
+}
+
+#options .foot,
+#options .sidebar {
+    background: #292b2d;
+    color: #e4e4e4;
+    box-shadow: 0px 0px 9px 0px #000000ab;
+}
+
+#options table tr:nth-child(odd) {
+    filter: contrast(0.96);
+}
+
+#options .sidebar .currentTag {
+    background-color: #484848;
+}
+
+#options .keyword {
+    color: rgb(203, 255, 250);
+}
+
+#options .keyword.re {
+    color: rgb(98, 200, 247);
+}
+
+#options .keyword.win {
+    color: rgb(249, 174, 150);
+}
+
+#options .keyword.fil {
+    color: rgb(177, 211, 251);
+}
+
+/*添加命令界面*/
+#options #customize {
+    background: #303133;
+}
+
+#options #customize input,
+#options #customize select,
+#options #customize input#scptarg {
+    background: #303133;
+    color: #e4e4e4;
+}
+
+#options #customize input.customize,
+#options #customize span.customscript>input {
+    border-bottom: 1px solid #696666;
+}
+
+#options #customize .CodeMirror {
+    border: 1px solid #676767
+}
+
+#options #customize .CodeMirror-focused {
+    border: 1px solid #676767 !important;
+    box-shadow: 0px 0px 2px 0px #839ba8;
+}
+
+#options #customize .word {
+    color: #4178a2;
+    border: 1px solid #28669c;
+}
+
+/*select2*/
+#options #customize .select2-selection--single,
+#options #customize .select2-selection--multiple {
+    border-bottom: 1px solid #696666;
+    background: #303133;
+    color: #e4e4e4;
+}
+
+#options #customize .select2-selection__rendered {
+    color: #e4e4e4;
+}
+
+#options #customize .select2-results__option--selected {
+    background: #7d7f86;
+}
+
+#options #customize .select2-selection__choice {
+    border: 1px solid #717171
+}
+
+#options #customize .select2-dropdown {
+    background: #46474a;
+    color: #e4e4e4;
+    border: 1px solid #565656;
+}
+
+/*滚动条*/
+::-webkit-scrollbar {
+    width: 6px;
+}
+
+::-webkit-scrollbar-thumb {
+    background-color: rgb(153, 153, 153);
+    height: 30px;
+    border-radius: 7px;
+    border: none;
+}
+
+::-webkit-scrollbar-track-piece {
+    background-color: rgb(87, 87, 87);
+}
+
+/*swal2*/
+body .swal2-popup.swal2-toast {
+    background: #303133;
+    box-shadow: 0 0 0.625em #0a0a0a;
+}
+
+body .swal2-popup,
+body .swal2-range,
+body .swal2-radio,
+body .swal2-checkbox {
+    background: #303133;
+}
+
+body .swal2-container.swal2-backdrop-show, body .swal2-container.swal2-noanimation {
+    background: rgb(48,49,51,0.75)
+}
+
+body.swal2-no-backdrop .swal2-container > .swal2-modal {
+    box-shadow: 0 0 10px rgb(48,49,51,0.75)
+}