The padding of the DropdownListItem was causing issues in cases where we were using a ButtonDropdownMenu in Course Planner. The click event seemed to be triggered only intermittently. Each list item of the ButtonDropdownMenu contains a ButtonDropdownMenuItem, which each have padding. With the DropdownListItem component also having padding, if the user clicked on the DropdownListItem's padding, the menu would collapse without triggering a click event on the ButtonDropdownMenuItem, causing confusion for the user. By removing the padding from the DropListItem, the user can click anywhere in the row of the menu list item to select the item.
Describe your changes
Types of changes
[x] Bug fix (non-breaking change which fixes an issue)
[ ] New feature (non-breaking change which adds functionality)
[ ] Breaking change (fix or feature that would cause existing functionality
to change)
Checklist:
[x] I have run eslint on the code
[ ] I have added JSDoc for all of my code (where applicable)
The padding of the
DropdownListItem
was causing issues in cases where we were using aButtonDropdownMenu
in Course Planner. The click event seemed to be triggered only intermittently. Each list item of theButtonDropdownMenu
contains aButtonDropdownMenuItem
, which each have padding. With theDropdownListItem
component also having padding, if the user clicked on theDropdownListItem
's padding, the menu would collapse without triggering a click event on theButtonDropdownMenuItem
, causing confusion for the user. By removing the padding from theDropListItem
, the user can click anywhere in the row of the menu list item to select the item.Describe your changes
Types of changes
Checklist:
eslint
on the codePriority:
Related Issues:
Fixes #515