Reflowed the profile card in mac desktop user menu into a button (for material design user menu).

Reflowed the profile card in mac desktop user menu into a button (for material design user menu).
Implemented with createMaterialDesignCurrentProfileView, which is based on/parallel to createCurrentProfileView.
Specifically:
1. Reduced the size of profile icon and moved it to be left-aligned
2. Placed avatar name and username to the right of the profile icon
3. Changed account consistency link to be a button instead
4. Consolidated the profile info into a profile card button that leads to manageProfile in the settings page
5. Other layout tweaks

See design doc: https://docs.google.com/document/d/17yHrKd_EU6WoIAgljnZmNCSJLRlbM3O2Pxr7aPEnqik/edit?ts=57445a70#heading=h.6xesoh23gozz

Screenshots: https://drive.google.com/corp/drive/folders/0B7Fvv7JszRyGOG9yOTl3bkJQVjQ

Mocks: https://folio.googleplex.com/chrome-ux-specs-and-sources/Chrome%20Desktop%20Sign%20In/user_menu#%2Fpreview-2.png

BUG=615893
Committed: https://crrev.com/58a786ba513d0dec06fea96f0ec684a60aa50a08
Cr-Commit-Position: refs/heads/master@{#406377}

[Jane, 2016-07-11 14:42:14]

janeliulwq@google.com changed reviewers:
+ groby@chromium.org

[Jane, 2016-07-11 14:42:14]

Hi Rachel, PTAL. Thanks!

[groby-ooo-7-16, 2016-07-11 21:35:29]

Thank you for the explanatory links - super-helpful.

If I can add a small request, could you move those docs to a place accessible
outside Google? Many chromium contribs are from ${NOT_GOOGLE} :)

