MudIconButton: Fix filled buttons losing background color on click#11944
Conversation
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request addresses an issue where filled icon buttons incorrectly displayed their background color upon being clicked. The fix aligns the behavior of filled icon buttons with that of standard filled buttons by applying the correct background color for :active and :focus-within states. The change is logical and effectively resolves the bug. I've included one suggestion to enhance the new SCSS rule for better performance and specificity.
There was a problem hiding this comment.
Pull Request Overview
This PR fixes a visual bug where filled MudIconButton components were losing their proper background color when clicked, reverting to a default hover color instead of maintaining the theme-appropriate color.
- Adds specific styling for filled icon buttons in the
:focus-withinand:activestates - Uses the same color logic as regular buttons by applying the appropriate darken variant based on the color class
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
Co-authored-by: gemini-code-assist[bot] <176961590+gemini-code-assist[bot]@users.noreply.github.com>
igotinfected
deleted the
fix/filled-icon-buttons-lose-filled-hover-color-when-clicked
branch
Fixes: #11930
Filled icon buttons didn't have the correct background color after being clicked because we were using
--mud-palette-action-default-hoveras color. For filled icon buttons we now use the same method as for normal buttons, which is to define the background color based on the filled color class applied to the component.Using icon buttons via keyboard navigation didn't trigger this issue because the
hovercolor would take effect instead, hence why I didn't notice it.Checklist:
dev).