Created attachment 8534799 [details] email-too-long.png This is probably an edge-case, but the email address I'm using for testing is quite long. As a result, when we are in a "need verification" state, the hamburger menu only has room to show the email address and not the key message, which is "needs verification". See attachment. A reasonable solution might be to ensure a tooltip is displayed with the complete message. Or we work out how to overflow the left rather than the right. Or we ignore it :) Ryan, thoughts?
The truncation is well done, and you’re right, this is pretty likely to happen, at least for the message. The icon should be a ! in a triangle which will help. Is it available in the assets? https://www.dropbox.com/s/0l8aj6sjgjz0xbw/Sync%20Preverified.pdf?dl=0
Drew, can you look at finding and displaying such an icon?
Ryan, we have a ton of such icons already, but none of them are suitable. They're all colored yellow except for one we have for OS X, and even that one is low-DPI only. So we'll need a new image that matches your mockup. Specifically we'll need two PNGs, one for each low- and high-DPI. Are you able to supply those, or should we ask someone on desktop UX?
Flags: needinfo?(adw) → needinfo?(rfeeley)
Created attachment 8539519 [details] email@example.com I exported a PNG at 2x size.
Created attachment 8539565 [details] [diff] [review] Add warning icon to menu panel item Thanks Ryan. This copies the following two files to browser/themes/shared/warning16.png and firstname.lastname@example.org: http://mxr.mozilla.org/mozilla-central/source/browser/themes/osx/identity-icons-https-mixed-display.png http://email@example.com Mark, there were a couple of decisions I made that you might disagree with and I'm open to changing. (1) Although each of these image files actually has two images in it and we only need one here, I left in both images -- I copied the files bit-for-bit. (The CSS selects the darker of the two images.) Because why not, and tying in to the second point: (2) I named these new files generically so we can use them in other places if we want without it being weird. For comparison, the Sync icon shown in the menu item is here: http://mxr.mozilla.org/mozilla-central/find?text=&string=syncProgress-horizontalbar.png And the various other icons in the menu panel are here: http://mxr.mozilla.org/mozilla-central/find?string=menuPanel- Mark, I'm on PTO next week, so if you want to land this, making any changes that you'd like, that'd be OK with me.
Assignee: nobody → adw
Status: NEW → ASSIGNED
Attachment #8539565 - Flags: review?(mhammond)
Seems like we've rescoped this bug to be about adding a warning icon, so resummarizing to reflect that. But IMO comment 0 is still worth addressing somehow.
Summary: Email address in sync hamburger area may obscure message. → Show a warning icon in the legacy-Sync-to-FxA migration menu panel items
Comment on attachment 8539565 [details] [diff] [review] Add warning icon to menu panel item Review of attachment 8539565 [details] [diff] [review]: ----------------------------------------------------------------- LGTM
Attachment #8539565 - Flags: review?(mhammond) → review+
Status: ASSIGNED → RESOLVED
Last Resolved: 4 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 37
Hi Drew, can you provide a point value.
Points: --- → 2
You need to log in before you can comment on or make changes to this bug.