diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index 0edb7f2409..e55042a97a 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -2703,7 +2703,7 @@ define({ "AI_CHAT_MODE_INFO_PLAN": "AI will propose a plan before making changes (Click to switch)", "AI_CHAT_MODE_INFO_EDIT": "AI can edit files. Shell commands need approval (Click to switch)", "AI_CHAT_MODE_INFO_FULL_AUTO": "AI can edit files and run commands without approval (Click to switch)", - "AI_CHAT_MODE_SWITCH_HINT": "[or Shift+Tab]", + "AI_CHAT_PERMISSION_SELECT_TITLE": "Choose how much the AI can do without approval [or Shift+Tab]", "AI_CHAT_AUTH_ERROR_NOTICE": "Claude Code is signed out or your login has expired.", "AI_CHAT_AUTH_ERROR_BTN": "Log in to Claude in Terminal", "AI_CHAT_AUTH_ERROR_HINT": "Type /login in the terminal that opens, then send your message again.", diff --git a/src/styles/Extn-AIChatPanel.less b/src/styles/Extn-AIChatPanel.less index a6a8d63207..b4ca306a9d 100644 --- a/src/styles/Extn-AIChatPanel.less +++ b/src/styles/Extn-AIChatPanel.less @@ -448,6 +448,33 @@ } } +/* ── Permission-mode dropdown ──────────────────────────────────────── */ +/* Same DropdownButton widget as the model selector above, with an added + colored dot per item matching .ai-permission-dot's mode-* colors. */ +.dropdownbutton-popup.ai-permission-dropdown-popup { + min-width: 220px; + max-width: 320px; + + li a { + white-space: normal; + overflow-wrap: break-word; + } + + .ai-permission-item-name { + display: flex; + align-items: center; + gap: 6px; + } + + .ai-permission-item-desc { + display: block; + font-size: @ai-text-meta; + opacity: 0.7; + padding-left: 17px; + line-height: @ai-line-compact; + } +} + /* Auth-error action block: button with its /login hint stacked below — tells the user the one thing to do next at a glance. */ .ai-auth-error-actions { @@ -2662,45 +2689,60 @@ } } - .ai-permission-bar { + .ai-chat-mode-row { display: flex; align-items: center; - gap: 6px; padding: 6px 8px 0 8px; min-height: 18px; - cursor: pointer; - user-select: none; - &:hover { - background: rgba(255, 255, 255, 0.04); + .ai-permission-bar { + display: flex; + align-items: center; + gap: 5px; + height: 22px; + padding: 0 6px; + cursor: pointer; + user-select: none; border-radius: 4px; - } - .ai-permission-dot { - width: 8px; - height: 8px; - border-radius: 50%; - flex-shrink: 0; - - &.mode-auto { - background-color: #e74c3c; + &:hover { + background: rgba(255, 255, 255, 0.04); } - &.mode-edit { - background-color: #f39c12; + .ai-permission-dot { + width: 8px; + height: 8px; + border-radius: 50%; + flex-shrink: 0; + + &.mode-auto { + background-color: #e74c3c; + } + + &.mode-edit { + background-color: #f39c12; + } + + &.mode-plan { + background-color: #3498db; + } } - &.mode-plan { - background-color: #3498db; + .ai-permission-label { + font-size: @ai-text-meta; + color: @project-panel-text-2; + line-height: 1; } - } - .ai-permission-label { - font-size: @ai-text-meta; - color: @project-panel-text-2; - line-height: 1; + i { + font-size: 9px; + opacity: 0.7; + } } + // Reused for the one-time-per-focus input hint flash ("Enter to + // send / Shift+Enter for newline") — see the textarea focus handler. + // Not mode-related; just shares this row's layout. .ai-info { display: none; margin-left: auto; @@ -2732,10 +2774,6 @@ animation: ai-info-flash-in 0.3s ease; } } - - &:hover .ai-info { - display: inline; - } } @keyframes ai-info-flash-in { diff --git a/tracking-repos.json b/tracking-repos.json index 68790e87f3..162c990997 100644 --- a/tracking-repos.json +++ b/tracking-repos.json @@ -1,5 +1,5 @@ { "phoenixPro": { - "commitID": "a69d2ed60ccb04bd245508fb2b4df943d2f43cfa" + "commitID": "4c5eea43d26daf438d288eb12ff968d1a9780b38" } }