Repository navigation
feat(ui): Experiential Labs console, rebuilt with a fast style layer - #216
Merged
Merged
Conversation
Remove the Apple v2 look; new console layer files (tokens, behaviour, shell, controls, data, overlays, pages) imported from main.ts; functional fixes rewritten as layout-only behaviour rules; unscoped leaks reverted to upstream; Geist + Geist Mono self-hosted, MiSans 400/500/600; Lucide icons (lucide-static 0.469.0) while the console theme is on. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…public pages Experiential Labs console language built from live measurements: headerless content row and 240px sidebar with Lucide icons; ink primary buttons, 30px controls, native checkboxes, segmented controls; dense single-line tables with mono uppercase headers, monochrome identity chips, 76px KPI cards, reference chart defaults; light popovers, modal and menu recipes with the reference shadows; accounts page toolbar in two rows with category and bulk menus; signin-style auth pages with a pixel grid; accounts columns in upstream order. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…al chips, green switches, quiet tray Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Shared layers: platform identity colours back (decision 2), two-line cells active (decision 3), neutral callouts, muted table heads, dark selected-row text, legend placement, empty-state centering, mobile page title. Page files: accounts, dashboard-usage, users-groups-proxies-keys, settings-ops-public, ops-channels (new), user (new); templates only gain data-ui hooks. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Shared: recipe dark branches carry colours only; header descriptions wrap; date inputs on the control tiers; charts get console defaults before mount; settings-tab hover icon; hand-written dialogs take Modal metrics; table details (checkbox centre, empty row line, head rules, sticky edge, unframed pagination, dialog row heights, group dialog footers). Pages: duplicate titles, toolbars, segmented sizes, table frames and heads, empty states, mobile fixes. Select opens under labelled filter pills (theme on only; data-ui="select-anchor"). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…d by rate limit) Co-Authored-By: Claude <noreply@anthropic.com>
…tial (agents interrupted by billing)
…-only actions probe; shared/pages partial
…control (static data-ui=seg)
…d (pixel-identical to a6673f8, event->paint within budget)
…e-head offsets (channel monitor, risk control)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
The console theme is redone in the Experiential Labs look (platform.experientiallabs.ai), written from scratch and approved by the owner on 2026-09-29 ("可以，按这版推到全站"; platform identity keeps platform colours, everything else colour only for status + accent; the approved two-line cell layouts stay; header not sticky). Frontend only. Theme off still renders upstream.
frontend/src/styles/console/: tokens, behaviour, shell, controls, data, overlays, and per-page files (accounts, dashboard-usage, users-groups-proxies-keys, settings-ops-public, ops-channels, user), imported frommain.ts. Every selector is scoped underhtml.flat-theme.data-uihooks. The two script changes are inDataTable.vue, where the actions-column probe now runs only when the wrapper width changes (a height-only resize, such as the selection tray opening, no longer togglesactions-expandedtwice), and in the upstream v0.2.10 usage-trend metric toggle, which getsdata-ui="seg"so it renders as the console's segmented control.Performance
The first version styled elements through
:has(), so one row click re-styled the whole document. This pass removes almost all:has(). The few that remain sit in the subject position on hooked anchors and were measured cheap.data-uivalues are static, and no sibling rule is keyed on classes that change at runtime.Event Timing (click to next paint, production build, real mouse clicks), accounts row checkbox with the tray opening / a plain tick / the tray closing:
Every other measured interaction is as fast as or faster than a6673f8: users/proxies/redeem row select, account filters, pagination select, the create-account dialog, settings switches, dark-mode toggle.
Verification
vue-tsc --noEmitexit 0 on this tree; the 10 spec files of components changed on both sides of the v0.2.10 merge pass (268 tests); on ui/el the specs of every component whose template changed pass;static_all.pyreports 0 unscoped selectors, 0 cross-file conflicts, LF.🤖 Generated with Claude Code