Skip to content

fix(ui): designer-audit round 3 — dark surface hierarchy, humanized copy, scroll affordance #596

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jackwener merged 1 commit into from
Jul 7, 2026
Merged

fix(ui): designer-audit round 3 — dark surface hierarchy, humanized copy, scroll affordance #596

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions apps/desktop/src/renderer/maka-tokens.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -558,6 +558,8 @@
============================================================================= */

.dark {
/* Designer audit P1-6: composer edge ring — see styles/composer.css. */
--composer-ring-alpha: 0.12;
/* PR-GRAY-CARD-LIFT-0: dark mode follows the same neutral gray
* (hue 0, no chroma) hierarchy. Lightness anchors keep existing
* contrast tuning. */
Expand Down
10 changes: 10 additions & 0 deletions apps/desktop/src/renderer/reference-shell.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -108,6 +108,16 @@
box-shadow: none;
}

/* Designer audit P1-6: in dark mode the canvas (l≈0.14) and the content
card (l≈0.24) sit close enough that the floating-card edge disappears —
the light theme's whole surface hierarchy collapsed to one murk. A 1px
inner top-light hairline gives the eye a physical edge without pushing
the canvas darker. Light mode keeps box-shadow: none (the lightness gap
already reads there). */
.dark .maka-panel-detail.maka-floating-panel.agents-content-area {
box-shadow: inset 0 0 0 1px oklch(1 0 0 / 0.07);
}

/* `.agents-parchment-paper-surface` is reused by the composer body. The bare
class drops its border so the content area doesn't double up with the
floating-panel rule above; the composer re-establishes its own card chrome
Expand Down
7 changes: 5 additions & 2 deletions apps/desktop/src/renderer/settings/appearance-settings-page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -180,9 +180,12 @@ function PersonalizationSettingsPage(props: {
aria-label="助手语气偏好"
className="min-h-21"
/>
{/* Designer audit P1-8: was engineering-speak ("以低优先级拼到
system prompt"、"Runtime 独立判定") — user copy shouldn't require
understanding the implementation. */}
<small>
以低优先级用户偏好拼到 system prompt，500 字符内。Runtime 仍按权限策略和工具规则
独立判定 —— 此处不能写成"忽略前面规则"或"不要再询问"这种指令，会被忽略。
最多 500 字，只影响回答的语气和风格。权限确认与安全规则不受它影响——
写"跳过确认"这类指令不会生效。
</small>
</label>

Expand Down
6 changes: 5 additions & 1 deletion apps/desktop/src/renderer/styles/composer.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -212,7 +212,11 @@
border-radius: var(--radius-modal);
padding: var(--space-2-5) var(--space-3) var(--space-2);
background-color: var(--agents-content-area-bg);
box-shadow: 0 0 0 1px oklch(from var(--foreground) l c h / 0.035);
/* Ring alpha is a token so dark mode can strengthen the edge without a
second rest rule (composer-container-single-source-contract). In dark
the composer and pane share the same bg, and 3.5% of the near-white
foreground vanished — the card lost its outline (designer audit P1-6). */
box-shadow: 0 0 0 1px oklch(from var(--foreground) l c h / var(--composer-ring-alpha, 0.035));
transition:
border-color var(--duration-emphasized) var(--ease-out-strong),
box-shadow var(--duration-emphasized) var(--ease-out-strong);
Expand Down
17 changes: 17 additions & 0 deletions apps/desktop/src/renderer/styles/onboarding.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -212,11 +212,28 @@

/* --- provider list panel (scrolls vertically as the list grows) --- */
.maka-firstrun-list {
position: relative;
border: var(--border-width-hairline) solid var(--border);
border-radius: var(--radius-surface);
overflow: hidden;
background: var(--background-elevated);
}

/* Designer audit P2-15: the height clamp cut the last visible provider row
in half with no cue that the list scrolls — it read as broken clipping.
A bottom fade signals "more below" (the provider count always exceeds the
clamp, so the cue never lies); pointer-events none keeps rows clickable. */
.maka-firstrun-list::after {
content: "";
position: absolute;
left: var(--border-width-hairline);
right: var(--border-width-hairline);
bottom: var(--border-width-hairline);
height: 28px;
border-radius: 0 0 var(--radius-surface) var(--radius-surface);
background: linear-gradient(to bottom, oklch(from var(--background-elevated) l c h / 0), var(--background-elevated));
pointer-events: none;
}
.maka-firstrun-list ul {
margin: 0;
padding: 0;
Expand Down
Loading