Otherwise, a bunch of smaller requests/questions, but overall looking good.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
File chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm (right):

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:116: return
(CGFloat)switches::IsMaterialDesignUserMenu() ? 240 : 250;
Please use C++ style cast
(https://google.github.io/styleguide/cppguide.html#Casting)

i.e. static_cast<CGFloat>(...)

Alternatively, don't cast at all and write the numbers as 240.0 : 250.0 - that's
pretty common across the Chrome code base.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:119: gfx::Image
CreateProfileImage(const gfx::Image& icon,
Why not return an NSImage here, so later code can skip all the ToNSImage
invocations?

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:565: NSRect
bounds = NSMakeRect(0, 0, imageSide, imageSide);
Move init inside if() ?

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:832: if ([self
isEnabled]) {
If isEnabled is changed _after_ a hoverstate change, this might cause unexpected
results. It might be better to change the background color in drawRect.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1637: if
(linkMessage) {
Technically, you can skip if (linkMessage) here -  if learnMoreLink is nil,
setFrameOrigin will just do nothing.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1641: 2,
eew. Can we keep the /2 part on the same line?

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1822: CGFloat
yOffset = 0;
nit: 0.0 - since it's float. See also two lines below, 3.0 and 2.0

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1839: if
(!NSEqualRects(profileLinksBound, NSZeroRect)) {
if (!NSIsEmptyRect(profileLinksBound)) {

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1849: NSButton*
profileCard = [self hoverButtonWithRect:rect
Would you mind making this scoped_nsobject? (I see it's addSubviewed later on,
but autoreleased items that don't get retained for 100+ lines make me nervous.
Alternatively, addSubview right here?)

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1867:
ElideMessage(
Why elideMessage for an NSTextField? setLineBreakMode would have the textfield
autotruncate? Is that for compat with the Views code?

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1871:
[profileName setFont:[NSFont labelFontOfSize:(kTextFontSize + 1)]];
Question: How can we elide before we know the font size?

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1903:
ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
Please use a ref instead of a pointer.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1909: const int
badgeSpacing = 4;
I assume the  point here is to inset the supervisedIcon by |badgeSpacing| on all
sides from the parentFrame? And the parentFrame always has the right size for
this? (I.e. is 8x8 points larger)


In that case, you can simplify the code to

[supervisedIcon setFrame:NSInsetRect([iconView frame], badgeSpacing,
badgeSpacing)];

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1959: } else if
(!switches::IsMaterialDesignUserMenu()) {
Wait - this used to be the branch that doesn't have AccountConsistency enabled.
Is it OK if that branch is empty for MaterialDesignUserMenu?

I.e. if (!IsEnableAccountConsistency && IsMaterialDesignUserMenu) ASSERT(link ==
nil)?

[Jane, 2016-07-12 14:49:15]

Patchset #3 (id:40001) has been deleted

[Jane, 2016-07-12 14:51:07]

Thanks for the super detailed & helpful comments! PTAL.
As for the docs, I was going to update the bug with some screenshots. Would that
be sufficient for now or should other docs be uploaded somewhere too?

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
File chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm (right):

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:116: return
(CGFloat)switches::IsMaterialDesignUserMenu() ? 240 : 250;
On 2016/07/11 21:35:28, groby wrote:
> Please use C++ style cast
> (https://google.github.io/styleguide/cppguide.html#Casting)
> 
> i.e. static_cast<CGFloat>(...)
> 
> Alternatively, don't cast at all and write the numbers as 240.0 : 250.0 -
that's
> pretty common across the Chrome code base.

Done.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:119: gfx::Image
CreateProfileImage(const gfx::Image& icon,
On 2016/07/11 21:35:29, groby wrote:
> Why not return an NSImage here, so later code can skip all the ToNSImage
> invocations?

Done.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:565: NSRect
bounds = NSMakeRect(0, 0, imageSide, imageSide);
On 2016/07/11 21:35:29, groby wrote:
> Move init inside if() ?

Done.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:832: if ([self
isEnabled]) {
On 2016/07/11 21:35:28, groby wrote:
> If isEnabled is changed _after_ a hoverstate change, this might cause
unexpected
> results. It might be better to change the background color in drawRect.

Done.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1637: if
(linkMessage) {
On 2016/07/11 21:35:28, groby wrote:
> Technically, you can skip if (linkMessage) here -  if learnMoreLink is nil,
> setFrameOrigin will just do nothing.

Done.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1641: 2,
On 2016/07/11 21:35:28, groby wrote:
> eew. Can we keep the /2 part on the same line? 

Done. I'll try to remember to not run git cl format again starting from this
patch..

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1822: CGFloat
yOffset = 0;
On 2016/07/11 21:35:28, groby wrote:
> nit: 0.0 - since it's float. See also two lines below, 3.0 and 2.0

Done.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1839: if
(!NSEqualRects(profileLinksBound, NSZeroRect)) {
On 2016/07/11 21:35:28, groby wrote:
> if (!NSIsEmptyRect(profileLinksBound)) {

I wrote it this way because NSIsEmptyRect would return true as long as the
rectangle has a 0 side, which is the case here even when a container needs to be
added. Should I add a height specification for the bound above?

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1849: NSButton*
profileCard = [self hoverButtonWithRect:rect
On 2016/07/11 21:35:28, groby wrote:
> Would you mind making this scoped_nsobject? (I see it's addSubviewed later on,
> but autoreleased items that don't get retained for 100+ lines make me nervous.
> Alternatively, addSubview right here?)

Done. addSubview moved to here.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1867:
ElideMessage(
On 2016/07/11 21:35:28, groby wrote:
> Why elideMessage for an NSTextField? setLineBreakMode would have the textfield
> autotruncate? Is that for compat with the Views code?

It's just that I thought a cell is needed for setLineBreakMode, but this
textfield doesn't need a cell. I saw other usages like this above so I wrote it
this way. Is it a better practice to use setLineBreakMode?

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1871:
[profileName setFont:[NSFont labelFontOfSize:(kTextFontSize + 1)]];
On 2016/07/11 21:35:29, groby wrote:
> Question: How can we elide before we know the font size?

Good question, I missed that part. It looks like eliding is done here with the
default font size from gfx::FontList(), which is 12.
I added a new ElideMessage function that takes in an alternative font size so
that the message would be properly elided.
Thanks for catching this!
(In case you were wondering, the -2.0 I had for availableTextWidth was to
account for the weird overflow I noticed here. Now the mystery is solved!)

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1903:
ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
On 2016/07/11 21:35:28, groby wrote:
> Please use a ref instead of a pointer.

Done.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1909: const int
badgeSpacing = 4;
On 2016/07/11 21:35:28, groby wrote:
> I assume the  point here is to inset the supervisedIcon by |badgeSpacing| on
all
> sides from the parentFrame? And the parentFrame always has the right size for
> this? (I.e. is 8x8 points larger)
> 
> 
> In that case, you can simplify the code to
> 
> [supervisedIcon setFrame:NSInsetRect([iconView frame], badgeSpacing,
> badgeSpacing)];
> 

The point is to actually place the supervisedIcon on the right-bottom corner of
parentFrame (like how it looks right now), and then let it flow out of
parentFrame by 4 on both sides.
See the third mock here:
https://folio.googleplex.com/chrome-ux-specs-and-sources/Chrome%20Desktop%20S...
I don't think insetting works here, but let me know if there is any other way to
simplify the code! I figured parentFrame might not be the clearest name so I
just changed it to profileIconFrame.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1959: } else if
(!switches::IsMaterialDesignUserMenu()) {
On 2016/07/11 21:35:28, groby wrote:
> Wait - this used to be the branch that doesn't have AccountConsistency
enabled.
> Is it OK if that branch is empty for MaterialDesignUserMenu?
> 
> I.e. if (!IsEnableAccountConsistency && IsMaterialDesignUserMenu) ASSERT(link
==
> nil)?

Sorry, I'm kinda confused about what you are asking here - is this a suggestion
or just double-checking the code logic?
To explain the code, I'm leaving this branch empty for
!IsEnableAccountConsistency && IsMaterialDesignUserMenu. This is because the
username (email address) in material design user menu would appear in the
profile card, instead of a separate link. When calling this function for
material design user menu, I explicitly made sure that it's only for account
consistency and signin promo. Besides, this function would simply return an
empty container if no condition satisfies.
Let me know if this makes sense and if anything needs to be added!

[Jane, 2016-07-18 13:49:12]

Patchset #4 (id:80001) has been deleted

[Jane, 2016-07-18 17:02:06]

Patchset #4 (id:100001) has been deleted

[groby-ooo-7-16, 2016-07-19 17:43:34]

Sorry for the delay, completely slipped under my radar :( Please feel free to
ping me via IM if I let a CL linger like this.

LGTM

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
File chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm (right):

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1839: if
(!NSEqualRects(profileLinksBound, NSZeroRect)) {
On 2016/07/12 14:51:07, Jane wrote:
> On 2016/07/11 21:35:28, groby wrote:
> > if (!NSIsEmptyRect(profileLinksBound)) {
> 
> I wrote it this way because NSIsEmptyRect would return true as long as the
> rectangle has a 0 side, which is the case here even when a container needs to
be
> added. Should I add a height specification for the bound above?

To me, that'd read a little bit clearer, but it's a matter of taste, really.
Your choice :)

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1867:
ElideMessage(
On 2016/07/12 14:51:07, Jane wrote:
> On 2016/07/11 21:35:28, groby wrote:
> > Why elideMessage for an NSTextField? setLineBreakMode would have the
textfield
> > autotruncate? Is that for compat with the Views code?
> 
> It's just that I thought a cell is needed for setLineBreakMode, but this
> textfield doesn't need a cell. I saw other usages like this above so I wrote
it
> this way. Is it a better practice to use setLineBreakMode?

In general, setLineBreakMode is the OS way to do linebreak, and it results in
less code. 

As for not needing a cell - all NSControls have a cell. That's what is actually
responsible for drawing the UI & handling behavior. (I apologize if you already
knew this and I misunderstood)

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1909: const int
badgeSpacing = 4;
On 2016/07/12 14:51:06, Jane wrote:
> On 2016/07/11 21:35:28, groby wrote:
> > I assume the  point here is to inset the supervisedIcon by |badgeSpacing| on
> all
> > sides from the parentFrame? And the parentFrame always has the right size
for
> > this? (I.e. is 8x8 points larger)
> > 
> > 
> > In that case, you can simplify the code to
> > 
> > [supervisedIcon setFrame:NSInsetRect([iconView frame], badgeSpacing,
> > badgeSpacing)];
> > 
> 
> The point is to actually place the supervisedIcon on the right-bottom corner
of
> parentFrame (like how it looks right now), and then let it flow out of
> parentFrame by 4 on both sides.
> See the third mock here:
>
https://folio.googleplex.com/chrome-ux-specs-and-sources/Chrome%20Desktop%20S...
> I don't think insetting works here, but let me know if there is any other way
to
> simplify the code! I figured parentFrame might not be the clearest name so I
> just changed it to profileIconFrame.

Acknowledged.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1959: } else if
(!switches::IsMaterialDesignUserMenu()) {
On 2016/07/12 14:51:07, Jane wrote:
> On 2016/07/11 21:35:28, groby wrote:
> > Wait - this used to be the branch that doesn't have AccountConsistency
> enabled.
> > Is it OK if that branch is empty for MaterialDesignUserMenu?
> > 
> > I.e. if (!IsEnableAccountConsistency && IsMaterialDesignUserMenu)
ASSERT(link
> ==
> > nil)?
> 
> Sorry, I'm kinda confused about what you are asking here - is this a
suggestion
> or just double-checking the code logic?
> To explain the code, I'm leaving this branch empty for
> !IsEnableAccountConsistency && IsMaterialDesignUserMenu. This is because the
> username (email address) in material design user menu would appear in the
> profile card, instead of a separate link. When calling this function for
> material design user menu, I explicitly made sure that it's only for account
> consistency and signin promo. Besides, this function would simply return an
> empty container if no condition satisfies.
> Let me know if this makes sense and if anything needs to be added!

Yes, this makes sense, thank you. Maybe add a comment or DCHECK to make the
assumption clear?

[Jane, 2016-07-19 19:17:44]

Patchset #5 (id:140001) has been deleted

[Jane, 2016-07-19 19:20:07]

Thanks for the review! Will ping you next time if anything. :)

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
File chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm (right):

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1839: if
(!NSEqualRects(profileLinksBound, NSZeroRect)) {
On 2016/07/19 17:43:34, groby wrote:
> On 2016/07/12 14:51:07, Jane wrote:
> > On 2016/07/11 21:35:28, groby wrote:
> > > if (!NSIsEmptyRect(profileLinksBound)) {
> > 
> > I wrote it this way because NSIsEmptyRect would return true as long as the
> > rectangle has a 0 side, which is the case here even when a container needs
to
> be
> > added. Should I add a height specification for the bound above?
> 
> To me, that'd read a little bit clearer, but it's a matter of taste, really.
> Your choice :)

Done. Added height specifications above and changed this to NSIsEmptyRect.

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1867:
ElideMessage(
On 2016/07/19 17:43:34, groby wrote:
> On 2016/07/12 14:51:07, Jane wrote:
> > On 2016/07/11 21:35:28, groby wrote:
> > > Why elideMessage for an NSTextField? setLineBreakMode would have the
> textfield
> > > autotruncate? Is that for compat with the Views code?
> > 
> > It's just that I thought a cell is needed for setLineBreakMode, but this
> > textfield doesn't need a cell. I saw other usages like this above so I wrote
> it
> > this way. Is it a better practice to use setLineBreakMode?
> 
> In general, setLineBreakMode is the OS way to do linebreak, and it results in
> less code. 
> 
> As for not needing a cell - all NSControls have a cell. That's what is
actually
> responsible for drawing the UI & handling behavior. (I apologize if you
already
> knew this and I misunderstood)

Done. Thanks for explaining and I didn't know this before! (new to cocoa and
all)

https://codereview.chromium.org/2136943003/diff/20001/chrome/browser/ui/cocoa...
chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm:1959: } else if
(!switches::IsMaterialDesignUserMenu()) {
On 2016/07/19 17:43:34, groby wrote:
> On 2016/07/12 14:51:07, Jane wrote:
> > On 2016/07/11 21:35:28, groby wrote:
> > > Wait - this used to be the branch that doesn't have AccountConsistency
> > enabled.
> > > Is it OK if that branch is empty for MaterialDesignUserMenu?
> > > 
> > > I.e. if (!IsEnableAccountConsistency && IsMaterialDesignUserMenu)
> ASSERT(link
> > ==
> > > nil)?
> > 
> > Sorry, I'm kinda confused about what you are asking here - is this a
> suggestion
> > or just double-checking the code logic?
> > To explain the code, I'm leaving this branch empty for
> > !IsEnableAccountConsistency && IsMaterialDesignUserMenu. This is because the
> > username (email address) in material design user menu would appear in the
> > profile card, instead of a separate link. When calling this function for
> > material design user menu, I explicitly made sure that it's only for account
> > consistency and signin promo. Besides, this function would simply return an
> > empty container if no condition satisfies.
> > Let me know if this makes sense and if anything needs to be added!
> 
> Yes, this makes sense, thank you. Maybe add a comment or DCHECK to make the
> assumption clear?

Done. Added a DCHECK with a comment at the beginning of this function.

[Jane, 2016-07-19 20:55:29]

The CQ bit was checked by janeliulwq@google.com

[Jane, 2016-07-19 20:55:29]

The patchset sent to the CQ was uploaded after l-g-t-m from groby@chromium.org
Link to the patchset: https://codereview.chromium.org/2136943003/#ps160001
(title: "Final comments")

[commit-bot: I haz the power, 2016-07-19 20:55:58]

CQ is trying da patch. Follow status at
 
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[commit-bot: I haz the power, 2016-07-19 21:02:57]

Description was changed from

==========
Reflowed the profile card in mac desktop user menu into a button (for material
design user menu).
Implemented with createMaterialDesignCurrentProfileView, which is based
on/parallel to createCurrentProfileView.
Specifically:
1. Reduced the size of profile icon and moved it to be left-aligned
2. Placed avatar name and username to the right of the profile icon
3. Changed account consistency link to be a button instead
4. Consolidated the profile info into a profile card button that leads to
manageProfile in the settings page
5. Other layout tweaks

See design doc:
https://docs.google.com/document/d/17yHrKd_EU6WoIAgljnZmNCSJLRlbM3O2Pxr7aPEnq...

Screenshots:
https://drive.google.com/corp/drive/folders/0B7Fvv7JszRyGOG9yOTl3bkJQVjQ

Mocks:
https://folio.googleplex.com/chrome-ux-specs-and-sources/Chrome%20Desktop%20S...

BUG=615893
==========

to

==========
Reflowed the profile card in mac desktop user menu into a button (for material
design user menu).
Implemented with createMaterialDesignCurrentProfileView, which is based
on/parallel to createCurrentProfileView.
Specifically:
1. Reduced the size of profile icon and moved it to be left-aligned
2. Placed avatar name and username to the right of the profile icon
3. Changed account consistency link to be a button instead
4. Consolidated the profile info into a profile card button that leads to
manageProfile in the settings page
5. Other layout tweaks

See design doc:
https://docs.google.com/document/d/17yHrKd_EU6WoIAgljnZmNCSJLRlbM3O2Pxr7aPEnq...

Screenshots:
https://drive.google.com/corp/drive/folders/0B7Fvv7JszRyGOG9yOTl3bkJQVjQ

Mocks:
https://folio.googleplex.com/chrome-ux-specs-and-sources/Chrome%20Desktop%20S...

BUG=615893

Committed: https://crrev.com/58a786ba513d0dec06fea96f0ec684a60aa50a08
Cr-Commit-Position: refs/heads/master@{#406377}
==========

[commit-bot: I haz the power, 2016-07-19 21:02:58]

Patchset 5 (id:??) landed as
https://crrev.com/58a786ba513d0dec06fea96f0ec684a60aa50a08
Cr-Commit-Position: refs/heads/master@{#406377}

[commit-bot: I haz the power, 2016-07-19 21:03:10]

CQ bit was unchecked.