[CLOSED] Visual tweaks for the quick open drop-down.

[core-ai-bot]

Issue by larz0
Friday Apr 26, 2013 at 04:04 GMT
Originally opened as adobe/brackets#3634

---

@njx pls review.

---

larz0 included the following code: https://github.com/adobe/brackets/pull/3634/commits

[core-ai-bot]

Comment by njx
Friday Apr 26, 2013 at 18:27 GMT

---

Hey--I like removing the separators, but there's some concern that it seems a bit hard to distinguish the individual list items from each other--it's a bit of a sea of text. A couple of things I tried:

• lightening the path strings to #aaa - that helped, but made the paths a little too hard to read, and they're important when you have the same filename in multiple paths, like main.js or strings.js
• adding a very light gray background (e.g. #f6f6f6) to even-numbered items - this made them stand out a bit too much

Would it be appropriate to make the background gray and add striping similar to your mockup for the Find in Files results? There the striping seems to work well without making either the lighter or darker rows stand out too much.

(BTW, I don't think we want to fix this by adding more padding between the items...want to keep the information density we have now.)

[core-ai-bot]

Comment by larz0
Monday Apr 29, 2013 at 02:48 GMT

---

np I'll give that a go.

[core-ai-bot]

Comment by larz0
Monday Apr 29, 2013 at 06:40 GMT

---

Updated the branch.

[core-ai-bot]

Comment by jasonsanjose
Monday Apr 29, 2013 at 16:31 GMT

---

I like the new look a lot! My only concern is that the selected color doesn't stand out enough.

[core-ai-bot]

Comment by adrocknaphobia
Monday Apr 29, 2013 at 16:49 GMT

---

I'm OK with the subdued selected color. The selection is interaction based (moving the arrow keys or hovering w/ a mouse). So the movement and interaction draw your attention to the highlight. If there was no movement then I'd agree w/@jasonsanjose, but I think it works here.

[core-ai-bot]

Comment by peterflynn
Tuesday Apr 30, 2013 at 00:34 GMT

---

Re removing the scroller shadow: what about when there's a ModalBar open at the top (e.g. Find)? Or a permanent menu bar (in inBrowser mode)? Do we still need a shadow for it to look good in those cases?

[core-ai-bot]

Comment by larz0
Tuesday Apr 30, 2013 at 00:40 GMT

---

@peterflynn ModalBars always sits on top of content so it will always have a shadow, so now only CSS is being used instead of JS. How do I go into inBrowser mode?

[core-ai-bot]

Comment by peterflynn
Tuesday Apr 30, 2013 at 00:55 GMT

---

Oh, I didn't see that you'd added a fixed shadow to ModalBar -- great! That same rule also covers inBrowser mode (that's what #titlebar is), so I think you're all set.

[core-ai-bot]

Comment by njx
Saturday May 04, 2013 at 00:23 GMT

---

@larz0 - I think we ended up still having concerns about the selection highlight being too subtle. The issue is that (because of the way our widget works currently) you might start off with something other than the topmost item being highlighted (because if the mouse happens to be over the list when it opens up, the item underneath it gets selected even if you don't click on it). This probably isn't ideal, but fixing it would be difficult until we get a better widget implementation.

So, it would be better if we could have a slightly colored highlight that was easier to see immediately against the striped items.

[core-ai-bot]

Comment by larz0
Saturday May 04, 2013 at 00:29 GMT

---

No problem, try it now.

[core-ai-bot]

Comment by njx
Sunday May 12, 2013 at 22:31 GMT

---

Looks good--I merged it manually with master since there was a recent conflict.