bugzilla.mozilla.org has resumed normal operation. Attachments prior to 2014 will be unavailable for a few days. This is tracked in Bug 1475801.
Please report any other irregularities here.

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

RESOLVED FIXED

Status

Firefox OS
Gaia::Contacts
--
enhancement
RESOLVED FIXED
4 years ago
4 years ago

People

(Reporter: aryx, Unassigned, Mentored)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [good-first-bug])

Attachments

(2 attachments)

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]

Comment 3

4 years ago
Giving a try to this
Flags: needinfo?(francisco)

Comment 4

4 years ago
Created attachment 8515473 [details] [review]
Removed width from edit photo selector
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 6

4 years ago
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-

Comment 7

4 years ago
Created attachment 8515740 [details]
Edit_bug.png

Attached the screenshot for reference. Thanks!

Comment 8

4 years ago
(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)

Comment 10

4 years ago
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)

Comment 11

4 years ago
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 14

4 years ago
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
Last Resolved: 4 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.