From 6e386881efb158480cc873547cace967ba58d336 Mon Sep 17 00:00:00 2001
From: awsl233777 <awsl233777@gmail.com>
Date: Thu, 28 May 2026 04:04:31 +0000
Subject: [PATCH 1/5] feat(web): keep sidebar version visible

---
 TODO.md                                    |  5 +++
 tests/unit/config-tabs-ui.test.mjs         | 16 +++++++++
 tests/unit/web-ui-behavior-parity.test.mjs |  3 +-
 web-ui/app.js                              |  1 -
 web-ui/partials/index/layout-header.html   |  8 +++--
 web-ui/res/web-ui-render.precompiled.js    | 38 ++++++++++++----------
 web-ui/styles/layout-shell.css             | 13 ++++++--
 7 files changed, 59 insertions(+), 25 deletions(-)
 create mode 100644 TODO.md

diff --git a/TODO.md b/TODO.md
new file mode 100644
index 00000000..a310c35c
--- /dev/null
+++ b/TODO.md
@@ -0,0 +1,5 @@
+# TODO
+
+- [x] Web sidebar: add invisible non-selectable new-tab placeholder.
+- [x] Web sidebar brand: make Codex Mate title slightly larger and keep app version always visible.
+- [x] Verify with unit tests, lint, and a headless Chrome screenshot.
diff --git a/tests/unit/config-tabs-ui.test.mjs b/tests/unit/config-tabs-ui.test.mjs
index 53c5b2e8..208b0e68 100644
--- a/tests/unit/config-tabs-ui.test.mjs
+++ b/tests/unit/config-tabs-ui.test.mjs
@@ -18,6 +18,7 @@ test('config template keeps expected config tabs in top and side navigation', ()
     const baseTheme = readProjectFile('web-ui/styles/base-theme.css');
     const controlsForms = readProjectFile('web-ui/styles/controls-forms.css');
     const taskOrchestrationStyles = readProjectFile('web-ui/styles/task-orchestration.css');
+    const layoutShell = readProjectFile('web-ui/styles/layout-shell.css');
     const bundledStyles = readBundledWebUiCss();
     const sideRail = html.match(/<aside class="side-rail"[\s\S]*?<\/aside>/)?.[0] || '';
     const sideTabModes = [...html.matchAll(/id="side-tab-config-([a-z]+)"/g)]
@@ -120,6 +121,21 @@ test('config template keeps expected config tabs in top and side navigation', ()
         assert.match(styles, /\.task-action-row-right\s*\{[\s\S]*display:\s*flex;[\s\S]*flex-wrap:\s*wrap;/);
         assert.match(styles, /\.task-runtime-item-actions\s*\{[\s\S]*flex-direction:\s*row;[\s\S]*align-items:\s*center;/);
     }
+    const sideGhostTab = sideRail.match(/<div id="side-tab-new"[\s\S]*?<\/div>\s*<\/div>/)?.[0] || '';
+    assert.match(sideGhostTab, /class="side-item side-item-ghost"/);
+    assert.match(sideGhostTab, /tabindex="-1"/);
+    assert.match(sideGhostTab, /aria-hidden="true"/);
+    assert.doesNotMatch(sideGhostTab, /data-main-tab=/);
+    assert.doesNotMatch(sideGhostTab, /@click=/);
+    assert.doesNotMatch(sideGhostTab, /@keydown/);
+    assert.match(html, /<div class="brand-kicker">Codex Mate<span v-if="appVersion" class="brand-version"> v\{\{ appVersion \}\}<\/span><\/div>/);
+    assert.doesNotMatch(html, /appVersion && brandHovered/);
+    assert.doesNotMatch(html, /brandHovered = true/);
+    for (const styles of [layoutShell, bundledStyles]) {
+        assert.match(styles, /\.side-item-ghost\s*\{[\s\S]*opacity:\s*0;[\s\S]*pointer-events:\s*none;[\s\S]*user-select:\s*none;/);
+        assert.match(styles, /\.brand-kicker\s*\{[\s\S]*font-size:\s*15px;/);
+        assert.match(styles, /\.brand-version\s*\{[\s\S]*font-size:\s*13px;/);
+    }
     assert.match(html, /id="side-tab-market"/);
     assert.match(html, /id="tab-market"/);
     assert.match(html, /id="side-tab-docs"/);
diff --git a/tests/unit/web-ui-behavior-parity.test.mjs b/tests/unit/web-ui-behavior-parity.test.mjs
index 7d4a058c..010ca2be 100644
--- a/tests/unit/web-ui-behavior-parity.test.mjs
+++ b/tests/unit/web-ui-behavior-parity.test.mjs
@@ -325,7 +325,6 @@ test('captured bundled app skeleton only exposes expected data key drift versus
     const missingCurrentKeys = headDataKeys.filter((key) => !currentDataKeys.includes(key)).sort();
     const allowedExtraCurrentKeys = parityAgainstHead ? [
         'appVersion',
-        'brandHovered',
         'sessionListInitialBatchSize',
         'sessionListLoadStep',
         'sessionListVisibleCount',
@@ -355,7 +354,6 @@ test('captured bundled app skeleton only exposes expected data key drift versus
         'showEditProviderKey'
     ] : [
         'appVersion',
-        'brandHovered',
         '__mainTabSwitchState',
         'openclawAuthProfilesByProvider',
         'openclawPendingAuthProfileUpdates',
@@ -410,6 +408,7 @@ test('captured bundled app skeleton only exposes expected data key drift versus
         'promptTemplateVarDraftError',
         'promptTemplateVarDraftName',
         'showPromptTemplateVarModal',
+        'brandHovered',
     ];
     allowedExtraCurrentKeys.push(
         'lang',
diff --git a/web-ui/app.js b/web-ui/app.js
index a2b3840d..bb24d331 100644
--- a/web-ui/app.js
+++ b/web-ui/app.js
@@ -31,7 +31,6 @@ document.addEventListener('DOMContentLoaded', () => {
     const appOptions = {
         data() {
             return {
-                brandHovered: false,
                 lang: 'zh',
                 appVersion: '',
                 mainTab: 'dashboard',
diff --git a/web-ui/partials/index/layout-header.html b/web-ui/partials/index/layout-header.html
index 0aa4abe0..c6bc61a4 100644
--- a/web-ui/partials/index/layout-header.html
+++ b/web-ui/partials/index/layout-header.html
@@ -118,16 +118,20 @@
 
         <div :class="['app-shell', { standalone: sessionStandalone }]">
             <aside class="side-rail" v-if="!sessionStandalone">
-                <div class="brand-block" tabindex="0" @mouseenter="brandHovered = true" @mouseleave="brandHovered = false" @focus="brandHovered = true" @blur="brandHovered = false">
+                <div class="brand-block" tabindex="0">
                     <div class="brand-head">
                         <img class="brand-logo" src="/res/logo-pack.webp" alt="Codex Mate logo">
                         <div class="brand-copy">
-                            <div class="brand-kicker">Codex Mate<transition name="brand-version-fade"><span v-if="appVersion && brandHovered" class="brand-version"> v{{ appVersion }}</span></transition></div>
+                            <div class="brand-kicker">Codex Mate<span v-if="appVersion" class="brand-version"> v{{ appVersion }}</span></div>
                         </div>
                     </div>
                 </div>
 
                 <div class="side-rail-nav">
+                <div id="side-tab-new" class="side-item side-item-ghost" tabindex="-1" aria-hidden="true">
+                    <div class="side-item-title">New Tab</div>
+                    <div class="side-item-meta"><span>&nbsp;</span></div>
+                </div>
                 <div class="side-section" role="navigation" :aria-label="t('side.overview')">
                     <div class="side-section-title">{{ t('side.overview') }}</div>
                     <button
diff --git a/web-ui/res/web-ui-render.precompiled.js b/web-ui/res/web-ui-render.precompiled.js
index 43fb3d8f..3e4add66 100644
--- a/web-ui/res/web-ui-render.precompiled.js
+++ b/web-ui/res/web-ui-render.precompiled.js
@@ -1,5 +1,5 @@
 window.__CODEXMATE_WEB_UI_RENDER__ = (() => {
-const { toDisplayString: _toDisplayString, normalizeClass: _normalizeClass, createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock, createCommentVNode: _createCommentVNode, Transition: _Transition, withCtx: _withCtx, createVNode: _createVNode, createTextVNode: _createTextVNode, Fragment: _Fragment, renderList: _renderList, vShow: _vShow, withDirectives: _withDirectives, vModelSelect: _vModelSelect, vModelText: _vModelText, withKeys: _withKeys, withModifiers: _withModifiers, isMemoSame: _isMemoSame, withMemo: _withMemo, normalizeStyle: _normalizeStyle, vModelCheckbox: _vModelCheckbox, vModelDynamic: _vModelDynamic } = Vue
+const { toDisplayString: _toDisplayString, normalizeClass: _normalizeClass, createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock, createCommentVNode: _createCommentVNode, createTextVNode: _createTextVNode, Fragment: _Fragment, renderList: _renderList, vShow: _vShow, withDirectives: _withDirectives, vModelSelect: _vModelSelect, vModelText: _vModelText, withKeys: _withKeys, withModifiers: _withModifiers, isMemoSame: _isMemoSame, withMemo: _withMemo, normalizeStyle: _normalizeStyle, vModelCheckbox: _vModelCheckbox, vModelDynamic: _vModelDynamic } = Vue
 
 return function render(_ctx, _cache) {
   return (_openBlock(), _createElementBlock(_Fragment, null, [
@@ -167,11 +167,7 @@ return function render(_ctx, _cache) {
           }, [
             _createElementVNode("div", {
               class: "brand-block",
-              tabindex: "0",
-              onMouseenter: $event => (_ctx.brandHovered = true),
-              onMouseleave: $event => (_ctx.brandHovered = false),
-              onFocus: $event => (_ctx.brandHovered = true),
-              onBlur: $event => (_ctx.brandHovered = false)
+              tabindex: "0"
             }, [
               _createElementVNode("div", { class: "brand-head" }, [
                 _createElementVNode("img", {
@@ -182,22 +178,28 @@ return function render(_ctx, _cache) {
                 _createElementVNode("div", { class: "brand-copy" }, [
                   _createElementVNode("div", { class: "brand-kicker" }, [
                     _createTextVNode("Codex Mate"),
-                    _createVNode(_Transition, { name: "brand-version-fade" }, {
-                      default: _withCtx(() => [
-                        (_ctx.appVersion && _ctx.brandHovered)
-                          ? (_openBlock(), _createElementBlock("span", {
-                              key: 0,
-                              class: "brand-version"
-                            }, " v" + _toDisplayString(_ctx.appVersion), 1 /* TEXT */))
-                          : _createCommentVNode("v-if", true)
-                      ]),
-                      _: 1 /* STABLE */
-                    })
+                    (_ctx.appVersion)
+                      ? (_openBlock(), _createElementBlock("span", {
+                          key: 0,
+                          class: "brand-version"
+                        }, " v" + _toDisplayString(_ctx.appVersion), 1 /* TEXT */))
+                      : _createCommentVNode("v-if", true)
                   ])
                 ])
               ])
-            ], 40 /* PROPS, NEED_HYDRATION */, ["onMouseenter", "onMouseleave", "onFocus", "onBlur"]),
+            ]),
             _createElementVNode("div", { class: "side-rail-nav" }, [
+              _createElementVNode("div", {
+                id: "side-tab-new",
+                class: "side-item side-item-ghost",
+                tabindex: "-1",
+                "aria-hidden": "true"
+              }, [
+                _createElementVNode("div", { class: "side-item-title" }, "New Tab"),
+                _createElementVNode("div", { class: "side-item-meta" }, [
+                  _createElementVNode("span", null, " ")
+                ])
+              ]),
               _createElementVNode("div", {
                 class: "side-section",
                 role: "navigation",
diff --git a/web-ui/styles/layout-shell.css b/web-ui/styles/layout-shell.css
index fd5f9c6b..a32cc37d 100644
--- a/web-ui/styles/layout-shell.css
+++ b/web-ui/styles/layout-shell.css
@@ -415,6 +415,14 @@ body::after {
     word-break: break-word;
 }
 
+.side-item-ghost {
+    opacity: 0;
+    pointer-events: none;
+    user-select: none;
+    cursor: default;
+    flex: 0 0 auto;
+}
+
 @media (min-width: 721px) {
     body:not(.force-compact) #app > .top-tabs {
         display: none;
@@ -484,7 +492,7 @@ body::after {
 }
 
 .brand-kicker {
-    font-size: 13px;
+    font-size: 15px;
     line-height: 1.2;
     font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
     color: #1d1d1f;
@@ -502,10 +510,11 @@ body::after {
 }
 
 .brand-version {
-    font-size: 12px;
+    font-size: 13px;
     font-weight: 400;
     color: #8e8e93;
     vertical-align: baseline;
+    -webkit-text-fill-color: #8e8e93;
 }
 
 .brand-version-fade-enter-active,

From 3e8e6272697e8df07e74e90ef409efbfe8d8c72d Mon Sep 17 00:00:00 2001
From: awsl233777 <awsl233777@gmail.com>
Date: Thu, 28 May 2026 04:10:35 +0000
Subject: [PATCH 2/5] fix(web): remove inert brand tab stop

---
 tests/unit/config-tabs-ui.test.mjs       |  1 +
 web-ui/partials/index/layout-header.html |  2 +-
 web-ui/res/web-ui-render.precompiled.js  |  5 +----
 web-ui/styles/layout-shell.css           | 10 ----------
 4 files changed, 3 insertions(+), 15 deletions(-)

diff --git a/tests/unit/config-tabs-ui.test.mjs b/tests/unit/config-tabs-ui.test.mjs
index 208b0e68..77993744 100644
--- a/tests/unit/config-tabs-ui.test.mjs
+++ b/tests/unit/config-tabs-ui.test.mjs
@@ -129,6 +129,7 @@ test('config template keeps expected config tabs in top and side navigation', ()
     assert.doesNotMatch(sideGhostTab, /@click=/);
     assert.doesNotMatch(sideGhostTab, /@keydown/);
     assert.match(html, /<div class="brand-kicker">Codex Mate<span v-if="appVersion" class="brand-version"> v\{\{ appVersion \}\}<\/span><\/div>/);
+    assert.doesNotMatch(html, /class="brand-block" tabindex="0"/);
     assert.doesNotMatch(html, /appVersion && brandHovered/);
     assert.doesNotMatch(html, /brandHovered = true/);
     for (const styles of [layoutShell, bundledStyles]) {
diff --git a/web-ui/partials/index/layout-header.html b/web-ui/partials/index/layout-header.html
index c6bc61a4..4d4721a8 100644
--- a/web-ui/partials/index/layout-header.html
+++ b/web-ui/partials/index/layout-header.html
@@ -118,7 +118,7 @@
 
         <div :class="['app-shell', { standalone: sessionStandalone }]">
             <aside class="side-rail" v-if="!sessionStandalone">
-                <div class="brand-block" tabindex="0">
+                <div class="brand-block">
                     <div class="brand-head">
                         <img class="brand-logo" src="/res/logo-pack.webp" alt="Codex Mate logo">
                         <div class="brand-copy">
diff --git a/web-ui/res/web-ui-render.precompiled.js b/web-ui/res/web-ui-render.precompiled.js
index 3e4add66..54660d90 100644
--- a/web-ui/res/web-ui-render.precompiled.js
+++ b/web-ui/res/web-ui-render.precompiled.js
@@ -165,10 +165,7 @@ return function render(_ctx, _cache) {
             key: 0,
             class: "side-rail"
           }, [
-            _createElementVNode("div", {
-              class: "brand-block",
-              tabindex: "0"
-            }, [
+            _createElementVNode("div", { class: "brand-block" }, [
               _createElementVNode("div", { class: "brand-head" }, [
                 _createElementVNode("img", {
                   class: "brand-logo",
diff --git a/web-ui/styles/layout-shell.css b/web-ui/styles/layout-shell.css
index a32cc37d..d670a311 100644
--- a/web-ui/styles/layout-shell.css
+++ b/web-ui/styles/layout-shell.css
@@ -439,16 +439,6 @@ body::after {
     background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
 }
 
-.brand-block:focus-visible {
-    outline: 2px solid rgba(0, 122, 255, 0.5);
-    outline-offset: -2px;
-    border-radius: 4px;
-}
-
-.brand-block:focus:not(:focus-visible) {
-    outline: none;
-}
-
 .brand-head {
     display: flex;
     align-items: center;

From 412493d5cf653f9e0c5ecc747ed5ef426bb3e8d3 Mon Sep 17 00:00:00 2001
From: awsl233777 <awsl233777@gmail.com>
Date: Thu, 28 May 2026 04:41:21 +0000
Subject: [PATCH 3/5] fix(web): move sidebar ghost tab to nav end

---
 tests/unit/config-tabs-ui.test.mjs       |  1 +
 web-ui/partials/index/layout-header.html |  8 ++++----
 web-ui/res/web-ui-render.precompiled.js  | 24 ++++++++++++------------
 3 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/tests/unit/config-tabs-ui.test.mjs b/tests/unit/config-tabs-ui.test.mjs
index 77993744..3ecaf5dc 100644
--- a/tests/unit/config-tabs-ui.test.mjs
+++ b/tests/unit/config-tabs-ui.test.mjs
@@ -128,6 +128,7 @@ test('config template keeps expected config tabs in top and side navigation', ()
     assert.doesNotMatch(sideGhostTab, /data-main-tab=/);
     assert.doesNotMatch(sideGhostTab, /@click=/);
     assert.doesNotMatch(sideGhostTab, /@keydown/);
+    assert.ok(html.indexOf('id="side-tab-trash"') < html.indexOf('id="side-tab-new"'), 'ghost side tab should remain after trash tab to reserve end scroll space');
     assert.match(html, /<div class="brand-kicker">Codex Mate<span v-if="appVersion" class="brand-version"> v\{\{ appVersion \}\}<\/span><\/div>/);
     assert.doesNotMatch(html, /class="brand-block" tabindex="0"/);
     assert.doesNotMatch(html, /appVersion && brandHovered/);
diff --git a/web-ui/partials/index/layout-header.html b/web-ui/partials/index/layout-header.html
index 4d4721a8..8bc7f899 100644
--- a/web-ui/partials/index/layout-header.html
+++ b/web-ui/partials/index/layout-header.html
@@ -128,10 +128,6 @@
                 </div>
 
                 <div class="side-rail-nav">
-                <div id="side-tab-new" class="side-item side-item-ghost" tabindex="-1" aria-hidden="true">
-                    <div class="side-item-title">New Tab</div>
-                    <div class="side-item-meta"><span>&nbsp;</span></div>
-                </div>
                 <div class="side-section" role="navigation" :aria-label="t('side.overview')">
                     <div class="side-section-title">{{ t('side.overview') }}</div>
                     <button
@@ -319,6 +315,10 @@
                         </div>
                     </button>
                 </div>
+                <div id="side-tab-new" class="side-item side-item-ghost" tabindex="-1" aria-hidden="true">
+                    <div class="side-item-title">New Tab</div>
+                    <div class="side-item-meta"><span>&nbsp;</span></div>
+                </div>
                 </div>
 
                 <div class="side-rail-lang" role="group" :aria-label="t('lang.label')">
diff --git a/web-ui/res/web-ui-render.precompiled.js b/web-ui/res/web-ui-render.precompiled.js
index 54660d90..76a7e23e 100644
--- a/web-ui/res/web-ui-render.precompiled.js
+++ b/web-ui/res/web-ui-render.precompiled.js
@@ -186,17 +186,6 @@ return function render(_ctx, _cache) {
               ])
             ]),
             _createElementVNode("div", { class: "side-rail-nav" }, [
-              _createElementVNode("div", {
-                id: "side-tab-new",
-                class: "side-item side-item-ghost",
-                tabindex: "-1",
-                "aria-hidden": "true"
-              }, [
-                _createElementVNode("div", { class: "side-item-title" }, "New Tab"),
-                _createElementVNode("div", { class: "side-item-meta" }, [
-                  _createElementVNode("span", null, " ")
-                ])
-              ]),
               _createElementVNode("div", {
                 class: "side-section",
                 role: "navigation",
@@ -436,7 +425,18 @@ return function render(_ctx, _cache) {
                       : _createCommentVNode("v-if", true)
                   ])
                 ], 42 /* CLASS, PROPS, NEED_HYDRATION */, ["aria-current", "onPointerdown", "onClick"])
-              ], 8 /* PROPS */, ["aria-label"])
+              ], 8 /* PROPS */, ["aria-label"]),
+              _createElementVNode("div", {
+                id: "side-tab-new",
+                class: "side-item side-item-ghost",
+                tabindex: "-1",
+                "aria-hidden": "true"
+              }, [
+                _createElementVNode("div", { class: "side-item-title" }, "New Tab"),
+                _createElementVNode("div", { class: "side-item-meta" }, [
+                  _createElementVNode("span", null, " ")
+                ])
+              ])
             ]),
             _createElementVNode("div", {
               class: "side-rail-lang",

From 129097e10027a74e9e7c052a449e3fa1cc326526 Mon Sep 17 00:00:00 2001
From: awsl233777 <awsl233777@gmail.com>
Date: Thu, 28 May 2026 04:44:24 +0000
Subject: [PATCH 4/5] docs: remove setup command from quick start

---
 README.md    | 1 -
 README.zh.md | 1 -
 2 files changed, 2 deletions(-)

diff --git a/README.md b/README.md
index 54818a4e..4fa6b242 100644
--- a/README.md
+++ b/README.md
@@ -84,7 +84,6 @@ Requires [Node.js](https://nodejs.org/) (`brew install node` if not present).
 
 ```bash
 npm install -g codexmate
-codexmate setup
 codexmate run
 ```
 
diff --git a/README.zh.md b/README.zh.md
index 9aa96eff..9822f147 100644
--- a/README.zh.md
+++ b/README.zh.md
@@ -84,7 +84,6 @@ brew install codexmate
 
 ```bash
 npm install -g codexmate
-codexmate setup
 codexmate run
 ```
 

From 4ffe51d4fc28b1bd276ec4452bafbb4f10ed2d96 Mon Sep 17 00:00:00 2001
From: awsl233777 <awsl233777@gmail.com>
Date: Thu, 28 May 2026 04:47:04 +0000
Subject: [PATCH 5/5] chore: bump version to 0.0.37

---
 TODO.md           | 5 -----
 package-lock.json | 4 ++--
 package.json      | 2 +-
 3 files changed, 3 insertions(+), 8 deletions(-)
 delete mode 100644 TODO.md

diff --git a/TODO.md b/TODO.md
deleted file mode 100644
index a310c35c..00000000
--- a/TODO.md
+++ /dev/null
@@ -1,5 +0,0 @@
-# TODO
-
-- [x] Web sidebar: add invisible non-selectable new-tab placeholder.
-- [x] Web sidebar brand: make Codex Mate title slightly larger and keep app version always visible.
-- [x] Verify with unit tests, lint, and a headless Chrome screenshot.
diff --git a/package-lock.json b/package-lock.json
index 5ace61d7..3aebd6ba 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "codexmate",
-  "version": "0.0.35",
+  "version": "0.0.37",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "codexmate",
-      "version": "0.0.35",
+      "version": "0.0.37",
       "license": "Apache-2.0",
       "dependencies": {
         "@iarna/toml": "^2.2.5",
diff --git a/package.json b/package.json
index c7f93208..1a55c2a4 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "codexmate",
-  "version": "0.0.36",
+  "version": "0.0.37",
   "description": "Codex/Claude Code/OpenClaw 配置、会话与任务编排 CLI + Web 工具",
   "main": "cli.js",
   "bin": {