Bug 1028029 - Improve accesskeys in Sync pane of in-content preferences draft
authorFischer.json <fischer.json@gmail.com>
Tue, 13 Sep 2016 15:27:43 +0800
changeset 415332 3c99d4738218aeb1b38d6ccd8defd20a86b905fe
parent 412834 b1156b0eb96fcb49966b20e5fcf6a01f634ea2ee
child 531590 bd48ea7f2b2af6d4debf2df184b5ef5ca70bf777
push id29851
push userbmo:fliu@mozilla.com
push dateTue, 20 Sep 2016 06:36:53 +0000
bugs1028029
milestone51.0a1
Bug 1028029 - Improve accesskeys in Sync pane of in-content preferences MozReview-Commit-ID: JL4qlQavo0l
browser/components/preferences/in-content/sync.xul
browser/locales/en-US/chrome/browser/preferences/sync.dtd
browser/themes/shared/incontentprefs/preferences.inc.css
--- a/browser/components/preferences/in-content/sync.xul
+++ b/browser/components/preferences/in-content/sync.xul
@@ -127,18 +127,17 @@
     <groupbox class="syncGroupBox">
       <grid>
         <columns>
           <column/>
           <column flex="1"/>
         </columns>
         <rows>
           <row align="center">
-            <label accesskey="&syncDeviceName.accesskey;"
-                   control="syncComputerName">
+            <label control="syncComputerName">
               &syncDeviceName.label;
             </label>
             <textbox id="syncComputerName"/>
           </row>
         </rows>
       </grid>
       <hbox>
         <label id="unlinkDevice" class="text-link">
@@ -180,19 +179,19 @@
             <label id="noFxaCaption">&signedOut.caption;</label>
             <description id="noFxaDescription" flex="1">&signedOut.description;</description>
             <hbox class="fxaAccountBox">
               <vbox>
                 <image class="fxaFirefoxLogo"/>
               </vbox>
               <vbox flex="1">
                 <label id="signedOutAccountBoxTitle">&signedOut.accountBox.title;</label>
-                <hbox class="fxaAccountBoxButtons" align="center">
-                  <button id="noFxaSignUp" label="&signedOut.accountBox.create;"></button>
-                  <button id="noFxaSignIn" label="&signedOut.accountBox.signin;"></button>
+                <hbox class="fxaAccountBoxButtons">
+                  <button id="noFxaSignUp" label="&signedOut.accountBox.create;" accesskey="&signedOut.accountBox.create.accesskey;"></button>
+                  <button id="noFxaSignIn" label="&signedOut.accountBox.signin;" accesskey="&signedOut.accountBox.signin.accesskey;"></button>
                 </hbox>
               </vbox>
             </hbox>
           </vbox>
         </groupbox>
       </vbox>
       <vbox>
         <image class="fxaSyncIllustration"/>
@@ -225,21 +224,22 @@
                     role="button"
                     onclick="gSyncPane.openChangeProfileImage(event);" hidden="true"
                     onkeypress="gSyncPane.openChangeProfileImage(event);"
                     tooltiptext="&profilePicture.tooltip;"/>
               </vbox>
               <vbox flex="1" pack="center">
                 <label id="fxaDisplayName" hidden="true"/>
                 <label id="fxaEmailAddress1"/>
-                <hbox class="fxaAccountBoxButtons" align="center">
-                  <button id="fxaUnlinkButton" label="&disconnect.label;"/>
-                  <label id="verifiedManage" class="text-link"
+                <hbox class="fxaAccountBoxButtons">
+                  <button id="fxaUnlinkButton" label="&disconnect.label;" accesskey="&disconnect.label.accesskey;"/>
+                  <html:a id="verifiedManage" target="_blank"
+                         accesskey="&verifiedManage.label.accesskey;"
                          onkeypress="gSyncPane.openManageFirefoxAccount(event);"><!--
-                  -->&verifiedManage.label;</label>
+                  -->&verifiedManage.label;</html:a>
                 </hbox>
               </vbox>
             </hbox>
 
             <!-- logged in to an unverified account -->
             <hbox id="fxaLoginUnverified" class="fxaAccountBox">
               <vbox>
                 <image id="fxaProfileImage"/>
