Conversation
WIP theme pass: compress the light elevation ramp, quiet shadows, and rebind hover/focus/selection off brand so crimson stays on tabs, notebook identity, and primary actions. Co-authored-by: Cursor <cursoragent@cursor.com>
Record the remaining palette and binding decisions in THEME-STEERING.md and apply them: status chips, Enabled/Validated, form SelectMenu, and the leftover light chrome leftover from the first lift. Co-authored-by: Cursor <cursoragent@cursor.com>
Retune pink and danger roles and rebind latches, tooltips, dropdown shadows, and result-grid type so light chrome matches Figma without new tokens. Co-authored-by: Cursor <cursoragent@cursor.com>
Light provider-tab hover sits lighter than the selected well. Result-grid selection uses a double hover wash and info cell chrome without retuning the shared gridSelection token. Co-authored-by: Cursor <cursoragent@cursor.com>
Light metrics calendar flips enabled/disabled wells and keeps selected dates inverse. Monitoring count pills match Figma geometry with the quieter 32% stroke. Table and column glyphs settle on contentPrimary. Co-authored-by: Cursor <cursoragent@cursor.com>
4 tasks
Web Console deploy preview
|
Split rail latch and Run query onto brand* tokens so treatment A (brighter magenta) and B (info rail + success Run) can be compared without moving leftover chrome. Also retune timestamp clocks, swap the left-rail Grid glyph to Phosphor GridNine, and right-align the Run menu. Co-authored-by: Cursor <cursoragent@cursor.com>
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
2 participants
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.
Adds three comparable palettes on this branch so we can pick a rail + Run treatment without forking the shipped console.
Supersedes #607. Original work by @zacknelson.
How to review treatments
/is control (shipped tokens). Append a query string, then toggle light/dark from the theme menu. Check both modes for each treatment./or/?treatment=control/?treatment=a/?treatment=bcontentPrimaryin light/review/aand/review/bare aliases when the host has a SPA fallback. The Vite dev server does not, so use?treatment=locally.Leftover chrome must not move with A or B: tab underlines,
SelectMenuchecks, drag chrome, Save/Connect, non-rail info latches, switches, checkboxes, keyboard focus. Those stay oncontentAccent/actionPrimary/ the status families.Overlays live in
src/theme/treatments.ts. Remove that file and theThemeModeProvidermerge before landing on main. Keep the isolatedbrand*roles.Also in this pass (visible on
/too)statusInfo. The designated timestamp is a filled clock atstatusInfoSubtle. INTERVAL still usescontentPrimary.GridNine, matching the Chart glyph beside it.bottom-endon the chevron (right-aligned to the button group), replacing a hardcodedtranslateX(-7rem)that drifted on the longer “Run selected queries” label.Isolated brand tokens
Control copies the shipped values so
/does not jump:brandAccent/brandAccentActive/brandAccentBorderbrandAction/brandActionHover/brandActionBorder/brandActionForegroundEarlier theme steering (still in this PR)
A light/dark theme pass across the console: palette retunes, accent → neutral interaction colours, a reworked shadow ramp, focus rings routed through a shared
statusInfoFocushelper, and per-mode surfaces for the chrome that needed them.Surfaces touched: notebook and SQL editor chrome, schema tree, table details drawer, result grid, MCP pair popover and footer pill, AI chat window, top bar, drawers, calendar, and the shared
Badge/Switch/SegmentedControl/SelectMenuprimitives.MCP footer pill. Idle is neutral chrome: no fill, outlined in
borderStrongto match the version badge beside it. Pill sits flush on the footer in dark mode. Agent changes read cyan (statusInfo).MCP pair popover. All status notices are one full-bleed band. Danger bands use neutral title/body text with a red icon and surface.
Theme hygiene.
yarn lint:colorspasses. Three new tokens from the earlier pass (interactionSelected,controlTrackRest,controlTrackStroke) plus the isolatedbrand*roles in this commit. Five orphaned tokens already removed.src/components/Selectdeleted in favour ofSelectMenuControl.Test plan
/dark and light: rail magenta, no stroke; Run is solid primary; leftover chrome unchanged/?treatment=adark and light: brighter magenta rail + Run; leftover chrome still shipped magenta/?treatment=bdark and light: cyan rail with stroke on both left and right rails; Run is secondary green; leftover chrome still shipped magenta