Merge branch 'master' of https://github.com/liriliri/chii

Author: surunzi

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 1.15.4 (3 Nov 2024)
+
+* fix: auto change theme
+
 ## 1.15.3 (27 Oct 2024)
 
 * fix: embedded mode not resizable on mobile [#81](https://github.com/liriliri/chii/issues/81)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "chii",
-  "version": "1.15.3",
+  "version": "1.15.4",
   "description": "Chrome devtools framework",
   "main": "./server/index.js",
   "bin": {
@@ -50,9 +50,9 @@
     "globals": "^15.6.0",
     "gulp": "^4.0.2",
     "gulp-clean": "^0.4.0",
-    "luna-data-grid": "^1.0.0",
-    "luna-modal": "^1.2.3",
-    "luna-toolbar": "^0.5.8",
+    "luna-data-grid": "^1.1.0",
+    "luna-modal": "^1.3.0",
+    "luna-toolbar": "^0.7.0",
     "ncp": "^2.0.0",
     "style-loader": "^3.3.1",
     "svg-url-loader": "^8.0.0",

server/tpl/index.hbs

@@ -28,6 +28,12 @@
       z-index: 1;
       margin-bottom: 8px;
     }
+    .toolbar > div:first-child {
+      margin-left: 0;
+    }
+    .toolbar > div:last-child {
+      margin-right: 0;
+    }
     .description {
       margin: 1rem 0;
       font-size: .875rem;

src/index.ts

@@ -2,7 +2,6 @@ import detectOs from 'licia/detectOs';
 import $ from 'licia/$';
 import randomId from 'licia/randomId';
 import toInt from 'licia/toInt';
-import isDarkMode from 'licia/isDarkMode';
 import LunaDataGrid from 'luna-data-grid';
 import LunaModal from 'luna-modal';
 import LunaToolbar from 'luna-toolbar';
@@ -64,21 +63,18 @@ const $toolbar = $('.toolbar');
 const $help = $('.help');
 const $description = $('.description');
 
-const theme = isDarkMode() ? 'dark' : 'light';
-
 const help = new LunaModal($help.get(0) as HTMLElement, {
-  theme,
+  theme: 'auto',
   title: 'Help',
   content: $description.get(0) as HTMLElement,
 });
 
 const toolbar = new LunaToolbar($toolbar.get(0) as HTMLElement, {
-  theme,
+  theme: 'auto',
 });
+toolbar.appendInput('filter', '', 'Filter');
 const targets = toolbar.appendText('0 Target');
 toolbar.appendSpace();
-toolbar.appendInput('filter', '', 'Filter');
-toolbar.appendSeparator();
 toolbar.appendButton('Help', () => {
   $description.rmClass('hidden');
   help.show();
@@ -90,7 +86,7 @@ toolbar.on('change', (key, val) => {
 });
 
 const dataGrid = new LunaDataGrid($targets.get(0) as HTMLElement, {
-  theme,
+  theme: 'auto',
   columns: [
     {
       id: 'title',