[Save card dialog] Add spacer between CC number and exp. date

In the new dialog proposal, expiration date is aligned on the right for
LTR language, and on the left for RTL languages.

Bug: 852094
Change-Id: I255ad02c270bca3fc7f2fa548d54a4ec889d278b
Reviewed-on: https://chromium-review.googlesource.com/1097938
Commit-Queue: Fabio Tirelo <ftirelo@chromium.org>
Reviewed-by: Evan Stade <estade@chromium.org>
Cr-Commit-Position: refs/heads/master@{#567110}

chrome/browser/ui/views/autofill/save_card_bubble_views.cc

@@ -237,9 +237,11 @@ std::unique_ptr<views::View> SaveCardBubbleViews::CreateMainContentView() {
 
   // Add the card type icon, last four digits and expiration date.
   auto* description_view = new views::View();
-  description_view->SetLayoutManager(std::make_unique<views::BoxLayout>(
-      views::BoxLayout::kHorizontal, gfx::Insets(),
-      provider->GetDistanceMetric(views::DISTANCE_RELATED_BUTTON_HORIZONTAL)));
+  views::BoxLayout* box_layout =
+      description_view->SetLayoutManager(std::make_unique<views::BoxLayout>(
+          views::BoxLayout::kHorizontal, gfx::Insets(),
+          provider->GetDistanceMetric(
+              views::DISTANCE_RELATED_BUTTON_HORIZONTAL)));
   view->AddChildView(description_view);
 
   const CreditCard& card = controller_->GetCard();
@@ -253,6 +255,13 @@ std::unique_ptr<views::View> SaveCardBubbleViews::CreateMainContentView() {
 
   description_view->AddChildView(
       new views::Label(card.NetworkAndLastFourDigits()));
+
+  // The spacer will stretch to use the available horizontal space in the
+  // dialog, which will end-align the expiration date label.
+  auto* spacer = new views::View();
+  description_view->AddChildView(spacer);
+  box_layout->SetFlexForView(spacer, /*flex=*/1);
+
   description_view->AddChildView(
       new views::Label(card.AbbreviatedExpirationDateForDisplay()));