ChromeOS GAIA: Fixed size for close and back buttons on signin and enrollment screens

BUG=470869

Review URL: https://codereview.chromium.org/1109823002

Cr-Commit-Position: refs/heads/master@{#327064}

chrome/browser/resources/chromeos/login/oobe_screen_oauth_enrollment_webview.css

@@ -137,20 +137,12 @@
 }
 
 #oauth-enroll-cancel-button {
-  background: transparent none;
   background-image: url(chrome://theme/IDR_LOGIN_CLOSE_BUTTTON);
-  background-position: center;
-  background-repeat: no-repeat;
-  height: 14px;
-  position: absolute;
-  right: 15px;
-  top: 15px;
-  width: 14px;
-  z-index: 1;
+  right: 0;
 }
 
 html[dir=rtl] #oauth-enroll-cancel-button {
-  left: 15px;
+  left: 0;
   right: auto;
 }
 
@@ -163,22 +155,14 @@ html[dir=rtl] #oauth-enroll-cancel-button {
 }
 
 #oauth-enroll-back-button {
-  background: transparent none;
   background-image: url(chrome://theme/IDR_LOGIN_BACK_BUTTTON);
-  background-position: center;
-  background-repeat: no-repeat;
-  height: 18px;
-  left: 14px;
-  position: absolute;
-  top: 14px;
-  width: 18px;
-  z-index: 1;
+  left: 0;
 }
 
 html[dir=rtl] #oauth-enroll-back-button {
   -webkit-transform: scaleX(-1);
   left: auto;
-  right: 14px;
+  right: 0;
 }
 
 #oauth-enrollment.saml #oauth-enroll-back-button {

chrome/browser/resources/chromeos/login/oobe_screen_oauth_enrollment_webview.html

@@ -3,8 +3,8 @@
      found in the LICENSE file. -->
 
 <div id="oauth-enrollment" class="step no-logo hidden" hidden>
-  <div id="oauth-enroll-cancel-button" class="oauth-enroll-button"></div>
-  <div id="oauth-enroll-back-button" class="oauth-enroll-button" hidden></div>
+  <div id="oauth-enroll-cancel-button" class="custom-gaia-button"></div>
+  <div id="oauth-enroll-back-button" class="custom-gaia-button" hidden></div>
   <div id="oauth-enroll-step-contents">
     <div id="oauth-enroll-step-signin">
       <div id="oauth-enroll-auth-view-container"></div>

chrome/browser/resources/chromeos/login/screen_gaia_signin.css

@@ -69,21 +69,24 @@ throbber-notice {
   display: none;
 }
 
-#close-button-item {
+.custom-gaia-button {
   background: transparent none;
-  background-image: url(chrome://theme/IDR_LOGIN_CLOSE_BUTTTON);
   background-position: center;
   background-repeat: no-repeat;
-  height: 14px;
+  height: 34px;
   position: absolute;
-  right: 15px;
-  top: 15px;
-  width: 14px;
+  top: 0;
+  width: 34px;
   z-index: 1;
 }
 
+#close-button-item {
+  background-image: url(chrome://theme/IDR_LOGIN_CLOSE_BUTTTON);
+  right: 0;
+}
+
 html[dir=rtl] #close-button-item {
-  left: 15px;
+  left: 0;
   right: auto;
 }
 
@@ -105,22 +108,14 @@ html[dir=rtl] #close-button-item {
 }
 
 #back-button-item {
-  background: transparent none;
   background-image: url(chrome://theme/IDR_LOGIN_BACK_BUTTTON);
-  background-position: center;
-  background-repeat: no-repeat;
-  height: 18px;
-  left: 14px;
-  position: absolute;
-  top: 14px;
-  width: 18px;
-  z-index: 1;
+  left: 0;
 }
 
 html[dir=rtl] #back-button-item {
   -webkit-transform: scaleX(-1);
   left: auto;
-  right: 14px;
+  right: 0;
 }
 
 .new-gaia-flow .full-width #back-button-item {

chrome/browser/resources/chromeos/login/screen_gaia_signin.html

@@ -44,8 +44,8 @@
   <div id="saml-notice-container" hidden>
     <span id="saml-notice-message"></span>
   </div>
-  <button id="back-button-item" class="custom-appearance" hidden
-      i18n-values="aria-label:backButton" tabindex="0"></button>
-  <button id="close-button-item" class="custom-appearance" hidden
-      i18n-values="aria-label:closeButton" tabindex="0"></button>
+  <button id="back-button-item" class="custom-appearance custom-gaia-button"
+      hidden i18n-values="aria-label:backButton" tabindex="0"></button>
+  <button id="close-button-item" class="custom-appearance custom-gaia-button"
+      hidden i18n-values="aria-label:closeButton" tabindex="0"></button>
 </div>