Change settings Forget Phone from a clickable row to a button

New screen: http://screen/GY3MX8BhZoW

Bug: 1003036
Change-Id: If70d82bfc93707ec85dd8b3123369f402bdca328
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1809611Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Reviewed-by: Bailey Berro <baileyberro@chromium.org>
Commit-Queue: Gavin Williams <gavinwill@chromium.org>
Cr-Commit-Position: refs/heads/master@{#703730}

chrome/app/settings_strings.grdp

@@ -4972,6 +4972,9 @@
     <message name="IDS_SETTINGS_MULTIDEVICE_FORGET_DEVICE_DIALOG_MESSAGE" desc="Text of a dialog that lets the user choose if their Chromebook should forget their phone. This means they will no longer have access to multidevice features.">
       Disconnect your phone from your <ph name="DEVICE_TYPE">$1<ex>Chromebook</ex></ph>. They will no longer connect automatically.
     </message>
+    <message name="IDS_SETTINGS_MULTIDEVICE_FORGET_THIS_DEVICE_DISCONNECT" desc="Text for the button that lets the user choose if their Chromebook should forget their phone. This means they will no longer have access to multidevice features.">
+      Disconnect
+    </message>
   </if>
 
   <!-- Password protection -->

chrome/browser/resources/settings/multidevice_page/multidevice_subpage.html

@@ -31,10 +31,6 @@
       #feature-items-container {
         @apply --settings-list-frame-padding;
       }
-
-      #forget-device-container {
-        border-top: var(--cr-separator-line);
-      }
     </style>
     <div class="settings-box first">
       <div id="status-text-container"
@@ -99,11 +95,17 @@
         </template>
       </div>
     </template>
-    <div id="forget-device-container">
-      <cr-link-row id="forget-device" class="hr"
-          on-click="handleForgetDeviceClick_"
-          label="$i18n{multideviceForgetDevice}"
-          sub-label="$i18n{multideviceForgetDeviceSummary}"></cr-link-row>
+    <div class="settings-box two-line">
+        <div id="forget-device-label" class="start">
+            $i18n{multideviceForgetDevice}
+            <div class="secondary">
+                $i18n{multideviceForgetDeviceSummary}
+            </div>
+        </div>
+        <cr-button on-click="handleForgetDeviceClick_"
+          aria-labelledby="forgetDeviceLabel">
+           $i18n{multideviceForgetDeviceDisconnect}
+        </cr-button>
     </div>
     <cr-dialog id="forgetDeviceDialog">
       <div slot="title">$i18n{multideviceForgetDevice}</div>
@@ -120,7 +122,7 @@
         <cr-button id="confirmButton"
             class="action-button"
             on-click="onForgetDeviceDialogConfirmClick_">
-          $i18n{confirm}
+          $i18n{multideviceForgetDeviceDisconnect}
         </cr-button>
       </div>
     </cr-dialog>

chrome/browser/ui/webui/settings/settings_localized_strings_provider.cc

@@ -3221,6 +3221,8 @@ void AddMultideviceStrings(content::WebUIDataSource* html_source) {
       {"multideviceForgetDevice", IDS_SETTINGS_MULTIDEVICE_FORGET_THIS_DEVICE},
       {"multideviceSmartLockOptions",
        IDS_SETTINGS_PEOPLE_LOCK_SCREEN_OPTIONS_LOCK},
+      {"multideviceForgetDeviceDisconnect",
+       IDS_SETTINGS_MULTIDEVICE_FORGET_THIS_DEVICE_DISCONNECT},
   };
   AddLocalizedStringsBulk(html_source, kLocalizedStrings,
                           base::size(kLocalizedStrings));