Bug 1374960 - [Form Autofill] Make small refinements for Manage Profiles and Edit Profile dialogs. r=lchang draft
authorScott Wu <scottcwwu@gmail.com>
Mon, 10 Jul 2017 14:45:53 +0800
changeset 605991 16a0d91ffbe5d2431f6068ee650dd5a505161209
parent 605863 a418121d46250f91728b86d9eea331029c264c30
child 636649 bb3256fbaa587bb81be7cf342632bc6c762aae81
push id67575
push userbmo:scwwu@mozilla.com
push dateMon, 10 Jul 2017 06:52:48 +0000
reviewerslchang
bugs1374960
milestone56.0a1
Bug 1374960 - [Form Autofill] Make small refinements for Manage Profiles and Edit Profile dialogs. r=lchang Small refinements for manage profiles and edit profile dialogs: - Make street address textarea 3 lines high - Disable user select highlight for labels and profile lists - Double clicking a profile should open the edit profile dialog MozReview-Commit-ID: 5uxYrdnfodn
browser/extensions/formautofill/content/editProfile.xhtml
browser/extensions/formautofill/content/manageProfiles.css
browser/extensions/formautofill/content/manageProfiles.js
browser/extensions/formautofill/skin/shared/editProfile.css
browser/themes/shared/incontentprefs/preferences.inc.css
--- a/browser/extensions/formautofill/content/editProfile.xhtml
+++ b/browser/extensions/formautofill/content/editProfile.xhtml
@@ -25,17 +25,17 @@
       <input id="family-name" type="text"/>
     </label>
     <label id="organization-container">
       <span>Company</span>
       <input id="organization" type="text"/>
     </label>
     <label id="street-address-container">
       <span>Street Address</span>
-      <textarea id="street-address"/>
+      <textarea id="street-address" rows="3"/>
     </label>
     <label id="address-level2-container">
       <span>City/Town</span>
       <input id="address-level2" type="text"/>
     </label>
     <label id="address-level1-container">
       <span>State/Province</span>
       <input id="address-level1" type="text"/>
--- a/browser/extensions/formautofill/content/manageProfiles.css
+++ b/browser/extensions/formautofill/content/manageProfiles.css
@@ -20,16 +20,17 @@ fieldset > legend {
   box-sizing: border-box;
   width: 100%;
   padding: 0.4em 0.7em;
   font-size: 0.9em;
   color: #808080;
   background-color: var(--in-content-box-background-hover);
   border: 1px solid var(--in-content-box-border-color);
   border-radius: 2px 2px 0 0;
+  -moz-user-select: none;
 }
 
 option:nth-child(even) {
   background-color: -moz-oddtreerow;
 }
 
 #profiles {
   font-size: 0.85em;
--- a/browser/extensions/formautofill/content/manageProfiles.js
+++ b/browser/extensions/formautofill/content/manageProfiles.js
@@ -234,17 +234,18 @@ ManageProfileDialog.prototype = {
    *
    * @param  {DOMEvent} event
    */
   handleClick(event) {
     if (event.target == this._elements.remove) {
       this.removeAddresses(this._selectedOptions.map(option => option.value));
     } else if (event.target == this._elements.add) {
       this.openEditDialog();
-    } else if (event.target == this._elements.edit) {
+    } else if (event.target == this._elements.edit ||
+               event.target.parentNode == this._elements.addresses && event.detail > 1) {
       this.openEditDialog(this._selectedOptions[0].address);
     }
   },
 
   /**
    * Handle key press events
    *
    * @param  {DOMEvent} event
@@ -269,24 +270,26 @@ ManageProfileDialog.prototype = {
 
   /**
    * Attach event listener
    */
   attachEventListeners() {
     window.addEventListener("unload", this, {once: true});
     window.addEventListener("keypress", this);
     this._elements.addresses.addEventListener("change", this);
+    this._elements.addresses.addEventListener("click", this);
     this._elements.controlsContainer.addEventListener("click", this);
     Services.obs.addObserver(this, "formautofill-storage-changed");
   },
 
   /**
    * Remove event listener
    */
   detachEventListeners() {
     window.removeEventListener("keypress", this);
     this._elements.addresses.removeEventListener("change", this);
+    this._elements.addresses.removeEventListener("click", this);
     this._elements.controlsContainer.removeEventListener("click", this);
     Services.obs.removeObserver(this, "formautofill-storage-changed");
   },
 };
 
 new ManageProfileDialog();
--- a/browser/extensions/formautofill/skin/shared/editProfile.css
+++ b/browser/extensions/formautofill/skin/shared/editProfile.css
@@ -21,16 +21,17 @@ label {
 }
 
 label > span {
   box-sizing: border-box;
   flex: 0 0 8em;
   padding-inline-end: 0.5em;
   align-self: center;
   text-align: end;
+  -moz-user-select: none;
 }
 
 input,
 select {
   box-sizing: border-box;
   flex: 1 0 auto;
   width: calc(50% - 8em);
 }
--- a/browser/themes/shared/incontentprefs/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs/preferences.inc.css
@@ -12,17 +12,18 @@
   font-size: 1.25rem;
 }
 
 * {
   -moz-user-select: text;
 }
 
 button,
-treecol {
+treecol,
+html|option {
   /* override the * rule */
   -moz-user-select: none;
 }
 
 #engineList treechildren::-moz-tree-image(engineShown, checked),
 #blocklistsTree treechildren::-moz-tree-image(selectionCol, checked) {
   list-style-image: url("chrome://global/skin/in-content/check.svg");
   -moz-context-properties: fill, stroke;