In the current dashboard, native select elements have been utilized in various areas. However, these native selects render differently across different systems, leading to an inconsistent user experience. For example, on some devices or browsers, the styling might not match the rest of the UI as given below in the screenshots.
Current Behavior:
On Linux
On Mac
Proposed Solution:
To address this issue and ensure a uniform user experience across all devices and browsers, replace the native select elements with styled React Select components. React Select provides more control over the styling and behaviour of select elements, allowing us to ensure consistency and compatibility across various platforms.
In the current dashboard, native select elements have been utilized in various areas. However, these native selects render differently across different systems, leading to an inconsistent user experience. For example, on some devices or browsers, the styling might not match the rest of the UI as given below in the screenshots.
Current Behavior:
On Linux
On Mac
Proposed Solution:
To address this issue and ensure a uniform user experience across all devices and browsers, replace the native select elements with styled React Select components. React Select provides more control over the styling and behaviour of select elements, allowing us to ensure consistency and compatibility across various platforms.