tray: Fix garbled text in multiprofile dropdown.

Bug introduced when I was trying to show focus rectangle around user
card view by removing the background. Draw the background instead on
the parent, button_from_view, which the focus painter is on so that
the background does not cover the focus rectangle.

Also fix the separator between the user card view and the drop down,
before it only reached halfway (see bug for snapshot).

Test: manual
Bug: 786184
Change-Id: I54481c414a373a9f761d4b2f6b8097160633fbdc
Reviewed-on: https://chromium-review.googlesource.com/794853Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Commit-Queue: Sammie Quon <sammiequon@chromium.org>
Cr-Commit-Position: refs/heads/master@{#519897}

ash/system/user/button_from_view.cc

@@ -17,6 +17,7 @@
 #include "ui/views/animation/ink_drop_highlight.h"
 #include "ui/views/animation/ink_drop_impl.h"
 #include "ui/views/animation/ink_drop_mask.h"
+#include "ui/views/background.h"
 #include "ui/views/layout/fill_layout.h"
 #include "ui/views/painter.h"
 
@@ -43,6 +44,9 @@ ButtonFromView::ButtonFromView(views::View* content,
     SetFocusForPlatform();
 
   SetFocusPainter(TrayPopupUtils::CreateFocusPainter());
+
+  SetBackground(views::CreateThemedSolidBackground(
+      this, ui::NativeTheme::kColorId_BubbleBackground));
 }
 
 ButtonFromView::~ButtonFromView() = default;

ash/system/user/user_view.cc

@@ -357,9 +357,8 @@ void UserView::ToggleUserDropdownWidget() {
       color_utils::GetResultingPaintColor(kMenuSeparatorColor, bg_color));
   const int separator_horizontal_padding =
       (kTrayPopupItemMinStartWidth - kTrayItemSize) / 2;
-  separator->SetBorder(
-      views::CreateSolidSidedBorder(0, separator_horizontal_padding, 0,
-                                    separator_horizontal_padding, bg_color));
+  separator->SetBorder(views::CreateEmptyBorder(
+      0, separator_horizontal_padding, 0, separator_horizontal_padding));
   user_dropdown_padding->AddChildView(separator);
 
   // Add other logged in users.