Date range selector (mobile)

[adamkendis]

Overview

On mobile, the date selector is getting cut off. We need to be able to select any day in the month.

Details

Additionally, the way it looks now on the desktop and mobile are different from each other (see images below), and neither of them look like the Figma. They are all pretty close

Action Items

• [ ] Review the Things you might look at section below
• [ ] review CSS or SCSS files to figure out where it's being controlled
• [ ] Revise to match Figma and use the material ui library.
• [ ] Make sure it covers the menu, so there is no awkward color blocking (see current desktop screenshot)
• [ ] Document in WIKI details that help the next developer work on this component

Things you might look at

• [ ] Implement date range select component. See material-ui Select components (native).
• [ ] Down-caret tapped: open standard date range options (see resources)
• [ ] Calendar icon tapped: open calendar for custom date range selection.

Resources

Figma file with design spec

Desired Final Design

Desktop currently

Mobile currently

[EchoProject]

@nichhk putting this on your radar. This issue should be resolved when the menu re-design is built. Once the new ticket gets created, we can close this out. Let me know if there's a reason to keep this one. Thanks!