@@ -248,19 +248,19 @@
                 <hbox>
                   <vbox><image id="fxaLoginRejectedWarning"/></vbox>
                   <description flex="1">
                     &signedInUnverified.beforename.label;
                     <label id="fxaEmailAddress2"/>
                     &signedInUnverified.aftername.label;
                   </description>
                 </hbox>
-                <hbox class="fxaAccountBoxButtons" align="center">
-                  <button id="verifyFxaAccount">&verify.label;</button>
-                  <button id="unverifiedUnlinkFxaAccount">&forget.label;</button>
+                <hbox class="fxaAccountBoxButtons">
+                  <button id="verifyFxaAccount" accesskey="&verify.label.accesskey;">&verify.label;</button>
+                  <button id="unverifiedUnlinkFxaAccount" accesskey="&forget.label.accesskey;">&forget.label;</button>
                 </hbox>
               </vbox>
             </hbox>
 
             <!-- logged in locally but server rejected credentials -->
             <hbox id="fxaLoginRejected" class="fxaAccountBox">
               <vbox>
                 <image id="fxaProfileImage"/>
@@ -269,19 +269,19 @@
                 <hbox>
                   <vbox><image id="fxaLoginRejectedWarning"/></vbox>
                   <description flex="1">
                     &signedInLoginFailure.beforename.label;
                     <label id="fxaEmailAddress3"/>
                     &signedInLoginFailure.aftername.label;
                   </description>
                 </hbox>
-                <hbox class="fxaAccountBoxButtons" align="center">
-                  <button id="rejectReSignIn">&signIn.label;</button>
-                  <button id="rejectUnlinkFxaAccount">&forget.label;</button>
+                <hbox class="fxaAccountBoxButtons">
+                  <button id="rejectReSignIn" accessky="&signIn.label.accesskey;">&signIn.label;</button>
+                  <button id="rejectUnlinkFxaAccount" accesskey="&rejectUnlinkFxaAccount.forget.label.accesskey;">&forget.label;</button>
                 </hbox>
               </vbox>
             </hbox>
           </deck>
         </groupbox>
         <groupbox id="syncOptions">
           <caption><label>&signedIn.engines.label;</label></caption>
           <hbox id="fxaSyncEngines">
@@ -312,31 +312,33 @@
         </groupbox>
       </vbox>
       <vbox>
         <image class="fxaSyncIllustration"/>
       </vbox>
     </hbox>
     <groupbox>
       <caption>
-        <label accesskey="&syncDeviceName.accesskey;"
-               control="fxaSyncComputerName">
+        <label control="fxaSyncComputerName">
           &fxaSyncDeviceName.label;
         </label>
       </caption>
       <hbox id="fxaDeviceName">
         <textbox id="fxaSyncComputerName" disabled="true"/>
         <hbox>
           <button id="fxaChangeDeviceName"
-                  label="&changeSyncDeviceName.label;"/>
+                  label="&changeSyncDeviceName.label;"
+                  accesskey="&changeSyncDeviceName.label.accesskey;"/>
           <button id="fxaCancelChangeDeviceName"
                   label="&cancelChangeSyncDeviceName.label;"
+                  accesskey="&cancelChangeSyncDeviceName.label.accesskey;"
                   hidden="true"/>
           <button id="fxaSaveChangeDeviceName"
                   label="&saveChangeSyncDeviceName.label;"
+                  accesskey="&saveChangeSyncDeviceName.label.accesskey;"
                   hidden="true"/>
         </hbox>
       </hbox>
     </groupbox>
     <label class="fxaMobilePromo">
         &mobilePromo3.start;<!-- We put these comments to avoid inserting white spaces
         --><label class="androidLink text-link" id="fxaMobilePromo-android-hasFxaAccount"><!--
         -->&mobilePromo3.androidLink;</label><!--
--- a/browser/locales/en-US/chrome/browser/preferences/sync.dtd
+++ b/browser/locales/en-US/chrome/browser/preferences/sync.dtd
@@ -33,21 +33,23 @@
 <!ENTITY engine.passwords.accesskey "P">
 <!ENTITY engine.prefs.label         "Preferences">
 <!ENTITY engine.prefs.accesskey     "S">
 <!ENTITY engine.addons.label        "Add-ons">
 <!ENTITY engine.addons.accesskey    "A">
 
 <!-- Device Settings -->
 <!ENTITY syncDeviceName.label       "Device Name:">
