fix: bundle codicon font in Java Help Center webview

[chagong]

Problem

Fixes #1390

In the Java Help Center (the welcome webview), some icons render as empty boxes/blanks on Linux. The affected icons are the codicon glyphs used in the navigation tabs and links:

• NavigationPanel.tsx — codicon-gear, codicon-globe, codicon-mortar-board, codicon-rocket
• SocialMediaPanel.tsx — codicon-book, codicon-github-inverted

The image-based icons (logo, tour screenshots, done checkmark) render fine because they are inlined as base64 by webpack.

Root cause

The welcome page stylesheet (src/welcome/assets/style.scss) only styles .codicon (size/margins) but never imports the codicon font CSS. It silently relied on the codicon font that VS Code auto-injects into webviews, which is not reliably present across platforms — so on Linux the glyphs fail to resolve.

Every other icon-using webview in this repo imports the font explicitly (e.g. project-settings, java-runtime, install-jdk, beginner-tips), so the welcome page was the lone exception.

Fix

Import @vscode/codicons/dist/codicon.css in the welcome stylesheet. The webpack config already inlines .ttf fonts as asset/inline, so the font is embedded directly into the bundle and works consistently on Linux, Windows, and macOS — independent of VS Code's injected font. The webview CSP already permits font-src ... data:.

@import "../../assets/vscode.scss";
@import "../../../node_modules/@vscode/codicons/dist/codicon.css";

Verification

• webpack --config-name assets builds with no errors.
• The output out/assets/welcome/index.js now contains an @font-face { font-family: "codicon"; ... format("truetype") } declaration with the font inlined as a base64 font/ttf data URL.

[Copilot]

Pull request overview

This pull request fixes missing Codicon glyphs in the Java Help Center (“welcome”) webview—particularly on Linux—by explicitly bundling the Codicon font CSS into the welcome page’s stylesheet instead of relying on VS Code’s implicit webview font injection.

Changes:

• Import @vscode/codicons/dist/codicon.css from the welcome webview SCSS so the Codicon @font-face is included in the bundle.
• Ensure the Codicon font is inlined via the existing webpack asset/inline font rule, making icon rendering consistent across platforms.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.