[Sharesheet] Update Sharesheet_bubble typography.

This CL adds new typography contexts to ChromeTypography to be
in the Sharesheet. This allows us to align typography with the
mocks, linked in the bug.

Bug: 1141744
Change-Id: Ic15e6f068d62919f71a7d5f89ac5e4ad6fe61fd8
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2525382Reviewed-by: Bret Sepulveda <bsep@chromium.org>
Reviewed-by: Scott Violet <sky@chromium.org>
Commit-Queue: Melissa Zhang <melzhang@chromium.org>
Cr-Commit-Position: refs/heads/master@{#834419}

ash/public/cpp/ash_typography.cc

@@ -9,14 +9,23 @@ namespace ash {
 void ApplyAshFontStyles(int context,
                         int style,
                         int* size_delta,
-                        gfx::Font::Weight* font_weight) {
+                        gfx::Font::Weight* font_weight,
+                        std::string* typeface) {
   switch (context) {
+    case CONTEXT_SHARESHEET_BUBBLE_BODY_SECONDARY:
+      *size_delta = 1;
+      break;
     case CONTEXT_LAUNCHER_BUTTON:
+    case CONTEXT_SHARESHEET_BUBBLE_BODY:
       *size_delta = 2;
       break;
     case CONTEXT_TOAST_OVERLAY:
       *size_delta = 3;
       break;
+    case CONTEXT_SHARESHEET_BUBBLE_TITLE:
+      *size_delta = 4;
+      *typeface = "Google Sans";
+      break;
     case CONTEXT_TRAY_POPUP_BUTTON:
       *font_weight = gfx::Font::Weight::MEDIUM;
       break;
@@ -29,6 +38,12 @@ void ApplyAshFontStyles(int context,
     case STYLE_EMPHASIZED:
       *font_weight = gfx::Font::Weight::SEMIBOLD;
       break;
+    case STYLE_SHARESHEET:
+      DCHECK(context == CONTEXT_SHARESHEET_BUBBLE_TITLE ||
+             context == CONTEXT_SHARESHEET_BUBBLE_BODY ||
+             context == CONTEXT_SHARESHEET_BUBBLE_BODY_SECONDARY);
+      *font_weight = gfx::Font::Weight::MEDIUM;
+      break;
   }
 }
 

ash/public/cpp/ash_typography.h

@@ -26,6 +26,16 @@ enum AshTextContext {
   // A headline label that appears in a larger window.
   CONTEXT_HEADLINE_OVERSIZED,
 
+  // Title label in the Sharesheet bubble. Medium weight. Usually 16pt.
+  CONTEXT_SHARESHEET_BUBBLE_TITLE,
+
+  // Body text label in the Sharesheet bubble. Meidum weight. Usually 14pt.
+  CONTEXT_SHARESHEET_BUBBLE_BODY,
+
+  // Body text label in the Sharesheet bubble. Generally appears under body
+  // text. Usually 13pt.
+  CONTEXT_SHARESHEET_BUBBLE_BODY_SECONDARY,
+
   ASH_TEXT_CONTEXT_END
 };
 
@@ -36,6 +46,9 @@ enum AshTextStyle {
   // string.
   STYLE_EMPHASIZED = ASH_TEXT_STYLE_START,
 
+  // Text styling specifically for the Chrome OS sharesheet.
+  STYLE_SHARESHEET,
+
   ASH_TEXT_STYLE_END
 };
 
@@ -44,7 +57,8 @@ enum AshTextStyle {
 void ASH_PUBLIC_EXPORT ApplyAshFontStyles(int context,
                                           int style,
                                           int* size_delta,
-                                          gfx::Font::Weight* font_weight);
+                                          gfx::Font::Weight* font_weight,
+                                          std::string* typeface);
 
 }  // namespace ash
 

chrome/browser/ui/views/chrome_typography_provider.cc

@@ -41,7 +41,7 @@ const gfx::FontList& ChromeTypographyProvider::GetFont(int context,
   gfx::Font::Weight font_weight = gfx::Font::Weight::NORMAL;
 
 #if BUILDFLAG(IS_CHROMEOS_ASH)
-  ash::ApplyAshFontStyles(context, style, &size_delta, &font_weight);
+  ash::ApplyAshFontStyles(context, style, &size_delta, &font_weight, &typeface);
 #endif
 
   ApplyCommonFontStyles(context, style, &size_delta, &font_weight);

chrome/browser/ui/views/sharesheet/sharesheet_bubble_view.cc

@@ -7,6 +7,7 @@
 #include <memory>
 #include <utility>
 
+#include "ash/public/cpp/ash_typography.h"
 #include "base/i18n/rtl.h"
 #include "base/strings/string16.h"
 #include "base/time/time.h"
@@ -77,9 +78,6 @@ constexpr int kShortSpacing = 20;
 constexpr int kSpacing = 24;
 constexpr int kTitleLineHeight = 24;
 
-constexpr char kTitleFont[] = "GoogleSans, Medium, 16px";
-constexpr char kExpandViewTitleFont[] = "Roboto, Medium, 15px";
-
 constexpr SkColor kShareTitleColor = gfx::kGoogleGrey900;
 constexpr SkColor kShareTargetTitleColor = gfx::kGoogleGrey700;
 
@@ -135,8 +133,8 @@ void SharesheetBubbleView::ShowBubble(
 
   // Add Title label
   auto* title = main_view_->AddChildView(std::make_unique<views::Label>(
-      l10n_util::GetStringUTF16(IDS_SHARESHEET_TITLE_LABEL)));
-  title->SetFontList(gfx::FontList(kTitleFont));
+      l10n_util::GetStringUTF16(IDS_SHARESHEET_TITLE_LABEL),
+      ash::CONTEXT_SHARESHEET_BUBBLE_TITLE, ash::STYLE_SHARESHEET));
   title->SetLineHeight(kTitleLineHeight);
   title->SetEnabledColor(kShareTitleColor);
   title->SetHorizontalAlignment(gfx::ALIGN_LEFT);
@@ -148,9 +146,11 @@ void SharesheetBubbleView::ShowBubble(
     image->SetImage(*ui::ResourceBundle::GetSharedInstance().GetImageSkiaNamed(
         IDR_SHARESHEET_EMPTY));
     image->SetProperty(views::kMarginsKey, gfx::Insets(0, 0, kSpacing, 0));
-    // TODO(crbug.com/1138037) Update label typography.
-    main_view_->AddChildView(std::make_unique<views::Label>(
-        l10n_util::GetStringUTF16(IDS_SHARESHEET_ZERO_STATE_LABEL)));
+    auto* zero_state_label =
+        main_view_->AddChildView(std::make_unique<views::Label>(
+            l10n_util::GetStringUTF16(IDS_SHARESHEET_ZERO_STATE_LABEL),
+            ash::CONTEXT_SHARESHEET_BUBBLE_BODY, ash::STYLE_SHARESHEET));
+    zero_state_label->SetLineHeight(kShortSpacing);
   } else {
     auto scroll_view = std::make_unique<views::ScrollView>();
     scroll_view->SetContents(MakeScrollableTargetView(std::move(targets)));
@@ -214,8 +214,8 @@ std::unique_ptr<views::View> SharesheetBubbleView::MakeScrollableTargetView(
                             kExpandViewTitleLabelHeight);
   auto* apps_list_label =
       expanded_layout->AddView(std::make_unique<views::Label>(
-          l10n_util::GetStringUTF16(IDS_SHARESHEET_APPS_LIST_LABEL)));
-  apps_list_label->SetFontList(gfx::FontList(kExpandViewTitleFont));
+          l10n_util::GetStringUTF16(IDS_SHARESHEET_APPS_LIST_LABEL),
+          ash::CONTEXT_SHARESHEET_BUBBLE_BODY, ash::STYLE_SHARESHEET));
   apps_list_label->SetLineHeight(kExpandViewTitleLabelHeight);
   apps_list_label->SetEnabledColor(kShareTargetTitleColor);
   apps_list_label->SetHorizontalAlignment(gfx::ALIGN_CENTER);

chrome/browser/ui/views/sharesheet/sharesheet_expand_button.cc

@@ -4,6 +4,7 @@
 
 #include "chrome/browser/ui/views/sharesheet/sharesheet_expand_button.h"
 
+#include "ash/public/cpp/ash_typography.h"
 #include "chrome/app/vector_icons/vector_icons.h"
 #include "chrome/grit/generated_resources.h"
 #include "third_party/skia/include/core/SkColor.h"
@@ -22,7 +23,6 @@ constexpr int kLineHeight = 20;
 constexpr int kBetweenChildSpacing = 8;
 constexpr int kMarginSpacing = 24;
 
-constexpr char kLabelFont[] = "Roboto, Medium, 14px";
 constexpr SkColor kLabelColor = gfx::kGoogleBlue600;
 
 }  // namespace
