search

segmentio / evergreen

🌲 Evergreen React UI Framework by Segment
https://evergreen.segment.com
MIT License
12.39k stars 832 forks source link

Disabled MenuItem styling discrepancies #1497

Closed brandongregoryscott closed 2 years ago

brandongregoryscott commented 2 years ago 
<Menu>
  <Menu.Group>
    <Menu.Item disabled={true}>Share...</Menu.Item>
    <Menu.Item>Move...</Menu.Item>
    <Menu.Item>Rename...</Menu.Item>
  </Menu.Group>
  <Menu.Divider />
  <Menu.Group>
    <Menu.Item intent="danger">Delete...</Menu.Item>
  </Menu.Group>
</Menu>

image

The 'Share' option should be a lighter grey shade (probably our muted text color), and it should have a disabled cursor on hover.

Looks like this is the issue with the text color: https://github.com/segmentio/evergreen/blob/41c0d710983f23abf4c6d6a90e18d1bdbb277eb2/src/menu/src/MenuItem.js#L68

The disabled props: (I'm thinking the pseudoselectors defined earlier in the file are interfering w/ the cursor: 'not-allowed' value) https://github.com/segmentio/evergreen/blob/41c0d710983f23abf4c6d6a90e18d1bdbb277eb2/src/menu/src/MenuItem.js#L72-L85