MD User Manager: latest design change, css refactoring, accessiblity, and bug fixes

chrome/browser/resources/md_user_manager/control_bar.html

Index: chrome/browser/resources/md_user_manager/control_bar.html
diff --git a/chrome/browser/resources/md_user_manager/control_bar.html b/chrome/browser/resources/md_user_manager/control_bar.html
index 9a15c67b0850931356f5d37eb9e43808f04c82ed..3a90a240a8b3e4cf18727dd84ac32171b2255b58 100644
--- a/chrome/browser/resources/md_user_manager/control_bar.html
+++ b/chrome/browser/resources/md_user_manager/control_bar.html
@@ -8,45 +8,30 @@
   <template>
     <style include="shared-styles">
       #container {
-        padding-bottom: 12px;
-        padding-top: 12px;
-      }
-
-      paper-button {
-        border-radius: 2px;
-        color: var(--paper-grey-600);
-        font-weight: 500;
-        line-height: 32px;
-        margin: 0;
-        min-width: 52px;
-        padding: 0 16px;
-      }
-
-      #addUser {
-        margin: 0 8px;
+        align-items: center;
+        display: flex;
+        min-height: 32px;
+        padding: 12px 8px 12px 24px;
       }
 
       #logo {
+        -webkit-margin-end: auto;
         content: -webkit-image-set(
             url(../../../app/theme/default_100_percent/%DISTRIBUTION%/product_logo_name_48.png) 1x,
             url(../../../app/theme/default_200_percent/%DISTRIBUTION%/product_logo_name_48.png) 2x);
         height: 18px;
-        left: 24px;
-        position: absolute;
-        top: 19px;
-      }
-
-      :host-context([dir='rtl']) #logo {
-        left: auto;
-        right: 24px;
       }
     </style>
     <div id="container" class="layout horizontal end-justified">
       <div id="logo"></div>
-      <paper-button id="launchGuest" on-tap="onLaunchGuestTap_"
-          i18n-content="browseAsGuest" hidden="[[!showGuest]]"></paper-button>
-      <paper-button id="addUser" on-tap="onAddUserTap_"
-          i18n-content="addUser" hidden="[[!showAddPerson]]"></paper-button>
+      <paper-button id="launchGuest" class="action secondary"
+          on-tap="onLaunchGuestTap_" hidden="[[!showGuest]]">
+        $i18n{browseAsGuest}
+      </paper-button>
+      <paper-button id="addUser" class="action secondary"
+          on-tap="onAddUserTap_" hidden="[[!showAddPerson]]">
+        $i18n{addUser}
+      </paper-button>
     </div>
   </template>
   <script src="chrome://md-user-manager/control_bar.js"></script>