colorstackorg/oyster

Dropdown element has inconsistent positioning ๐Ÿž

Closed this issue ยท 0 comments

Description

The Dropdown element gives inconsistent placement, and sometimes gets pushed off the screen.

Steps to Reproduce

This issue can be seen in on the Students page of the admin-dashboard.
Screenshot 2024-05-01 at 11 18 01 AM

This was also noticed while working on #184, as when creating a new dropdown for rejected applications, the default formatting for the Dropdown resulted in the following:
Screenshot 2024-05-01 at 11 17 11 AM

Expected Behavior

We want the Dropdown element to have consistent positioning that places it in-line with the table it is associated with. Right now it seems that the x-axis positioning is dependent on the width and number of fields within the table. However, since the table width is always fixed, this results in the weird positioning.

Additional Context

This change should just require modifying the way the Tailwind CSS is implemented for Table.Dropdown here. Note that making modifications there will change the formatting of all instances of Dropdown found in the app.