Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FloatingActionButton] OverlayWhenHovered bug when using a FontIcon #894

Closed
mikrofusion opened this issue Jun 20, 2015 · 4 comments · Fixed by #967
Closed

[FloatingActionButton] OverlayWhenHovered bug when using a FontIcon #894

mikrofusion opened this issue Jun 20, 2015 · 4 comments · Fixed by #967
Labels
component: Fab The React component.

Comments

@mikrofusion
Copy link

There is a style bug when hovering over a floating action button which contains a FontIcon.

      <FloatingActionButton
          className="material-icons"
          style={{ position: 'fixed', left: 100, top: 100 }}
        >
          <FontIcon
            style={styles.fontIcon}
            className="material-icons"
          >
            add
          </FontIcon>
        </FloatingActionButton>

material ui icon

@mikrofusion
Copy link
Author

In addition to the hover color not filling the whole background I think it would be good if the user could override the overlay color which is hardcoded to 40% of the Icons color.

      overlayWhenHovered: {
        backgroundColor: ColorManipulator.fade(this._getIconColor(), 0.4)
      }

I'd be glad to try to tackle some of these if someone can give me some direction.

@hai-cea hai-cea changed the title Floating Action Button: OverlayWhenHovered bug when using a FontIcon [Floating Action Button] OverlayWhenHovered bug when using a FontIcon Jun 20, 2015
@hai-cea hai-cea changed the title [Floating Action Button] OverlayWhenHovered bug when using a FontIcon [FloatingActionButton] OverlayWhenHovered bug when using a FontIcon Jun 20, 2015
@oliviertassinari
Copy link
Member

This is fixed with #967

@oliviertassinari
Copy link
Member

@hai-cea I think you can close this issue.

@mikrofusion
Copy link
Author

Confirmed fixed with #967. Closing.

@oliviertassinari oliviertassinari added the component: Fab The React component. label Aug 22, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: Fab The React component.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants