diff --git a/apps/desktop/src/renderer/maka-tokens.css b/apps/desktop/src/renderer/maka-tokens.css index 6d974afe36..34948f5f92 100644 --- a/apps/desktop/src/renderer/maka-tokens.css +++ b/apps/desktop/src/renderer/maka-tokens.css @@ -151,8 +151,9 @@ two different colours (10.51:1 vs 12.01:1 measured). One family, one colour space: derive every ink in oklch. */ /* `--foreground-dimmed` is gone as of Visual System 2.0 (T4). It was an alias - of --foreground-secondary kept alive for five call sites in - task-ledger.css, which now name the tier directly. Two names for one ink + of --foreground-secondary kept alive for five call sites in the former + task-ledger.css (now session-todo-panel.css), which were migrated to name + the tier directly. Two names for one ink tier is how the original bug happened: both were written as "80% ink", one mixed in srgb and the other in oklch, and they resolved 10.51:1 against 12.01:1. The contract test still runs — it now asserts the token has no diff --git a/apps/desktop/src/renderer/styles.css b/apps/desktop/src/renderer/styles.css index 00637bce8e..02e5062d64 100644 --- a/apps/desktop/src/renderer/styles.css +++ b/apps/desktop/src/renderer/styles.css @@ -47,7 +47,7 @@ @import "./styles/settings/select.css" layer(components); @import "./styles/model-switcher.css" layer(components); @import "./styles/chat-header.css" layer(components); -@import "./styles/task-ledger.css" layer(components); +@import "./styles/session-todo-panel.css" layer(components); @import "./styles/work-board.css" layer(components); @import "./styles/plan-mode.css" layer(components); @import "./styles/agent-graph.css" layer(components); diff --git a/apps/desktop/src/renderer/styles/session-todo-panel.css b/apps/desktop/src/renderer/styles/session-todo-panel.css new file mode 100644 index 0000000000..a0e53afc6d --- /dev/null +++ b/apps/desktop/src/renderer/styles/session-todo-panel.css @@ -0,0 +1,94 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +/* SessionTodoPanel (#4351) — the read-only, flat projection of the Host-owned + current Todo document. It replaced the nested Task Ledger demand chain, so + this sheet was reduced (#4394) to what the flat list actually renders: a + `-panel` scroll container, a `-tree`
    , and one `-row`
  1. per item that + holds a status icon and its content text. The retired four-column, + depth-indented tree row — its `--task-depth` indent, `-group`, + `[data-status]`, `-key`/`-subject`/`-meta`/`-detail`, and `-terminal` + descendants — is gone; none of those elements exist anymore. */ + +.maka-session-todo-panel { + height: 100%; + min-height: 0; + overflow-y: auto; + padding: var(--space-2); +} + +.maka-session-todo-tree { + display: grid; + gap: var(--border-width-hairline); +} + +/* Two children only: the status icon, then content that takes the remaining + width and wraps within it (`minmax(0, 1fr)` lets the text column shrink so + long, unbroken content wraps instead of overflowing the workbar). The + workbar resizes down to SESSION_WORKBAR_MIN_WIDTH (320px) inside an + otherwise wide window, so wrapping — not a width breakpoint — is what keeps + the row readable at every width. If width-responsive styling is ever added + here it should be an `@container` query on `.maka-session-todo-panel` (see + workbar/inspector.css and chat-header.css), not a viewport `@media`. */ +.maka-session-todo-row { + font: var(--maka-text-supporting); + display: grid; + grid-template-columns: auto minmax(0, 1fr); + align-items: center; + gap: var(--space-2); + min-height: 32px; + padding: var(--space-1) var(--space-2); + border-radius: var(--radius-control); + color: var(--foreground-secondary); +} + +.maka-session-todo-row > span { + min-width: 0; + overflow-wrap: anywhere; +} + +.maka-session-todo-row:hover { background: var(--state-hover-bg); } + +.maka-session-todo-message { + font: var(--maka-text-supporting); + display: flex; + align-items: center; + justify-content: space-between; + min-height: 32px; + padding: var(--space-1) var(--space-2); + color: var(--foreground-secondary); +} + +.maka-session-todo-retry { + display: inline-grid; + width: 28px; + height: 28px; + place-items: center; + border: 0; + border-radius: var(--radius-control); + background: transparent; + color: inherit; +} + +.maka-session-todo-retry:hover { background: var(--state-hover-bg); } + +.maka-session-todo-retry:focus-visible { + outline: var(--focus-ring-width) solid var(--focus-ring); + outline-offset: 1px; +} diff --git a/apps/desktop/src/renderer/styles/task-ledger.css b/apps/desktop/src/renderer/styles/task-ledger.css deleted file mode 100644 index b459c32cc2..0000000000 --- a/apps/desktop/src/renderer/styles/task-ledger.css +++ /dev/null @@ -1,135 +0,0 @@ -/* - * Licensed to the Apache Software Foundation (ASF) under one - * or more contributor license agreements. See the NOTICE file - * distributed with this work for additional information - * regarding copyright ownership. The ASF licenses this file - * to you under the Apache License, Version 2.0 (the - * "License"); you may not use this file except in compliance - * with the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -.maka-task-ledger-panel { - height: 100%; - min-height: 0; - overflow-y: auto; - padding: var(--space-2); -} - -.maka-task-ledger-tree { - display: grid; - gap: var(--border-width-hairline); -} - -.maka-task-ledger-row { - font: var(--maka-text-supporting); - display: grid; - grid-template-columns: 14px minmax(34px, auto) minmax(100px, 1fr) auto; - align-items: center; - gap: var(--space-2); - min-height: 32px; - padding: var(--space-1) var(--space-2) var(--space-1) calc(var(--space-2) + var(--task-depth) * var(--space-5)); - border-radius: var(--radius-control); - color: var(--foreground-secondary); -} - -.maka-task-ledger-group { - display: grid; - grid-column: 1 / -1; - gap: var(--border-width-hairline); -} - -.maka-task-ledger-row:hover { background: var(--state-hover-bg); } - -.maka-task-ledger-row:focus-visible { - outline: none; - box-shadow: inset 0 0 0 var(--focus-ring-width) var(--focus-ring); -} -.maka-task-ledger-row[data-status="in_progress"] > svg { color: var(--status-running); } -.maka-task-ledger-row[data-status="blocked"] > svg { color: var(--warning); } -.maka-task-ledger-row[data-status="completed"] > svg { color: var(--success); } -.maka-task-ledger-row[data-status="failed"] > svg { color: var(--destructive); } - -.maka-task-ledger-key { - font: var(--maka-text-supporting); - color: var(--foreground-secondary); - white-space: nowrap; -} - -.maka-task-ledger-subject, -.maka-task-ledger-detail { - min-width: 0; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.maka-task-ledger-subject { - font: var(--maka-text-body); - color: var(--foreground); } -.maka-task-ledger-meta { display: inline-flex; justify-content: flex-end; gap: var(--space-1-5); white-space: nowrap; } -.maka-task-ledger-meta > span + span::before { content: "·"; margin-right: var(--space-1-5); } -.maka-task-ledger-detail { - font: var(--maka-text-supporting); - grid-column: 3 / -1; color: var(--foreground-secondary); } - -.maka-task-ledger-terminal { - margin-top: var(--space-1); - border-top: var(--border-width-hairline) solid color-mix(in srgb, var(--border) 60%, transparent); -} - -.maka-task-ledger-terminal-trigger { - font: var(--maka-text-supporting); - display: flex; - align-items: center; - gap: var(--space-1-5); - width: 100%; - min-height: 32px; - justify-content: space-between; - padding: var(--space-1) var(--space-2); - color: var(--foreground-secondary); -} - -.maka-task-ledger-terminal-trigger > span { display: inline-flex; align-items: center; gap: var(--space-1-5); } - -.maka-task-ledger-message { - font: var(--maka-text-supporting); - display: flex; - align-items: center; - justify-content: space-between; - min-height: 32px; - padding: var(--space-1) var(--space-2); - color: var(--foreground-secondary); -} - -.maka-task-ledger-retry { - display: inline-grid; - width: 28px; - height: 28px; - place-items: center; - border: 0; - border-radius: var(--radius-control); - background: transparent; - color: inherit; -} - -.maka-task-ledger-retry:hover { background: var(--state-hover-bg); } - -.maka-task-ledger-retry:focus-visible { - outline: var(--focus-ring-width) solid var(--focus-ring); - outline-offset: 1px; -} - -@media (max-width: 620px) { - .maka-task-ledger-row { grid-template-columns: 14px minmax(32px, auto) minmax(0, 1fr); } - .maka-task-ledger-meta { grid-column: 3; justify-content: flex-start; } - .maka-task-ledger-detail { grid-column: 3; white-space: normal; overflow-wrap: anywhere; } -} diff --git a/docs/astryx-surface-file-inventory.md b/docs/astryx-surface-file-inventory.md index b1e9f656c0..2ecdee0a9a 100644 --- a/docs/astryx-surface-file-inventory.md +++ b/docs/astryx-surface-file-inventory.md @@ -164,6 +164,7 @@ Wiki bar: Design Conventions · API Use-the-System · Theming · Container Paddi | `apps/desktop/src/renderer/styles/prompt-suggestions.css` | styles | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/quote-side-panel.css` | shell-chrome-or-panel | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/search-modal.css` | dialog-overlay | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | +| `apps/desktop/src/renderer/styles/session-todo-panel.css` | shell-chrome-or-panel | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/settings.css` | styles | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/settings/about.css` | settings-module | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/settings/bot.css` | settings-module | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | @@ -185,7 +186,6 @@ Wiki bar: Design Conventions · API Use-the-System · Theming · Container Paddi | `apps/desktop/src/renderer/styles/settings/wechat.css` | settings-module | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/shell-layout.css` | styles | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/sidebar.css` | shell-chrome-or-panel | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | -| `apps/desktop/src/renderer/styles/task-ledger.css` | styles | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/theme-glass.css` | styles | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/work-board.css` | styles | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | | `apps/desktop/src/renderer/styles/workbar/artifacts.css` | shell-chrome-or-panel | n/a (css) | aligned — no off-rhythm control heights flagged | aligned | diff --git a/docs/astryx-surface-file-inventory.paths b/docs/astryx-surface-file-inventory.paths index dbde3ed403..08ae1f67d5 100644 --- a/docs/astryx-surface-file-inventory.paths +++ b/docs/astryx-surface-file-inventory.paths @@ -135,6 +135,7 @@ apps/desktop/src/renderer/styles/prompt-rail.css apps/desktop/src/renderer/styles/prompt-suggestions.css apps/desktop/src/renderer/styles/quote-side-panel.css apps/desktop/src/renderer/styles/search-modal.css +apps/desktop/src/renderer/styles/session-todo-panel.css apps/desktop/src/renderer/styles/settings.css apps/desktop/src/renderer/styles/settings/about.css apps/desktop/src/renderer/styles/settings/bot.css @@ -156,7 +157,6 @@ apps/desktop/src/renderer/styles/settings/web-search.css apps/desktop/src/renderer/styles/settings/wechat.css apps/desktop/src/renderer/styles/shell-layout.css apps/desktop/src/renderer/styles/sidebar.css -apps/desktop/src/renderer/styles/task-ledger.css apps/desktop/src/renderer/styles/theme-glass.css apps/desktop/src/renderer/styles/work-board.css apps/desktop/src/renderer/styles/workbar/artifacts.css diff --git a/packages/ui/src/session-todo-panel.tsx b/packages/ui/src/session-todo-panel.tsx index 5ae0fcd94c..35989a4116 100644 --- a/packages/ui/src/session-todo-panel.tsx +++ b/packages/ui/src/session-todo-panel.tsx @@ -44,18 +44,18 @@ export function sessionTodoActiveCount(items: readonly SessionTodoItem[]): numbe export function SessionTodoPanel(props: SessionTodoPanelProps) { const copy = getSharedUiCopy(useUiLocale()).sessionTodo; return ( -
    +
    {props.error ? ( ) : props.loading && props.items.length === 0 ? ( - + ) : props.items.length === 0 ? (