Closed Bug 1090212 Opened 10 years ago Closed 10 years ago

[contacts] photo action label in edit mode 'Edit picture' should be centered

Categories

(Firefox OS Graveyard :: Gaia::Contacts, enhancement)

ARM
Gonk (Firefox OS)
enhancement
Not set
normal

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: aryx, Unassigned, Mentored)

Details

(Whiteboard: [good-first-bug])

Attachments

(2 files)

B2G 2.2 + 2.1

In Edit mode for a contacts, the photo action labels like 'Add picture' / 'Edit picture' should be centered. If they are shorter than the available picture is wide, it looks odd especially because the picture has the shape of a square.
We fixed this like a couple of weeks ago, can you verify with latest master or latest 2.1?
Sorry, this only affects the "Edit picture" label, but that on both with the latest versions of 2.1 and 2.2 (e.g. use Chinese Simplified for testing).
Summary: [contacts] photo action labels in edit mode like 'Add picture' / 'Edit picture' should be centered → [contacts] photo action label in edit mode 'Edit picture' should be centered
Mentor: francisco
Whiteboard: [good-first-bug]
Giving a try to this
Flags: needinfo?(francisco)
Flags: needinfo?(francisco)
Attachment #8515473 - Flags: review?(francisco)
Comment on attachment 8515473 [details] [review]
Removed width from edit photo selector

LGTM, thanks!

Asking for UI review to our beloved ux friends
Attachment #8515473 - Flags: ui-review?(cawang)
Attachment #8515473 - Flags: ui-review?(fshih)
Attachment #8515473 - Flags: ui-review?(cawang)
Attachment #8515473 - Flags: review?(francisco)
Attachment #8515473 - Flags: review+
Comment on attachment 8515473 [details] [review]
Removed width from edit photo selector

The "Edit picture" has center aligned. The only problem is Edit Picture's height are different with the height of "Add Picture". Currently "Edit Picture" is lower than "Add Picture". They should be in the same position. Thanks!
Attachment #8515473 - Flags: ui-review?(fshih) → ui-review-
Attached image Edit_bug.png
Attached the screenshot for reference. Thanks!
(In reply to Fang Shih [:grasspizza] from comment #6)
> Comment on attachment 8515473 [details] [review]
> Removed width from edit photo selector
> 
> The "Edit picture" has center aligned. The only problem is Edit Picture's
> height are different with the height of "Add Picture". Currently "Edit
> Picture" is lower than "Add Picture". They should be in the same position.
> Thanks!

Sorry, I meant to say Edit Picture is higher than Add Picture. We should make Edit Picture lower to follow the height of Add Picture. Thanks : )
Hi Pedro,

could you update your bug according to Fang suggestions?
Flags: needinfo?(pedro.cambra)
Hi, 

Yes, I've confirmed what Fang mentions, what I've seen is that the texts have the same height but the Add picture em is inside a p with the "+" icon and the Edit picture is standalone, I'm working on it and I'll update my PR soon
Flags: needinfo?(pedro.cambra)
Updated PR to include vertical centering. At first I wanted to move out the span that contains the add picture icon (+) out of the p tag but that would end up into a much more significant change than this one.

Not sure how to add the flag to review again so adding a needinfo to Francisco :)
Hi Pedro,

thanks, I will do the second review round.
Attachment #8515473 - Flags: review+ → review?(francisco)
Comment on attachment 8515473 [details] [review]
Removed width from edit photo selector

Hei Fang,

here is the second ui review :)

Thanks
Attachment #8515473 - Flags: ui-review- → ui-review?(fshih)
Comment on attachment 8515473 [details] [review]
Removed width from edit photo selector

Looks great! Thank you!
Attachment #8515473 - Flags: ui-review?(fshih) → ui-review+
Attachment #8515473 - Flags: review?(francisco) → review+
Landed on master:

https://github.com/mozilla-b2g/gaia/commit/c19b9d0ef3c7633615d71fd68cabb65038e0e10b

Thanks for the contribution!
Status: NEW → RESOLVED
Closed: 10 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: