upfrontsoftware / optimate

0 stars 0 forks source link

Filters UI like toggl.com #207

Open rochecompaan opened 8 years ago

rochecompaan commented 8 years ago

Our Filters UI don't work well on smaller screens. Have a look at the filters for toggl.com detailed reports under "Reports -> Detailed". Do you have access to it? If not I'll post screenshots.

Our implementation doesn't have to be as elaborate as theirs but I like the fact that the filter has a compact label that doesn't change even after selecting a value and the dropdown is wide enough to select items when you click on it.

PS.: This issue is not high priority, work on this after most of the other issues are done.

nvernooy commented 8 years ago

@rochecompaan I'm working on changing the relative layouts and dropdowns. But the toggle.com filter do not get resized no matter the size of the screen or the windows. While in our layout everything gets moved around when the screen size changes. Should we maybe overflow the screen and make sizes stay constant when the screen size changes?

rochecompaan commented 8 years ago

Let's first get a version working before we address the issue of resizing. Once we have a UI similar to toggl.com implemented it should be very easy to improve to become more responsive.

rochecompaan commented 8 years ago

I like what I see! A few tweaks I would like to recommend:

  1. Close the drop down when you click to select.
  2. Add [x] in front of the search button to clear a selected filter - at the moment you have to erase the text using back space.
  3. Automatically give focus to the text input when you click on the filter so that you can just start typing without having to click inside the input first.