Show destructive menu entries in red text, not on a red fill
A red filled row in a context menu shouted louder than the action deserves. The entry now looks like every other entry and only its text is red, so the menu stays calm and the warning is still there. - Menu: danger entries are ghost buttons with the new text style danger. On hover they get the same grey fill as all other entries. - Theme: new text style danger in the normal font size. The existing warning style is small and did not fit a menu row. - Button: two getters expose the drawn text colour and fill, so a test can measure the look instead of reading the danger flag. - Test hook __gm.menuLooks() lists both per menu entry. - Confirm dialogs keep their filled red Delete button. That is a separate widget and was not part of the request. Tests: - ./check.sh: 172 files, 2498 tests, CHECK EXIT 0 - e2e 25: ALL PASSED, 31 checks. New check in 25g opens the menu with a real right click: Delete row has text #e0553f and no fill, Insert frames keeps the normal text colour. - Counter-check: with the old styling the check fails with text #ffffff on fill #e0553f. Original restored per cmp and rebuilt. - Not checked: other menus (graph, assets) have no own check. They run through the same Menu code. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
89b95aa8ac
commit
66868de10a
6 files changed
+59
-4
No files matched your search
@@ -9,6 +9,10 @@ import type { UsersPane } from '../users/UsersPane';
|
||||
import { Color, type ColorSource, type Container, Text } from 'pixi.js';
|
||||
import { centreOf, type HookContext } from './hookHelpers';
|
||||
|
||||
function hex(color: number): string {
|
||||
return `#${color.toString(16).padStart(6, '0')}`;
|
||||
}
|
||||
|
||||
/** Widgets found by their visible text, the panels, menus, pickers and dialogs around the tabs. */
|
||||
export function uiHooks({ app, state, editor }: HookContext) {
|
||||
const { hierarchy, assets, inspector } = editor;
|
||||
@@ -176,7 +180,7 @@ export function uiHooks({ app, state, editor }: HookContext) {
|
||||
/** What a panel dragged shut keeps: its header. Follows the theme, so checks need not. */
|
||||
panelHeader: Panel.HEADER_HEIGHT,
|
||||
/** A theme colour as a hex string, so a check names the colour instead of its current value. */
|
||||
themeColor: (name: keyof typeof Theme.colors) => `#${Theme.colors[name].toString(16).padStart(6, '0')}`,
|
||||
themeColor: (name: keyof typeof Theme.colors) => hex(Theme.colors[name]),
|
||||
inspectorInfo: () => inspector.debugInfo(),
|
||||
textColor,
|
||||
overlayTexts,
|
||||
@@ -189,6 +193,12 @@ export function uiHooks({ app, state, editor }: HookContext) {
|
||||
menuTicks: () => currentMenu()?.ticksDrawn() ?? null,
|
||||
/** Per entry of `menuRows`, whether it can be picked (a greyed-out one cannot). */
|
||||
menuEnabled: () => currentMenu()?.enabledDrawn() ?? null,
|
||||
/** Per entry of `menuRows`, `{ text, fill }` as drawn: label colour and background (`null` = none). */
|
||||
menuLooks: () =>
|
||||
currentMenu()
|
||||
?.looksDrawn()
|
||||
.map((look) => look && { text: hex(look.text), fill: look.fill === null ? null : hex(look.fill) }) ??
|
||||
null,
|
||||
textOverflows,
|
||||
labelsDropped,
|
||||
shownLabel,
|
||||
|
||||
Reference in new issue
Block a user