Alphabets on right side in the contact book are too small to select

RESOLVED FIXED

Status

RESOLVED FIXED
5 years ago
4 years ago

People

(Reporter: abhinav.srivstva, Assigned: mannai.med.mack)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(3 attachments)

(Reporter)

Description

5 years ago
User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.63 Safari/537.31

Steps to reproduce:

Opened contacts to find a contact whose name starts with V


Actual results:

I clicked the alphabet V on right side but its so hard to select it. I end up selecting nearby alphabets


Expected results:

I should easily select the alphabet. Please increase the font size
(Assignee)

Comment 1

4 years ago
Hey, 

I'm interested in this bug but I don't know if we can play with UI elements and stick with the design team rules. I believe this is just about CSS so please it would be marked as good-first-bug.

I think, reducing the font size and increasing the line-height values will solve the problem.
I will be trying to upload a patch to fix this.
(Assignee)

Comment 2

4 years ago
Created attachment 8443963 [details] [diff] [review]
946224.patch

Hey again, 

this is my first patch but it still need a review from the UX to make changes ( even changing font size ), to make it look better and give it a feel that the letters are more separated, I reduced the font-size by 0.2rem and make the <li> element a little bigger.

I hope this can help, still depends on screen height. Maybe this bug https://bugzilla.mozilla.org/show_bug.cgi?id=876845 will help in the future with reducing the right list content.

Updated

4 years ago
Attachment #8443963 - Flags: review?(bkelly)

Updated

4 years ago
Assignee: nobody → mannai.med.mack
Comment on attachment 8443963 [details] [diff] [review]
946224.patch

Francisco, can you take a look at this?  Its unclear to me how we much room we have to change the visual design here.
Attachment #8443963 - Flags: review?(bkelly) → review?(francisco)
Thanks Ben,

Asking for UI review from our UX team.
Created attachment 8445248 [details]
Screen Shot 2014-06-03 at 15.51.44.png

Looks to me even smaller that the current alpha scroll here.

Vicky?
Attachment #8445248 - Flags: ui-review?(vpg)
Attachment #8445248 - Flags: ui-review?(vpg) → ui-review+
Can you make sure this is synced with the BBs and framework team?

Ni Arnau and Przemek o they are aware of this change.
Flags: needinfo?(rnowmrch)
Flags: needinfo?(pabratowski)
Please do not merge until verifying facebook import is not broken at 320x480, as the component is smaller due to "select" buttons.
If that looks good to Przemek, LGTM ;)
Flags: needinfo?(rnowmrch)
Won't do the review then till feedback from Przemek.

Thanks.
Comment on attachment 8445248 [details]
Screen Shot 2014-06-03 at 15.51.44.png

Feels a bit weird that it runs into the search field. Also if this is used in an app with a toolbar it would run over that as well. Our competitors use a far smaller version of this control and I'm able to use it, is this really an issue? This is intended as a secondary way to quick scroll a user to the general area, a user can also use the entire screen to scroll. I'm not convinced that we need to enlarge this control.
Attachment #8445248 - Flags: ui-review+ → ui-review-
Flags: needinfo?(pabratowski)
Comment on attachment 8445248 [details]
Screen Shot 2014-06-03 at 15.51.44.png

Sorry, I miss-understood this bug. I like this general change to reduce the font size and increase the padding between the letters. That should help with the touch targets.

I don't love how tall this controls is, but that's a separate issue and it would further complicate the touch targets.
Attachment #8445248 - Flags: ui-review- → ui-review+
Comment on attachment 8443963 [details] [diff] [review]
946224.patch

Done with the review.

Thanks for the contribution, I'll create a PR with this patch to go through the process for travis and so on.
Attachment #8443963 - Flags: review?(francisco) → review+
Landed:

https://github.com/arcturus/gaia/commit/1866a6e561000d682b945819924cfbb8c830bb49
Status: UNCONFIRMED → RESOLVED
Last Resolved: 4 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.