[ios] Makes small tweaks to the UIRefresh settings UI.

These tweaks are based on feedback from UX.  See the linked bug
for details.

BUG=863043

Cq-Include-Trybots: luci.chromium.try:ios-simulator-full-configs;master.tryserver.chromium.mac:ios-simulator-cronet
Change-Id: I159c77e16c567b5b670ca727425253fc8a393ebe
Reviewed-on: https://chromium-review.googlesource.com/1135289
Commit-Queue: Rohit Rao <rohitrao@chromium.org>
Reviewed-by: Justin Cohen <justincohen@chromium.org>
Cr-Commit-Position: refs/heads/master@{#575358}

ios/chrome/browser/ui/settings/autofill_profile_edit_collection_view_controller.mm

@@ -184,6 +184,7 @@ static const AutofillFieldDisplayInfo kFieldsToDisplay[] = {
     const AutofillFieldDisplayInfo& field = kFieldsToDisplay[i];
     AutofillEditItem* item =
         [[AutofillEditItem alloc] initWithType:ItemTypeField];
+    item.cellStyle = CollectionViewCellStyle::kUIKit;
     item.textFieldName = l10n_util::GetNSString(field.displayStringID);
     item.textFieldValue = base::SysUTF16ToNSString(_autofillProfile.GetInfo(
         autofill::AutofillType(field.autofillType), locale));

ios/chrome/browser/ui/settings/cells/settings_detail_item.mm

@@ -24,6 +24,9 @@ namespace {
 // two labels.
 const CGFloat kHorizontalPadding = 16;
 
+// Padding used between the icon and the text labels.
+const CGFloat kIconTrailingPadding = 12;
+
 // Padding used on the top and bottom edges of the cell.
 const CGFloat kVerticalPadding = 16;
 
@@ -134,7 +137,7 @@ const CGFloat kMinDetailTextWidthRatio = 0.25f;
                        constant:kHorizontalPadding];
     _iconVisibleConstraint = [_labelContainerGuide.leadingAnchor
         constraintEqualToAnchor:_iconImageView.trailingAnchor
-                       constant:kHorizontalPadding];
+                       constant:kIconTrailingPadding];
 
     [NSLayoutConstraint activateConstraints:@[
       [_iconImageView.leadingAnchor

ios/chrome/browser/ui/settings/cells/settings_switch_item.mm

@@ -22,6 +22,9 @@ namespace {
 // Padding used on the leading and trailing edges of the cell.
 const CGFloat kHorizontalPadding = 16;
 
+// Padding used between the icon and the text labels.
+const CGFloat kIconTrailingPadding = 12;
+
 // Padding used on the top and bottom edges of the cell.
 const CGFloat kVerticalPadding = 16;
 
@@ -122,7 +125,7 @@ const CGFloat kIconImageSize = 28;
     // Set up the constraints assuming that the icon image is hidden..
     _iconVisibleConstraint = [_textLabel.leadingAnchor
         constraintEqualToAnchor:_iconImageView.trailingAnchor
-                       constant:kHorizontalPadding];
+                       constant:kIconTrailingPadding];
     _iconHiddenConstraint = [_textLabel.leadingAnchor
         constraintEqualToAnchor:self.contentView.leadingAnchor
                        constant:kHorizontalPadding];

ios/chrome/browser/ui/settings/cells/settings_text_item.mm

@@ -90,7 +90,7 @@ const CGFloat kMinimalHeight = 48;
 - (UIFont*)detailTextFont {
   if (!_detailTextFont) {
     if (experimental_flags::IsSettingsUIRebootEnabled()) {
-      _detailTextFont = [UIFont systemFontOfSize:kUIKitDetailFontSize];
+      _detailTextFont = [UIFont systemFontOfSize:kUIKitMultilineDetailFontSize];
     } else {
       _detailTextFont = [[MDCTypography fontLoader] regularFontOfSize:14];
     }
@@ -101,7 +101,7 @@ const CGFloat kMinimalHeight = 48;
 - (UIColor*)detailTextColor {
   if (!_detailTextColor) {
     if (experimental_flags::IsSettingsUIRebootEnabled()) {
-      _detailTextColor = UIColorFromRGB(kUIKitDetailTextColor);
+      _detailTextColor = UIColorFromRGB(kUIKitMultilineDetailTextColor);
     } else {
       _detailTextColor = [[MDCPalette greyPalette] tint500];
     }

ios/chrome/browser/ui/settings/settings_collection_view_controller.mm

@@ -324,6 +324,16 @@ void SigninObserverBridge::GoogleSignedOut(const std::string& account_id,
 
 #pragma mark View lifecycle
 
+- (void)viewDidLoad {
+  [super viewDidLoad];
+
+  // Change the separator inset from the settings default because this
+  // collectionview shows leading icons.
+  const CGFloat kSettingsSeparatorLeadingInset = 56;
+  self.styler.separatorInset =
+      UIEdgeInsetsMake(0, kSettingsSeparatorLeadingInset, 0, 0);
+}
+
 // TODO(crbug.com/661915): Refactor TemplateURLObserver and re-implement this so
 // it observes the default search engine name instead of reloading on
 // ViewWillAppear.

ios/chrome/browser/ui/settings/settings_navigation_controller.mm

@@ -538,6 +538,13 @@ initWithRootViewController:(UIViewController*)rootViewController
     appBarContainer.view.backgroundColor = [UIColor whiteColor];
     ConfigureAppBarWithCardStyle(appBarContainer.appBar);
 
+    // Override the header view's background color if the UIRefresh experiment
+    // is enabled.
+    if (experimental_flags::IsSettingsUIRebootEnabled()) {
+      appBarContainer.appBar.headerViewController.headerView.backgroundColor =
+          [UIColor groupTableViewBackgroundColor];
+    }
+
     // Register the app bar container and return it.
     [self registerAppBarContainer:appBarContainer];
     return appBarContainer;

ios/chrome/browser/ui/settings/settings_root_collection_view_controller.mm

@@ -9,6 +9,7 @@
 
 #include "ios/chrome/browser/browser_state/chrome_browser_state.h"
 #import "ios/chrome/browser/experimental_flags.h"
+#import "ios/chrome/browser/ui/collection_view/cells/collection_view_cell_constants.h"
 #import "ios/chrome/browser/ui/commands/application_commands.h"
 #import "ios/chrome/browser/ui/commands/open_new_tab_command.h"
 #import "ios/chrome/browser/ui/settings/bar_button_activity_indicator.h"
@@ -17,6 +18,7 @@
 #include "ios/chrome/browser/ui/ui_util.h"
 #import "ios/chrome/browser/ui/uikit_ui_util.h"
 #include "ios/chrome/grit/ios_strings.h"
+#import "ios/third_party/material_components_ios/src/components/AppBar/src/MaterialAppBar.h"
 #import "ios/third_party/material_components_ios/src/components/Collections/src/MaterialCollections.h"
 #include "ui/base/l10n/l10n_util.h"
 
@@ -58,11 +60,13 @@ const CGFloat kActivityIndicatorDimensionIPhone = 56;
     self.collectionView.backgroundColor =
         [UIColor groupTableViewBackgroundColor];
     self.styler.cellStyle = MDCCollectionViewCellStyleGrouped;
-    self.styler.separatorInset = UIEdgeInsetsMake(0, 48, 0, 0);
+    self.styler.separatorColor = UIColorFromRGB(kUIKitSeparatorColor);
+    self.appBar.headerViewController.headerView.backgroundColor =
+        [UIColor groupTableViewBackgroundColor];
   } else {
     self.styler.cellStyle = MDCCollectionViewCellStyleCard;
-    self.styler.separatorInset = UIEdgeInsetsMake(0, 16, 0, 16);
   }
+  self.styler.separatorInset = UIEdgeInsetsMake(0, 16, 0, 16);
 }
 
 - (void)viewWillAppear:(BOOL)animated {

ios/chrome/browser/ui/settings/sync_create_passphrase_collection_view_controller.mm

@@ -10,6 +10,7 @@
 #import "base/mac/foundation_util.h"
 #include "base/strings/sys_string_conversions.h"
 #include "components/strings/grit/components_strings.h"
+#import "ios/chrome/browser/experimental_flags.h"
 #import "ios/chrome/browser/ui/collection_view/cells/collection_view_item.h"
 #import "ios/chrome/browser/ui/collection_view/collection_view_model.h"
 #import "ios/chrome/browser/ui/settings/cells/byo_textfield_item.h"
@@ -86,7 +87,9 @@ using namespace sync_encryption_passphrase;
 - (CollectionViewItem*)confirmPassphraseItem {
   if (!confirmPassphrase_) {
     confirmPassphrase_ = [[UITextField alloc] init];
+    if (!experimental_flags::IsSettingsUIRebootEnabled()) {
       [confirmPassphrase_ setFont:[MDCTypography body1Font]];
+    }
     [confirmPassphrase_ setSecureTextEntry:YES];
     [confirmPassphrase_ setBackgroundColor:[UIColor clearColor]];
     [confirmPassphrase_ setAutoresizingMask:UIViewAutoresizingFlexibleWidth];

ios/chrome/browser/ui/settings/sync_encryption_passphrase_collection_view_controller.mm

@@ -18,6 +18,7 @@
 #include "ios/chrome/browser/application_context.h"
 #include "ios/chrome/browser/browser_state/chrome_browser_state.h"
 #include "ios/chrome/browser/chrome_url_constants.h"
+#import "ios/chrome/browser/experimental_flags.h"
 #import "ios/chrome/browser/signin/authentication_service.h"
 #include "ios/chrome/browser/signin/authentication_service_factory.h"
 #include "ios/chrome/browser/signin/profile_oauth2_token_service_factory.h"
@@ -25,6 +26,7 @@
 #include "ios/chrome/browser/sync/sync_setup_service.h"
 #include "ios/chrome/browser/sync/sync_setup_service_factory.h"
 #import "ios/chrome/browser/ui/collection_view/cells/MDCCollectionViewCell+Chrome.h"
+#import "ios/chrome/browser/ui/collection_view/cells/collection_view_cell_constants.h"
 #import "ios/chrome/browser/ui/collection_view/cells/collection_view_footer_item.h"
 #import "ios/chrome/browser/ui/collection_view/cells/collection_view_item.h"
 #import "ios/chrome/browser/ui/collection_view/collection_view_model.h"
@@ -237,7 +239,9 @@ const CGFloat kSpinnerButtonPadding = 18;
     [self unregisterTextField:passphrase_];
   }
   passphrase_ = [[UITextField alloc] init];
+  if (!experimental_flags::IsSettingsUIRebootEnabled()) {
     [passphrase_ setFont:[MDCTypography body1Font]];
+  }
   [passphrase_ setSecureTextEntry:YES];
   [passphrase_ setBackgroundColor:[UIColor clearColor]];
   [passphrase_ setAutoresizingMask:UIViewAutoresizingFlexibleWidth];
@@ -324,9 +328,14 @@ const CGFloat kSpinnerButtonPadding = 18;
   if (item.type == ItemTypeMessage) {
     CardMultilineCell* messageCell =
         base::mac::ObjCCastStrict<CardMultilineCell>(cell);
+    if (experimental_flags::IsSettingsUIRebootEnabled()) {
+      messageCell.textLabel.font =
+          [UIFont boldSystemFontOfSize:kUIKitMainFontSize];
+    } else {
       messageCell.textLabel.font =
           [[MDCTypography fontLoader] mediumFontOfSize:14];
     }
+  }
   return cell;
 }
 

ios/chrome/browser/ui/settings/translate_collection_view_controller.mm

@@ -112,7 +112,6 @@ NSString* const kTranslateSettingsCategory = @"ChromeTranslateSettings";
       [[SettingsTextItem alloc] initWithType:ItemTypeResetTranslate];
   resetTranslate.text = l10n_util::GetNSString(IDS_IOS_TRANSLATE_SETTING_RESET);
   resetTranslate.accessibilityTraits |= UIAccessibilityTraitButton;
-  resetTranslate.textFont = [MDCTypography body2Font];
   [model addItem:resetTranslate
       toSectionWithIdentifier:SectionIdentifierTranslate];