Skip to content

fix menu-item floating buttons that should only be displayed on hover#1588

Merged
charlesBochet merged 1 commit intomainfrom
menu-item-hover
Sep 15, 2023
Merged

fix menu-item floating buttons that should only be displayed on hover#1588
charlesBochet merged 1 commit intomainfrom
menu-item-hover

Conversation

@charlesBochet
Copy link
Copy Markdown
Member

@charlesBochet charlesBochet commented Sep 15, 2023

MenuItems floating icons should only be displayed if the menu item is hovered:

image

and hovered:
image

We have two options to implement it:

  1. Cleaner with React, have a [isHovered, setIsHovered] state that will be set onMouseEnter and onMouseLeave on MenuItem and isHovered is used to conditionnally display buttons.
  2. Add a customClass on buttons and use nested css to apply menuItem hover display none/block

I've used 2) so we can have it tested in the Storybook, I think it's important for a UI component to be properly tested and as we won't touch this component often, it's OK not going with the cleaner approach IMO

@charlesBochet charlesBochet enabled auto-merge (squash) September 15, 2023 01:40
@charlesBochet charlesBochet merged commit 9e1db47 into main Sep 15, 2023
@charlesBochet charlesBochet deleted the menu-item-hover branch September 15, 2023 01:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant