1026069 - [RB Search] Remove horizontal scroll bar from suggestions

Status: VERIFIED FIXED

(Firefox OS Graveyard :: Gaia::Search, defect)

Description

[Eric Pang [:epang] UX]

Attachment: scroll-bar.png

If possible the scroll bar should be invisible when scrolling through suggestions.

Comment 1

[Eric Pang [:epang] UX]

Hey Dale, is this something you can help out with?  Don't know if it's something that will be simple to change.  Let me know, thanks!

Comment 2

[Dale Harvey (:daleharvey)]

Can take a look, are we just hiding the scrollbar, the user will still be able to scroll the results but no feedback shown?

Comment 3

[Dale Harvey (:daleharvey)]

So this isnt currently possible with current css overflow options, webkit has the ability to seperately style scrollbars which we specifically dont support. Implementing the other workarounds that fake scrollabale areas we definitely shouldnt support.

kats, is there any way I am missing to hide scrollbars but still allow scrolling

More likely Eric, if we cant do this, what should we do? ellipsis for the overflowing text seems reasonably

Comment 4

[Kartikaya Gupta (email:[e-mail])]

The contacts app hides the scrollbar by making the scrollable pane a little wider and clipping it. See for example https://github.com/mozilla-b2g/gaia/blob/master/apps/communications/contacts/style/app.css#L317 - that might be an option here.

Comment 5

[Dale Harvey (:daleharvey)]

Heh that was what I was trying to avoid, if we are doing that in gaia we may as well support scrolbar styling, but we can do it, to be honest I think applying text-overflow styling is preferable or only showing the number of results we can display, having that area scroll seems confusing, will wait for eric to weigh in.

Comment 6

[Eric Pang [:epang] UX]

Hey Dale, thanks for bringing up the issue of not having any feedback for the user.  Can we add a fade on the right side and remove the scroll bar?

On the 10px from the right edge it should go from 0% to 100% opacity.  I've updated the spec to include this.

https://mozilla.box.com/s/ho1brfbe9f4sw5uv3ga4

Let me know what you think and if all good flag me for review :)

Thanks Dale!

Comment 7

[Dale Harvey (:daleharvey)]

The fade isnt possible to do, since the background is user selectable, I can do the hiding the scrollbar but sans fade

Comment 8

[Dale Harvey (:daleharvey)]

Attachment: https://github.com/mozilla-b2g/gaia/pull/20759

Talked with eric offline, original hiding scrollbar is fine, UX are gonna work on a new spec for this for 2.1

This is blocking- but figured can fix on master and can look at uplift depending on how risky it gets with blockers

Comment 9

[Kevin Grandon :kgrandon]

Comment on attachment 8442941 [details] [review]
https://github.com/mozilla-b2g/gaia/pull/20759

I tried it and it seems fine to me. Should we do a ui-review pass on it?

Comment 10

[Dale Harvey (:daleharvey)]

I did a check with eric offline (http://i.imgur.com/E1tdW3B.png) there will be a follow up but hes gonna open a new bug for it, and definitely post 2.0

Comment 11

[Dale Harvey (:daleharvey)]

green run @ https://travis-ci.org/daleharvey/gaia/builds/27990683

pushed in: https://github.com/mozilla-b2g/gaia/commit/213ee062e73221e6f6c7bc22afaebb012f65ffc7

Comment 12

[Ed Morley [:emorley]]

https://hg.mozilla.org/mozilla-central/rev/f5784f2a7112

Comment 13

[Kevin Grandon :kgrandon]

Comment on attachment 8442941 [details] [review]
https://github.com/mozilla-b2g/gaia/pull/20759

This is very small visual polish that is needed for the vertical homescreen.

Comment 14

[Ryan VanderMeulen [:RyanVM]]

v2.0: https://github.com/mozilla-b2g/gaia/commit/9ac1a66405e1ffb8188b1f77989cdd93de72b6e1

Comment 15

[Elie]

Attachment: VIDEO0096_Compress.MP4

This issue has been successfully verified on Flame 2.0:
Gaia-Rev        8d1e868864c8a8f1e037685f0656d1da70d08c06
Gecko-Rev       https://hg.mozilla.org/releases/mozilla-b2g32_v2_0/rev/c756bd8bf3c3
Build-ID        20141201000201
Version         32.0
Device-Name     flame
FW-Release      4.4.2


This issue has been successfully verified on Flame 2.1:
Gaia-Rev        ccb49abe412c978a4045f0c75abff534372716c4
Gecko-Rev       https://hg.mozilla.org/releases/mozilla-b2g34_v2_1/rev/18fb67530b22
Build-ID        20141201001201
Version         34.0
Device-Name     flame
FW-Release      4.4.2