Skip to content

make sure icon images work in monaco too#11348

Open
srietkerk wants to merge 1 commit into
masterfrom
srietkerk/monaco-module-icon-fix
Open

make sure icon images work in monaco too#11348
srietkerk wants to merge 1 commit into
masterfrom
srietkerk/monaco-module-icon-fix

Conversation

@srietkerk
Copy link
Copy Markdown
Contributor

The monaco part of the fix for microsoft/pxt-microbit#6769

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Updates the Monaco flyout category header rendering so that toolbox categories using image-based icons (e.g., extension-provided icons) display correctly in the Monaco experience, aligning behavior with the Blockly toolbox.

Changes:

  • Detect image icons via pxt.toolbox.isImageIcon(icon) and render them with an <img> tag in the Monaco flyout header.
  • Build the image URL using pxt.webConfig.commitCdnUrl + encodeURI(icon) to fetch from the commit CDN.
  • Add Monaco theme styling for the new image icon element sizing/spacing.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File Description
webapp/src/monacoFlyout.tsx Renders category icons as <img> when the icon is an image path, instead of relying on CSS class-based icons.
theme/monaco.less Adds sizing/margin styles for the Monaco flyout header image icon.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants