Skip to content

upstreamable: frontend: Fix mobile navbar control colors#660

Open
skoeva wants to merge 1 commit into
Azure:headlamp-downstreamfrom
skoeva:mobile-theme
Open

upstreamable: frontend: Fix mobile navbar control colors#660
skoeva wants to merge 1 commit into
Azure:headlamp-downstreamfrom
skoeva:mobile-theme

Conversation

@skoeva
Copy link
Copy Markdown
Collaborator

@skoeva skoeva commented May 12, 2026

These changes make mobile navbar controls inherit the app bar foreground color so they remain readable with custom themes.

Fixes: #638, #659

Summary

  • Updates the mobile logo/sidebar button to use color="inherit"
  • Updates the compact global search button to use color="inherit"
  • Lets mobile app bar controls inherit the color already computed by the parent app bar from theme.palette.navbar
  • Improves custom theme support for mobile app bar controls, including custom SVG logos that use currentColor

Testing

  • Manually verified the mobile logo text inherits the navbar foreground color
  • Manually verified the mobile search icon inherits the navbar foreground color
image

Signed-off-by: Evangelos Skopelitis <eskopelitis@microsoft.com>
@skoeva skoeva self-assigned this May 12, 2026
Copilot AI review requested due to automatic review settings May 12, 2026 17:50
@skoeva skoeva added the bug Something isn't working label May 12, 2026
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

This PR adjusts mobile top bar controls to inherit the AppBar’s foreground color, ensuring the sidebar toggle/logo and global search icon remain readable under custom navbar themes (addresses #638 and #659).

Changes:

  • Updated the mobile sidebar toggle/logo button to use color="inherit" instead of forcing theme.palette.text.primary.
  • Updated the compact/mobile global search IconButton to use color="inherit" so the icon/text follows the AppBar foreground color.

Reviewed changes

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

File Description
frontend/src/components/Sidebar/HeadlampButton.tsx Makes the mobile sidebar toggle/logo button inherit the AppBar text color for better theme compatibility.
frontend/src/components/globalSearch/GlobalSearch.tsx Makes the mobile/compact global search button inherit the AppBar text color for better theme compatibility.

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

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

Labels

bug Something isn't working

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] upstreamable: Search icon not responsive on mobile [BUG] AKS desktop logo not responsive on mobile

2 participants