Styling needed for filter values modals

[lynwilhelm]

Styling is needed for filter values modals that present a range. We are aware so far of instances of date range and numerical range, but we may want to click around to see if there are other types that could use love and be a part of this piece of work. Also, check with devs if they also want to include date picker in this. Can we easily change to a dark theme that matches our styling?

Anya edits:

(We also need to incorporate the any/none radio-- should I make a separate ticket or integrate that into this one?)

The current filter modals are:

• Basic search box
  • technically only needs to be used for a few specific fields where we can't show the users all the values (e.g., file name, file path -- there's too many values)
• Select from a list of values (has its own search bar)
  • current default if there are fewer than 100 options, but we've discussed making it the default for any field where we know the values regardless of how many there are (e.g., 1000 values) since they can search the list
• Date range
• Numerical range
  • For this and date, when there are only a few values, we discussed allowing the user to use the pick from a list modal instead --> QUESTION: how many is an appropriate number of values to show in a list vs use the range modal?

Screenshots of current modals:

Searchbox

• Needs fuzzy & exact option --> toggle is not currently present on deployed versions

Select from a list

Numerical range

Date range

[SeanLeRoy]

When selecting dates I think it would be useful to have "quick-select" options like a buttons for "Last year", "Last month", "Last 6 months" - users found that useful in the old finder UI

[aswallace]

We also need to integrate the any/none/specific values radio and determine what should display (if anything) when any or none are selected, e.g.,

[lynwilhelm]

@aswallace

URL so you can see spacing and hover styles: https://www.figma.com/design/oNQvOAK11YINcbPvNmkgwO/Public-File-Explorer?node-id=1529-17808&t=SiAQaJdjcIXpXpII-0

Also here is a screen shot for quick reference