fix(ui): assistant takes the page's own colours and name; collapsed rail stops sliding

The panel still said "Trợ lý App". I reported that name as changed several
turns ago — I had added help_agent.badge for the launcher pill and never
touched help_agent.title, so the panel header kept the old name in all three
languages. It is "AI Assistant" now, as the audit page names it.

Colours were invented rather than read. docs/ui-audit.html draws the assistant
in a fixed teal — .fab background #E6F6F4, border #7FD0C4, .spark #0F9B8A,
pill text #0F6E62 — and the app was using the theme accent instead. The dot,
the hover pill, the edge tab and the sparkle now use those values, so the
floating assistant is one recognisable object rather than something that
changes colour with the theme. The panel header also shows the sparkle instead
of the app's own icon.png, which is what made the header look unrelated to the
dot that opens it.

Collapsed rail: the nav tree kept sizing its column to the widest label, so at
54px it was ~100px wide inside a 66px viewport and grew a horizontal
scrollbar — which slid the icons off the x they hold while the rail is open.
The column now stretches to the viewport and horizontal scrolling is off; the
first item's x is 0 in both states, measured.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
NamPDT
2026-08-18 09:15:31 +09:00
co-authored by Claude Opus 5
parent dc6cb309c2
commit a358a20556
3 changed files with 28 additions and 12 deletions
+7
View File
@@ -448,6 +448,13 @@ class MainWindow(QMainWindow):
tree.setIndentation(0)
tree.setRootIsDecorated(False)
tree.setUniformRowHeights(True)
# The column follows the viewport instead of the widest label. Left
# to size itself it stayed ~100px wide inside the 54px collapsed
# rail, so a horizontal scrollbar appeared and slid the icons out of
# the position they hold while the rail is open.
from PySide6.QtWidgets import QHeaderView
tree.header().setSectionResizeMode(0, QHeaderView.Stretch)
tree.setHorizontalScrollBarPolicy(Qt.ScrollBarAlwaysOff)
return tree
def _nav_rows(self):
+3 -1
View File
@@ -486,7 +486,9 @@ STRINGS: Dict[str, Dict[str, str]] = {
"chat.assistant": {"en": "Assistant", "ja": "アシスタント", "vi": "Assistant"},
"chat.error": {"en": "Error", "ja": "エラー", "vi": "Lỗi"},
"help_agent.title": {
"en": "App Assistant", "ja": "アプリアシスタント", "vi": "Trợ lý App"},
# The audit page names this AI Assistant, and keeps it the same in every
# language — it is a product name, not a description.
"en": "AI Assistant", "ja": "AI Assistant", "vi": "AI Assistant"},
"help_agent.greeting": {
"en": "Hello {name}, have a great working day! How can I help you use the app?",
"ja": "こんにちは {name} さん、良い一日を!アプリの使い方について何かお手伝いできますか?",
+18 -11
View File
@@ -42,6 +42,12 @@ _PILL_PAD = 12 # extra width for the label when hovered
_TAB_W, _TAB_H = 28, 48 # the "show" tab when hidden at the edge (was 16 wide)
_PANEL_W, _PANEL_H = 340, 460 # expanded chat panel size
# Straight from docs/ui-audit.html (.wf .fab / .fabpill / .spark): the
# assistant is teal, not the app accent, and the same in both themes —
# it is one recognisable object floating over every screen.
_TEAL_BG, _TEAL_LINE = "#E6F6F4", "#7FD0C4"
_TEAL_TEXT, _TEAL_SPARK = "#0F6E62", "#0F9B8A"
# The three states the floating assistant cycles through.
_HIDDEN, _LAUNCHER_ST, _PANEL = "hidden", "launcher", "panel"
@@ -140,8 +146,8 @@ class HelpAgentWidget(QWidget):
self._pal = self._compute_palette()
self._apply_style()
muted = self._pal.text_muted
self.edge_tab.setIcon(icon("chevron-left", color=muted))
self.launcher.setIcon(icon("sparkle", size=_DOT_ICON, color=self._pal.accent))
self.edge_tab.setIcon(icon("chevron-left", color=_TEAL_TEXT))
self.launcher.setIcon(icon("sparkle", size=_DOT_ICON, color=_TEAL_SPARK))
self.min_btn.setIcon(icon("minus", color=muted))
self._render()
@@ -154,16 +160,16 @@ class HelpAgentWidget(QWidget):
self.setStyleSheet(f"""
/* Closed launcher: a {_DOT}px dot. `pill` flips to true on hover, when
the label comes out and the shape stretches to a rounded bar. */
#helpLauncher {{ background: {p.surface}; border: 1px solid {p.border};
border-radius: {_DOT // 2}px; color: {p.text}; font-weight: 600;
#helpLauncher {{ background: {_TEAL_BG}; border: 1px solid {_TEAL_LINE};
border-radius: {_DOT // 2}px; color: {_TEAL_TEXT}; font-weight: 700;
font-size: 12px; padding: 0; text-align: center; }}
#helpLauncher[pill="true"] {{ text-align: left; padding-left: 6px; }}
#helpLauncher:hover {{ background: {p.hover}; border-color: {p.border_strong}; }}
#helpLauncher:focus {{ border: 1px solid {p.focus_ring}; }}
#helpEdgeTab {{ background: {p.surface}; border: 1px solid {p.border};
#helpLauncher:hover {{ background: #D5EFEA; border-color: {_TEAL_SPARK}; }}
#helpLauncher:focus {{ border: 1px solid {_TEAL_SPARK}; }}
#helpEdgeTab {{ background: {_TEAL_BG}; border: 1px solid {_TEAL_LINE};
border-right: none; border-top-left-radius: {r}px;
border-bottom-left-radius: {r}px; }}
#helpEdgeTab:hover {{ background: {p.hover}; }}
#helpEdgeTab:hover {{ background: #D5EFEA; }}
#helpPanel {{ background: {p.surface}; border: 1px solid {p.border};
border-radius: {rl}px; color: {p.text}; }}
#helpHeader {{ background: {p.surface}; border-bottom: 1px solid {p.border};
@@ -196,7 +202,7 @@ class HelpAgentWidget(QWidget):
# assistant back (chevron points left = "slide out").
self.edge_tab = QPushButton(self)
self.edge_tab.setObjectName("helpEdgeTab")
self.edge_tab.setIcon(icon("chevron-left", color=self._pal.text_muted))
self.edge_tab.setIcon(icon("chevron-left", color=_TEAL_TEXT))
self.edge_tab.setCursor(Qt.PointingHandCursor)
self.edge_tab.setToolTip(tr("help_agent.show_tooltip"))
self.edge_tab.clicked.connect(self._show_launcher)
@@ -207,7 +213,7 @@ class HelpAgentWidget(QWidget):
# is gone — hiding to the edge is now a line in the panel's ⋯ menu.
self.launcher = _HoverPill(self)
self.launcher.setObjectName("helpLauncher")
self.launcher.setIcon(icon("sparkle", size=_DOT_ICON, color=self._pal.accent))
self.launcher.setIcon(icon("sparkle", size=_DOT_ICON, color=_TEAL_SPARK))
self.launcher.setCursor(Qt.PointingHandCursor)
self.launcher.setToolTip(tr("help_agent.open_tooltip"))
self.launcher.clicked.connect(self._expand)
@@ -226,7 +232,8 @@ class HelpAgentWidget(QWidget):
hb = QHBoxLayout(header)
hb.setContentsMargins(12, 8, 8, 8)
self.title_icon = QLabel(header)
self.title_icon.setPixmap(_app_icon().pixmap(20, 20))
self.title_icon.setPixmap(
icon("sparkle", size=16, color=_TEAL_SPARK).pixmap(16, 16))
hb.addWidget(self.title_icon)
self.title = QLabel(tr("help_agent.title"), header)
self.title.setObjectName("helpTitle")