[CrOS Settings] Remove grey row highlight when "Set up PIN" is tapped.

Currently, on tablets, if you tap on the "Set up PIN" button, the entire
row is highlighted grey.  The row should not be highlighted at all when
the button is tapped because it is a bad experience for the user.

This CL ensures when the user taps on the "Set up PIN" button, the row
is not highlighted grey.

Fixed: 1020087
Change-Id: Icba9e6db6b3e561fb124c2b9cb06ae43c982ae6a
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1913483Reviewed-by: Dan Beam <dbeam@chromium.org>
Commit-Queue: Regan Hsu <hsuregan@chromium.org>
Cr-Commit-Position: refs/heads/master@{#715412}

chrome/browser/resources/settings/people_page/lock_screen.html

@@ -32,6 +32,24 @@
         padding-top: 24px;
       }
 
+      cr-radio-group {
+        display: flex;
+        flex-wrap: wrap;
+      }
+
+      .list-item {
+        width: 100%;
+      }
+
+      .list-item-end {
+        align-items: center;
+        display: flex;
+      }
+
+      .list-item-start {
+        flex: 1;
+      }
+
       #lockOptionsDiv {
         display: block;
       }
@@ -84,27 +102,27 @@
                   $i18n{lockScreenPasswordOnly}
                 </div>
               </cr-radio-button>
-              <cr-radio-button name="pin+password" class="list-item">
+              <cr-radio-button name="pin+password" class="list-item-start">
                 <div id="pinPasswordDiv">
                   <div id="pinPasswordLabel">
                     $i18n{lockScreenPinOrPassword}
                   </div>
-                  <template is="dom-if"
-                      if="[[showConfigurePinButton_(selectedUnlockType)]]">
-                    <div class="separator"></div>
-                    <div id="pinPasswordSecondaryActionDiv"
-                        class="secondary-action">
-                      <!-- Use stop-keyboard-event-propagation to prevent
-                           triggering this when focused after closing the
-                           dialog. -->
-                      <cr-button id="setupPinButton" on-click="onConfigurePin_"
-                          stop-keyboard-event-propagation>
-                        [[getSetupPinText_(hasPin)]]
-                      </cr-button>
-                    </div>
-                  </template>
                 </div>
               </cr-radio-button>
+              <div class="list-item-end"
+                  hidden="[[!showConfigurePinButton_(selectedUnlockType)]]">
+                <div class="separator"></div>
+                <div id="pinPasswordSecondaryActionDiv"
+                    class="secondary-action">
+                  <!-- Use stop-keyboard-event-propagation to prevent
+                       triggering this when focused after closing the
+                       dialog. -->
+                  <cr-button id="setupPinButton" on-click="onConfigurePin_"
+                      stop-keyboard-event-propagation>
+                    [[getSetupPinText_(hasPin)]]
+                  </cr-button>
+                </div>
+              </div>
             </cr-radio-group>
           </div>
         </div>