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
--- 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;