@@ -36,8 +36,9 @@ SharesheetExpandButton::SharesheetExpandButton(PressedCallback callback)
 
   icon_ = AddChildView(std::make_unique<views::ImageView>());
 
-  label_ = AddChildView(std::make_unique<views::Label>());
-  label_->SetFontList(gfx::FontList(kLabelFont));
+  label_ = AddChildView(std::make_unique<views::Label>(
+      base::string16(), ash::CONTEXT_SHARESHEET_BUBBLE_BODY,
+      ash::STYLE_SHARESHEET));
   label_->SetLineHeight(kLineHeight);
   label_->SetEnabledColor(kLabelColor);
 

chrome/browser/ui/views/sharesheet/sharesheet_target_button.cc

@@ -6,6 +6,7 @@
 
 #include <memory>
 
+#include "ash/public/cpp/ash_typography.h"
 #include "base/strings/strcat.h"
 #include "base/strings/utf_string_conversions.h"
 #include "third_party/skia/include/core/SkColor.h"
@@ -28,9 +29,6 @@ constexpr int kButtonLineHeight = 20;
 constexpr int kButtonMaxLines = 2;
 constexpr int kButtonPadding = 8;
 
-constexpr char kButtonLabelFont[] = "Roboto, Medium, 14px";
-constexpr char kButtonSecondaryLabelFont[] = "Roboto, Regular, 13px";
-
 constexpr SkColor kShareTargetTitleColor = gfx::kGoogleGrey700;
 constexpr SkColor kShareTargetSecondaryTitleColor = gfx::kGoogleGrey600;
 
