Use a different favicon for the web IDE and workspace
MR: - https://gitlab.com/gitlab-org/gitlab/-/merge_requests/201282+s - https://gitlab.com/gitlab-org/gitlab-web-ide-vscode-fork/-/merge_requests/130+s - https://gitlab.com/gitlab-org/gitlab/-/merge_requests/203442+s ## Problem to solve The GitLab Web IDE uses the same favicon as GitLab, making it hard to find my IDE tab when I have other GitLab pages open. ![image](/uploads/a133e64e798aa87f238def8527510c2d/image.png) ## Suggested solution Use a different favicon for the Web IDE & Workspaces so it can be easily distinguished from other GitLab tabs. ## Proposed design Based on [team feedback](https://gitlab.com/gitlab-org/gitlab/-/issues/543723#note_2512248384), the selected favicon designs use GitLab's brand colors and maintain visual consistency between Web IDE and Workspaces while ensuring clear differentiation from the main GitLab favicon. | Feature | Favicon | | ------ | ------ | | Web IDE | ![image](/uploads/c55bd5198ff046ed24bd4128d9dad7f0/image.png) | | Workspaces | ![image](/uploads/00b921ea519dcfc5c52bb5ae21a732a3/image.png) | **Initially proposed design** ![Screenshot_2025-01-17_at_11.29.35_AM](/uploads/38b9901ef04f2d4f8f62a01bee55e16d/Screenshot_2025-01-17_at_11.29.35_AM.png) ## Proposed implementation ### Web IDE **Repository**: [gitlab-org/gitlab](https://gitlab.com/gitlab-org/gitlab) **Approach**: Modify the existing favicon helper to detect Web IDE context and serve a custom favicon. **Key Changes**: * Update the `favicon` method in [page_layout_helper.rb](https://gitlab.com/gitlab-org/gitlab/-/blob/master/app/helpers/page_layout_helper.rb#L53) to check if user is in Web IDE * Add new method in `Gitlab::Favicon` class for the new Web IDE favicon ### Workspaces **Repository**: [gitlab-org/gitlab-web-ide-vscode-fork](https://gitlab.com/gitlab-org/gitlab-web-ide-vscode-fork) **Challenge**: Workspaces inject the GitLab VS Code fork into containers on startup. This fork serves its own assets, so the favicon comes from the VS Code assets rather than from the main GitLab repository. **Approach**: Create a patch in the VS Code fork to modify favicon during build process. **Key Changes**: * Add a patch file to `vscode-patches/` directory which adds the custom favicon file * Modify VS Code HTML templates to use workspace favicon
issue