[profile-menu] Add background color to sync info box

Screenshots:
https://drive.google.com/file/d/15byLhToggWs-whPy7-fxJxIcJpMMbNkO/view?usp=sharing
https://drive.google.com/file/d/1VWQuo6TPG7R6mUid_UtJ9P-LzxZ3UXdU/view?usp=sharing
https://drive.google.com/file/d/1xUccQH98t4GY4tuf-nXrDfBAOz_RxXg8/view?usp=sharing

Bug: 1016915
Change-Id: I00c9cf3094e4d3a870a0bba8cc9413dd14428462
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1874466
Commit-Queue: Thomas Tangl <tangltom@chromium.org>
Auto-Submit: Thomas Tangl <tangltom@chromium.org>
Reviewed-by: Mihai Sardarescu <msarda@chromium.org>
Cr-Commit-Position: refs/heads/master@{#708590}

chrome/browser/ui/views/profiles/profile_menu_view.cc

@@ -143,6 +143,16 @@ int CountBrowsersFor(Profile* profile) {
   return browser_count;
 }
 
+SkColor GetSyncErrorBackgroundColor(bool sync_paused) {
+  constexpr int kAlpha = 16;
+  ui::NativeTheme::ColorId base_color_id =
+      sync_paused ? ui::NativeTheme::kColorId_ProminentButtonColor
+                  : ui::NativeTheme::kColorId_AlertSeverityHigh;
+  SkColor base_color =
+      ui::NativeTheme::GetInstanceForNativeUi()->GetSystemColor(base_color_id);
+  return SkColorSetA(base_color, kAlpha);
+}
+
 }  // namespace
 
 // ProfileMenuView ---------------------------------------------------------
@@ -526,16 +536,17 @@ void ProfileMenuView::BuildSyncInfo() {
           base::BindRepeating(&ProfileMenuView::OnSyncSettingsButtonClicked,
                               base::Unretained(this)));
     } else {
+      bool sync_paused = (error == sync_ui_util::AUTH_ERROR);
       // Overwrite error description with short version for the menu.
-      description_string_id = (error == sync_ui_util::AUTH_ERROR)
-                                  ? IDS_PROFILES_DICE_SYNC_PAUSED_TITLE
-                                  : IDS_SYNC_ERROR_USER_MENU_TITLE;
+      description_string_id = sync_paused ? IDS_PROFILES_DICE_SYNC_PAUSED_TITLE
+                                          : IDS_SYNC_ERROR_USER_MENU_TITLE;
 
       SetSyncInfo(
           GetSyncIcon(), l10n_util::GetStringUTF16(description_string_id),
           l10n_util::GetStringUTF16(button_string_id),
           base::BindRepeating(&ProfileMenuView::OnSyncErrorButtonClicked,
                               base::Unretained(this), error));
+      SetSyncInfoBackgroundColor(GetSyncErrorBackgroundColor(sync_paused));
     }
     return;
   }
@@ -561,6 +572,10 @@ void ProfileMenuView::BuildSyncInfo() {
                 base::BindRepeating(&ProfileMenuView::OnSigninButtonClicked,
                                     base::Unretained(this)));
   }
+
+  SetSyncInfoBackgroundColor(
+      ui::NativeTheme::GetInstanceForNativeUi()->GetSystemColor(
+          ui::NativeTheme::kColorId_HighlightedMenuItemBackgroundColor));
 }
 
 void ProfileMenuView::BuildFeatureButtons() {

chrome/browser/ui/views/profiles/profile_menu_view_base.cc

@@ -383,6 +383,12 @@ void ProfileMenuViewBase::SetSyncInfo(const gfx::ImageSkia& icon,
   RegisterClickAction(button, std::move(action));
 }
 
+void ProfileMenuViewBase::SetSyncInfoBackgroundColor(SkColor bg_color) {
+  sync_info_container_->SetBackground(views::CreateRoundedRectBackground(
+      bg_color, views::LayoutProvider::Get()->GetCornerRadiusMetric(
+                    views::EMPHASIS_HIGH)));
+}
+
 void ProfileMenuViewBase::AddShortcutFeatureButton(
     const gfx::ImageSkia& icon,
     const base::string16& text,

chrome/browser/ui/views/profiles/profile_menu_view_base.h

@@ -131,6 +131,7 @@ class ProfileMenuViewBase : public content::WebContentsDelegate,
                    const base::string16& description,
                    const base::string16& clickable_text,
                    base::RepeatingClosure action);
+  void SetSyncInfoBackgroundColor(SkColor bg_color);
   void AddShortcutFeatureButton(const gfx::ImageSkia& icon,
                                 const base::string16& text,
                                 base::RepeatingClosure action);