@@ -82,18 +80,20 @@ SharesheetTargetButton::SharesheetTargetButton(
   label_view->SetLayoutManager(std::make_unique<views::BoxLayout>(
       views::BoxLayout::Orientation::kVertical, gfx::Insets(), 0, true));
 
-  auto* label =
-      label_view->AddChildView(std::make_unique<views::Label>(display_name));
-  label->SetFontList(gfx::FontList(kButtonLabelFont));
+  auto* label = label_view->AddChildView(std::make_unique<views::Label>(
+      display_name, ash::CONTEXT_SHARESHEET_BUBBLE_BODY,
+      ash::STYLE_SHARESHEET));
   label->SetEnabledColor(kShareTargetTitleColor);
   SetLabelProperties(label);
 
   base::string16 accessible_name = display_name;
   if (secondary_display_name != base::string16() &&
       secondary_display_name != display_name) {
-    auto* secondary_label = label_view->AddChildView(
-        std::make_unique<views::Label>(secondary_display_name));
-    secondary_label->SetFontList(gfx::FontList(kButtonSecondaryLabelFont));
+    auto* secondary_label =
+        label_view->AddChildView(std::make_unique<views::Label>(
+            secondary_display_name,
+            ash::CONTEXT_SHARESHEET_BUBBLE_BODY_SECONDARY,
+            ash::STYLE_SHARESHEET));
     secondary_label->SetEnabledColor(kShareTargetSecondaryTitleColor);
     SetLabelProperties(secondary_label);
     accessible_name = base::StrCat(