-<!ENTITY syncDeviceName.accesskey   "c">
 <!ENTITY fxaSyncDeviceName.label       "Device Name">
 <!ENTITY changeSyncDeviceName.label "Change Device Name…">
+<!ENTITY changeSyncDeviceName.label.accesskey "h">
 <!ENTITY cancelChangeSyncDeviceName.label "Cancel">
+<!ENTITY cancelChangeSyncDeviceName.label.accesskey "n">
 <!ENTITY saveChangeSyncDeviceName.label "Save">
+<!ENTITY saveChangeSyncDeviceName.label.accesskey "v">
 <!ENTITY unlinkDevice.label           "Unlink This Device">
 
 <!-- Footer stuff -->
 <!ENTITY prefs.tosLink.label        "Terms of Service">
 <!ENTITY prefs.ppLink.label         "Privacy Policy">
 
 <!-- Firefox Accounts stuff -->
 <!ENTITY fxaPrivacyNotice.link.label "Privacy Notice">
@@ -66,33 +68,41 @@ signedInLoginFailure.aftername.label): t
 before and after the account email address. Localizers can use one of them, or
 both, to better adapt this sentence to their language.
 -->
 <!ENTITY signedInLoginFailure.beforename.label "Please sign in to reconnect">
 <!ENTITY signedInLoginFailure.aftername.label "">
 
 <!ENTITY notSignedIn.label           "You are not signed in.">
 <!ENTITY signIn.label                "Sign in">
+<!ENTITY signIn.label.accesskey            "g">
 <!ENTITY profilePicture.tooltip      "Change profile picture">
 <!ENTITY verifiedManage.label        "Manage Account">
+<!ENTITY verifiedManage.label.accesskey    "o">
 <!ENTITY disconnect.label            "Disconnect…">
+<!ENTITY disconnect.label.accesskey        "D">
 <!ENTITY verify.label                "Verify Email">
+<!ENTITY verify.label.accesskey            "V">
 <!ENTITY forget.label                "Forget this Email">
+<!ENTITY forget.label.accesskey            "F">
+<!ENTITY rejectUnlinkFxaAccount.forget.label.accesskey            "e">
 
 <!ENTITY welcome.description "Access your tabs, bookmarks, passwords and more wherever you use &brandShortName;.">
 <!ENTITY welcome.signIn.label "Sign In">
 <!ENTITY welcome.createAccount.label "Create Account">
 
 <!ENTITY welcome.useOldSync.label "Using an older version of Sync?">
 
 <!ENTITY signedOut.caption            "Take your Web with you">
 <!ENTITY signedOut.description        "Synchronize your bookmarks, history, tabs, passwords, add-ons, and preferences across all your devices.">
 <!ENTITY signedOut.accountBox.title   "Connect with a &syncBrand.fxAccount.label;">
 <!ENTITY signedOut.accountBox.create  "Create Account">
+<!ENTITY signedOut.accountBox.create.accesskey  "C">
 <!ENTITY signedOut.accountBox.signin  "Sign In">
+<!ENTITY signedOut.accountBox.signin.accesskey  "I">
 
 <!ENTITY signedIn.engines.label       "Sync across all devices">
 
 <!-- LOCALIZATION NOTE (mobilePromo3.*): the following strings will be used to
      create a single sentence with active links.
      The resulting sentence in English is: "Download Firefox for
      Android or iOS to sync with your mobile device." -->
 
--- a/browser/themes/shared/incontentprefs/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs/preferences.inc.css
@@ -492,16 +492,18 @@ description > html|a {
 
 #signedOutAccountBoxTitle {
   font-weight: bold;
 }
 
 .fxaAccountBoxButtons {
   margin-bottom: 0 !important;
   margin-top: 11px;
+  display: flex;
+  align-items: center;
 }
 
 .fxaAccountBoxButtons > * {
   -moz-box-flex: 1;
 }
 
 .fxaAccountBoxButtons > button {
   text-align: center;