Christian Byrne 10af2300fa rework minimap, toolbox, and menu designs with unified theming (#6038) ...

## Summary

This PR redesigns the graph canvas interface components including
minimap, toolbox, and menu systems with updated spacing, colors, and
interaction patterns - using the design tokens directly from Figma,
which can be used elsewhere going forward.

There are some other changes to the designs, outlined
[here](https://www.notion.so/comfy-org/Update-Minimap-Menu-v2-2886d73d365080e88e12f8df027019c0):

- [x]  Update/standardize the padding between viewport and toolbox
- [x] Update toolbox component’s style to match the other floating menus
style (border radius, height, padding and follow theme colors)
- [x]  Expose the minimap button
- [x]  Remove the focus button and delete it’s keybinding
- [x]  Group the hand and the default cursor buttons


https://github.com/user-attachments/assets/92542e60-c32d-4a21-a6f6-e72837a70b17

## Review Focus

New CSS variables for cross-component theming consistency and
CanvasModeSelector component extraction for improved code organization.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6038-rework-minimap-toolbox-and-menu-designs-with-unified-theming-28b6d73d36508191a0c6cf8036d965c4)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>

2025-10-14 14:26:07 -07:00

..

colorPalette.spec.ts-snapshots

Cleanup: Removing monkeypatches for litegraph logic (#5902)

2025-10-03 21:22:42 -07:00

copyPaste.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

domWidget.spec.ts-snapshots

rework minimap, toolbox, and menu designs with unified theming (#6038)

2025-10-14 14:26:07 -07:00

execution.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

graphCanvasMenu.spec.ts-snapshots

rework minimap, toolbox, and menu designs with unified theming (#6038)

2025-10-14 14:26:07 -07:00

groupNode.spec.ts-snapshots

[Refactor] Re-organize browser_tests directory (#3105)

2025-03-17 15:32:14 -04:00

interaction.spec.ts-snapshots

Cleanup: Removing monkeypatches for litegraph logic (#5902)

2025-10-03 21:22:42 -07:00

loadWorkflowInMedia.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

lodThreshold.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

nodeBadge.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

nodeDisplay.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

nodeSearchBox.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

noteNode.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

primitiveNode.spec.ts-snapshots

fix(canvas): use vertical-align: top to eliminate baseline gap (#5484)

2025-09-11 01:52:15 -07:00

rerouteNode.spec.ts-snapshots

rework minimap, toolbox, and menu designs with unified theming (#6038)

2025-10-14 14:26:07 -07:00

rightClickMenu.spec.ts-snapshots

Cleanup: Removing monkeypatches for litegraph logic (#5902)

2025-10-03 21:22:42 -07:00

selectionToolbox.spec.ts-snapshots

rework minimap, toolbox, and menu designs with unified theming (#6038)

2025-10-14 14:26:07 -07:00

sidebar

lint: add tsconfig for browser_tests, fix existing violations (#5633)

2025-09-18 11:35:44 -07:00

templates.spec.ts-snapshots

Add MediaAssetCard presentation components (#5878)

2025-10-11 14:39:04 -07:00

vueNodes

rework minimap, toolbox, and menu designs with unified theming (#6038)

2025-10-14 14:26:07 -07:00

widget.spec.ts-snapshots

1.29.0 (#5979)

2025-10-08 12:50:11 -07:00

actionbar.spec.ts

lint: add tsconfig for browser_tests, fix existing violations (#5633)

2025-09-18 11:35:44 -07:00

backgroundImageUpload.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

bottomPanelShortcuts.spec.ts

Keyboard Shortcut Bottom Panel (#4635)

2025-08-07 11:51:23 -07:00

browserTabTitle.spec.ts

[Refactor] Re-organize browser_tests directory (#3105)

2025-03-17 15:32:14 -04:00

changeTracker.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

chatHistory.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

colorPalette.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

commands.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

copyPaste.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

customIcons.spec.ts

Enhanced custom icon support with tailwind (#5159)

2025-08-25 10:20:12 -07:00

dialog.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

domWidget.spec.ts

Cleanup: YAGNI readonly props, private swap on ComfyApp, Canvas resize events simplification, v-memos on individual instances (#5869)

2025-10-02 10:35:10 -07:00

execution.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

extensionAPI.spec.ts

lint: add tsconfig for browser_tests, fix existing violations (#5633)

2025-09-18 11:35:44 -07:00

featureFlags.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

graph.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

graphCanvasMenu.spec.ts

rework minimap, toolbox, and menu designs with unified theming (#6038)

2025-10-14 14:26:07 -07:00

groupNode.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

interaction.spec.ts

rework minimap, toolbox, and menu designs with unified theming (#6038)

2025-10-14 14:26:07 -07:00

keybindings.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

litegraphEvent.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

loadWorkflowInMedia.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

lodThreshold.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

menu.spec.ts

Rework theme menu (#5161)

2025-09-06 03:09:58 -07:00

minimap.spec.ts

rework minimap, toolbox, and menu designs with unified theming (#6038)

2025-10-14 14:26:07 -07:00

nodeBadge.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

nodeDisplay.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

nodeHelp.spec.ts

Floating Selection Toolbox Improvements (#5218)

2025-09-13 22:52:30 -07:00

nodeSearchBox.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

noteNode.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

primitiveNode.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

releaseNotifications.spec.ts

[System Pop Up] Add setting to disable version update notifications (#4388)

2025-07-08 14:43:11 -07:00

remoteWidgets.spec.ts

lint: add tsconfig for browser_tests, fix existing violations (#5633)

2025-09-18 11:35:44 -07:00

rerouteNode.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

rightClickMenu.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

selectionToolbox.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

selectionToolboxSubmenus.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

subgraph-rename-dialog.spec.ts

[refactor] Organize all browser test assets into logical folders (#5058)

2025-08-18 10:39:53 -07:00

subgraph.spec.ts

[refactor] Organize all browser test assets into logical folders (#5058)

2025-08-18 10:39:53 -07:00

templates.spec.ts

Test: Double timeout for Version Mismatch Warnings (#5814)

2025-09-27 20:08:00 +10:00

userSelectView.spec.ts

[Refactor] Re-organize browser_tests directory (#3105)

2025-03-17 15:32:14 -04:00

useSettingSearch.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

versionMismatchWarnings.spec.ts

Test: Double timeout for Version Mismatch Warnings (#5814)

2025-09-27 20:08:00 +10:00

widget.spec.ts

test(e2e): align test default menu to Top; make legacy specs explicit (#5746)

2025-09-24 18:43:22 -07:00

workflowTabThumbnail.spec.ts

Refactor app menu items (#4665)

2025-08-14 14:53:46 -07:00