mirror of
https://github.com/QwenLM/qwen-code.git
synced 2026-07-10 01:29:17 +00:00
c61006b978
* feat(web-shell): daemon web-shell improvements - Align daemon token usage with structured DaemonTokenUsage type - Optimize settings panel with i18n, theme/language pickers, compact mode - Handle missing session recovery (404/410) with configurable behavior - Restore settings event signal bump for workspace changes - Prevent queued prompt loss on useEffect dependency change - Align streaming loading indicator with CLI metrics logic - Add Ctrl+Y retry for turn_error with daemon support - Hide non-essential UI elements on narrow screens (≤700px) - Prevent loading indicator flicker on page refresh - Hydrate displayName from persisted session title on load * fix(web-shell): harden retry affordance * fix(web-shell): gate retry handling --------- Co-authored-by: ytahdn <ytahdn@gmail.com>
189 lines
3.1 KiB
CSS
189 lines
3.1 KiB
CSS
.bar {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 2px 12px;
|
|
font-size: 13px;
|
|
color: var(--text-dimmed);
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.left,
|
|
.right {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
|
|
.left {
|
|
position: relative;
|
|
}
|
|
|
|
.settingsButton {
|
|
/* Sits in the bar's 2ch left-padding gutter (plus a few px of the footer
|
|
margin) so the mode label keeps its input-text alignment — the gear takes
|
|
no flex space. The gutter alone (~15.6px) is narrower than the button, so
|
|
the extra -6px buys a visible gap between the icon and the mode label
|
|
instead of the two touching. font: inherit so the -2ch resolves against
|
|
the same font as the bar's 2ch padding; the 2px padding is hit area, free
|
|
since we're out of flow. */
|
|
left: calc(-2ch - 6px);
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 2px;
|
|
margin: 0;
|
|
border: none;
|
|
background: none;
|
|
font: inherit;
|
|
color: var(--text-dimmed);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.settingsButton:hover,
|
|
.settingsButton:focus-visible {
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.modeButton {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
padding: 0;
|
|
margin: 0;
|
|
border: none;
|
|
background: none;
|
|
font: inherit;
|
|
color: inherit;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.modeButton:hover .modeHint,
|
|
.modeButton:focus-visible .modeHint {
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.modeLabel {
|
|
font-size: 13px;
|
|
}
|
|
|
|
.modeDefault {
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.modePlan {
|
|
color: var(--success-color);
|
|
}
|
|
|
|
.modeAutoEdit {
|
|
color: var(--warning-color);
|
|
}
|
|
|
|
.modeAuto {
|
|
color: var(--warning-color);
|
|
}
|
|
|
|
.modeYolo {
|
|
color: var(--error-color);
|
|
}
|
|
|
|
.modeHint {
|
|
color: var(--text-dimmed);
|
|
font-size: 12px;
|
|
}
|
|
|
|
.modelButton {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 0;
|
|
margin: 0;
|
|
border: none;
|
|
background: none;
|
|
font: inherit;
|
|
color: inherit;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.modelButton:hover .model,
|
|
.modelButton:focus-visible .model {
|
|
color: var(--text-primary);
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.escapeHint {
|
|
color: var(--text-secondary);
|
|
font-size: 13px;
|
|
}
|
|
|
|
.model {
|
|
color: var(--text-dimmed);
|
|
font-size: 12px;
|
|
}
|
|
|
|
.disconnected {
|
|
color: var(--error-color);
|
|
}
|
|
|
|
.contextButton {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 0;
|
|
margin: 0;
|
|
border: none;
|
|
background: none;
|
|
font: inherit;
|
|
color: inherit;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.contextButton:hover .context,
|
|
.contextButton:focus-visible .context {
|
|
color: var(--text-primary);
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.context {
|
|
font-size: 11px;
|
|
color: var(--text-dimmed);
|
|
}
|
|
|
|
.goal {
|
|
font-size: 12px;
|
|
color: var(--accent-color);
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.separator {
|
|
color: var(--text-dimmed);
|
|
}
|
|
|
|
.taskPill {
|
|
border: 0;
|
|
border-radius: 0;
|
|
padding: 0 4px;
|
|
background: transparent;
|
|
color: var(--text-dimmed);
|
|
font: inherit;
|
|
font-size: 12px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.taskPill:hover,
|
|
.taskPill:focus-visible {
|
|
background: var(--text-dimmed);
|
|
color: var(--bg-primary);
|
|
outline: none;
|
|
}
|
|
|
|
.taskPill:disabled {
|
|
cursor: default;
|
|
}
|
|
|
|
@media (max-width: 700px) {
|
|
.settingsButton,
|
|
.modelButton,
|
|
.modeHint {
|
|
display: none;
|
|
}
|
|
}
|