From e7b772334d95e937827526899011bedceec295f8 Mon Sep 17 00:00:00 2001 From: "Matt A. Tobin" Date: Tue, 17 Apr 2018 09:45:29 -0400 Subject: [PALEMOON] Localize a private copy of the pre-newawesomebar autocomplete bindings and styling --- application/palemoon/base/content/autocomplete.css | 17 + application/palemoon/base/content/autocomplete.xml | 2122 ++++++++++++++++++++ application/palemoon/base/content/browser.css | 62 + .../palemoon/base/content/urlbarBindings.xml | 6 +- application/palemoon/base/jar.mn | 2 + application/palemoon/themes/linux/autocomplete.css | 210 ++ application/palemoon/themes/linux/jar.mn | 1 + application/palemoon/themes/osx/autocomplete.css | 198 ++ application/palemoon/themes/osx/jar.mn | 1 + .../palemoon/themes/windows/autocomplete.css | 238 +++ application/palemoon/themes/windows/jar.mn | 1 + 11 files changed, 2855 insertions(+), 3 deletions(-) create mode 100644 application/palemoon/base/content/autocomplete.css create mode 100644 application/palemoon/base/content/autocomplete.xml create mode 100644 application/palemoon/themes/linux/autocomplete.css create mode 100644 application/palemoon/themes/osx/autocomplete.css create mode 100644 application/palemoon/themes/windows/autocomplete.css (limited to 'application') diff --git a/application/palemoon/base/content/autocomplete.css b/application/palemoon/base/content/autocomplete.css new file mode 100644 index 000000000..960bdc456 --- /dev/null +++ b/application/palemoon/base/content/autocomplete.css @@ -0,0 +1,17 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +/* Apply crisp rendering for favicons at exactly 2dppx resolution */ +@media (resolution: 2dppx) { + .ac-site-icon { + image-rendering: -moz-crisp-edges; + } +} + +richlistitem > .ac-title-box > .ac-title > .ac-comment:not([selected]) > html|span.ac-selected-text { + display: none; +} diff --git a/application/palemoon/base/content/autocomplete.xml b/application/palemoon/base/content/autocomplete.xml new file mode 100644 index 000000000..3cb80b19d --- /dev/null +++ b/application/palemoon/base/content/autocomplete.xml @@ -0,0 +1,2122 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + null + null + false + null + + null + null + null + null + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + parseInt(this.getAttribute("shrinkdelay")) || 0 + + + + { + let utils = {}; + Components.utils.import("resource://gre/modules/PrivateBrowsingUtils.jsm", utils); + utils.PrivateBrowsingUtils + } + + + + + + + + 14 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + false + false + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + null + + + + + + + + = 1) + this.mController.handleTab(); + break; + case KeyEvent.DOM_VK_UP: + case KeyEvent.DOM_VK_DOWN: + case KeyEvent.DOM_VK_PAGE_UP: + case KeyEvent.DOM_VK_PAGE_DOWN: + cancel = this.mController.handleKeyNavigation(aEvent.keyCode); + break; + } + } + + // Handle keys we know aren't part of a shortcut, even with Alt or + // Ctrl. + switch (aEvent.keyCode) { + case KeyEvent.DOM_VK_ESCAPE: + cancel = this.mController.handleEscape(); + break; + case KeyEvent.DOM_VK_RETURN: + if (AppConstants.platform == "macosx") { + // Prevent the default action, since it will beep on Mac + if (aEvent.metaKey) + aEvent.preventDefault(); + } + this.mEnterEvent = aEvent; + if (this.mController.selection) { + this._selectionDetails = { + index: this.mController.selection.currentIndex, + kind: "key" + }; + } + cancel = this.handleEnter(); + break; + case KeyEvent.DOM_VK_DELETE: + if (AppConstants.platform == "macosx" && !aEvent.shiftKey) { + break; + } + cancel = this.handleDelete(); + break; + case KeyEvent.DOM_VK_BACK_SPACE: + if (AppConstants.platform == "macosx" && aEvent.shiftKey) { + cancel = this.handleDelete(); + } + break; + case KeyEvent.DOM_VK_DOWN: + case KeyEvent.DOM_VK_UP: + if (aEvent.altKey) + this.toggleHistoryPopup(); + break; + case KeyEvent.DOM_VK_F4: + if (AppConstants.platform != "macosx") { + this.toggleHistoryPopup(); + } + break; + } + + if (cancel) { + aEvent.stopPropagation(); + aEvent.preventDefault(); + } + + return true; + ]]> + + + + + + + + + + + + + + + + + + + + + + + + + + false + aCommand == "cmd_paste", + doCommand: function(aCommand) { + this._autocomplete._valueIsPasted = true; + this._autocomplete.editor.paste(this._kGlobalClipboard); + this._autocomplete._valueIsPasted = false; + }, + isCommandEnabled: function(aCommand) { + return this._autocomplete.editor.isSelectionEditable && + this._autocomplete.editor.canPaste(this._kGlobalClipboard); + }, + onEvent: function() {} + }) + ]]> + + + + + + + + + + + + + + + + + + + = 1) { + // mousemove sets selected index. Don't blindly use that selected + // index in this blur handler since if the popup is open you can + // easily "select" another match just by moving the mouse over it. + let filledVal = this.value.replace(/.+ >> /, "").toLowerCase(); + let selectedVal = null; + if (this.popup.selectedIndex >= 0) { + selectedVal = this.mController.getFinalCompleteValueAt( + this.popup.selectedIndex); + } + if (selectedVal && filledVal != selectedVal.toLowerCase()) { + for (let i = 0; i < this.mController.matchCount; i++) { + let matchVal = this.mController.getFinalCompleteValueAt(i); + if (matchVal.toLowerCase() == filledVal) { + this.popup.selectedIndex = i; + break; + } + } + } + this.mController.handleEnter(false); + } + if (!this.ignoreBlurWhileSearching) + this.detachController(); + } + ]]> + + + + + + + + + + + + + + + + + + + + + false + false + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 0) + this.tree.treeBoxObject.ensureRowIsVisible(val < 0 ? 0 : val); + // Fire select event on xul:tree so that accessibility API + // support layer can fire appropriate accessibility events. + var event = document.createEvent('Events'); + event.initEvent("select", true, true); + this.tree.dispatchEvent(event); + return val; + ]]> + + + + + + + + + + + + + + + + + + 100 ? width : 100); + + // Adjust the direction of the autocomplete popup list based on the textbox direction, bug 649840 + var popupDirection = aElement.ownerDocument.defaultView.getComputedStyle(aElement).direction; + this.style.direction = popupDirection; + + this.openPopup(aElement, "after_start", 0, 0, false, false); + } + ]]> + + + + + + + + + + + + + + + + document.getAnonymousElementByAttribute(this, "anonid", "tree"); + + + + document.getAnonymousElementByAttribute(this, "anonid", "treecols"); + + + + + + + + + + + + null + false + + + + + + + + + + + + + + + + + 6 + + + -1 + + + + + + + + + + + + + aMaxRow && aIndex != aMaxRow) + newIdx = aMaxRow; + else if (!aReverse && aIndex == -1 || newIdx < 0 && aIndex != 0) + newIdx = 0; + + if (newIdx < 0 && aIndex == 0 || newIdx > aMaxRow && aIndex == aMaxRow) + aIndex = -1; + else + aIndex = newIdx; + + return aIndex; + ]]> + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 0 + 0 + false + + + + + + + + + + + + + + + + + + + + + + + + + + 100 ? width : 100); + // invalidate() depends on the width attribute + this._invalidate(); + + this.openPopup(aElement, "after_start", 0, 0, false, false); + } + ]]> + + + + + + + + + + + + + + this.adjustHeight(), 0); + + this._currentIndex = 0; + if (this._appendResultTimeout) { + clearTimeout(this._appendResultTimeout); + } + this._appendCurrentResult(reason); + ]]> + + + + + + + + + + + + + + + + + + + + + + + + currentHeight) { + // Grow immediately. + if (animate) { + this.richlistbox.removeAttribute("height"); + this.richlistbox.style.height = height + "px"; + } else { + this.richlistbox.style.removeProperty("height"); + this.richlistbox.height = height; + } + } else { + // Delay shrinking to avoid flicker. + this._shrinkTimeout = setTimeout(() => { + this._collapseUnusedItems(); + if (animate) { + this.richlistbox.removeAttribute("height"); + this.richlistbox.style.height = height + "px"; + } else { + this.richlistbox.style.removeProperty("height"); + this.richlistbox.height = height; + } + }, this.mInput.shrinkDelay); + } + ]]> + + + + + + + = matchCount) + break; + + var item; + + // trim the leading/trailing whitespace + var trimmedSearchString = controller.searchString.replace(/^\s+/, "").replace(/\s+$/, ""); + + let url = controller.getValueAt(this._currentIndex); + + if (this._currentIndex < existingItemsCount) { + // re-use the existing item + item = this.richlistbox.childNodes[this._currentIndex]; + + // Completely reuse the existing richlistitem for invalidation + // due to new results, but only when: the item is the same, *OR* + // we are about to replace the currently mouse-selected item, to + // avoid surprising the user. + let iface = Components.interfaces.nsIAutoCompletePopup; + if (item.getAttribute("text") == trimmedSearchString && + invalidateReason == iface.INVALIDATE_REASON_NEW_RESULT && + (item.getAttribute("url") == url || + this.richlistbox.mouseSelectedIndex === this._currentIndex)) { + item.collapsed = false; + this._currentIndex++; + continue; + } + } + else { + // need to create a new item + item = document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "richlistitem"); + } + + // set these attributes before we set the class + // so that we can use them from the constructor + let iconURI = controller.getImageAt(this._currentIndex); + item.setAttribute("image", iconURI); + item.setAttribute("url", url); + item.setAttribute("title", controller.getCommentAt(this._currentIndex)); + item.setAttribute("type", controller.getStyleAt(this._currentIndex)); + item.setAttribute("text", trimmedSearchString); + + if (this._currentIndex < existingItemsCount) { + // re-use the existing item + item._adjustAcItem(); + item.collapsed = false; + } + else { + // set the class at the end so we can use the attributes + // in the xbl constructor + item.className = "autocomplete-richlistitem"; + this.richlistbox.appendChild(item); + } + + this._currentIndex++; + } + + if (typeof this.onResultsAdded == "function") + this.onResultsAdded(); + + if (this._currentIndex < matchCount) { + // yield after each batch of items so that typing the url bar is + // responsive + this._appendResultTimeout = setTimeout(() => this._appendCurrentResult(), 0); + } + ]]> + + + + + + + + + + + + + document.getAnonymousElementByAttribute(this, "anonid", "richlistbox"); + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + str).join(" ") + + // allow consumers that have extended popups to override + // the label values for the richlistitems + let panel = this.parentNode.parentNode; + if (panel.createResultLabel) { + return panel.createResultLabel(this, label); + } + + return label; + ]]> + + + + + + + + null + + + + + + + + + + + + = 0) { + regions.push([matchIndex, matchIndex + searchLen]); + } + } + + // Sort the regions by start position then end position + regions = regions.sort((a, b) => { + let start = a[0] - b[0]; + return (start == 0) ? a[1] - b[1] : start; + }); + + // Generate the boundary indices from each region + let start = 0; + let end = 0; + let boundaries = []; + let len = regions.length; + for (let i = 0; i < len; i++) { + // We have a new boundary if the start of the next is past the end + let region = regions[i]; + if (region[0] > end) { + // First index is the beginning of match + boundaries.push(start); + // Second index is the beginning of non-match + boundaries.push(end); + + // Track the new region now that we've stored the previous one + start = region[0]; + } + + // Push back the end index for the current or new region + end = Math.max(end, region[1]); + } + + // Add the last region + boundaries.push(start); + boundaries.push(end); + + // Put on the end boundary if necessary + if (end < aText.length) + boundaries.push(aText.length); + + // Skip the first item because it's always 0 + return boundaries.slice(1); + ]]> + + + + + + + + + + + + + + + + + + + + + + + + + = 0 && index < aReplacements.length) { + pairs.push([...aReplacements[index]]); + } + } else { + pairs.push([part]); + } + } + + return pairs; + ]]> + + + + + + + + + + + + + null + + + + + + + + + + = 0) { + pairs = [ + [searchSuggestion.substring(0, idx), ""], + [searchQuery, "match"], + [searchSuggestion.substring(idx + searchQuery.length), ""], + ]; + } else { + pairs = [ + [searchSuggestion, ""], + ]; + } + } else { + pairs = [ + [searchQuery, ""], + ]; + } + pairs.push([engineStr, "selected"]); + let interpStr = pairs.map((pair, i) => `%${i + 1}$S`).join(""); + title = this._generateEmphasisPairs(interpStr, pairs); + + // If this is a default search match, we remove the image so we + // can style it ourselves with a generic search icon. + // We don't do this when matching an aliased search engine, + // because the icon helps with recognising which engine will be + // used (when using the default engine, we don't need that + // recognition). + if (!action.params.alias) { + this.removeAttribute("image"); + } + } else if (action.type == "visiturl") { + emphasiseUrl = false; + displayUrl = this._unescapeUrl(action.params.url); + let sourceStr = this._stringBundle.GetStringFromName("visitURL"); + title = this._generateEmphasisPairs(sourceStr, [ + [displayUrl, "match"], + ]); + } + } + + // Check if we have a search engine name + if (initialTypes.has("search")) { + emphasiseUrl = false; + + const TITLE_SEARCH_ENGINE_SEPARATOR = " \u00B7\u2013\u00B7 "; + + let searchEngine = ""; + [title, searchEngine] = title.split(TITLE_SEARCH_ENGINE_SEPARATOR); + displayUrl = this._stringBundle.formatStringFromName("searchWithEngine", [searchEngine], 1); + } + + if (!displayUrl) { + let input = this.parentNode.parentNode.input; + let url = typeof(input.trimValue) == "function" ? + input.trimValue(originalUrl) : + originalUrl; + displayUrl = this._unescapeUrl(url); + } + this.setAttribute("displayurl", displayUrl); + + // Check if we have an auto-fill URL + if (initialTypes.has("autofill")) { + emphasiseUrl = false; + + let sourceStr = this._stringBundle.GetStringFromName("visitURL"); + title = this._generateEmphasisPairs(sourceStr, [ + [displayUrl, "match"], + ]); + } + + // If we have a tag match, show the tags and icon + if (type == "tag" || type == "bookmark-tag") { + // Configure the extra box for tags display + this._extraBox.hidden = false; + this._extraBox.childNodes[0].hidden = false; + this._extraBox.childNodes[1].hidden = true; + this._extraBox.pack = "end"; + this._titleBox.flex = 1; + + // The title is separated from the tags by an endash + let tags; + [, title, tags] = title.match(/^(.+) \u2013 (.+)$/); + + // Each tag is split by a comma in an undefined order, so sort it + let sortedTags = tags.split(",").sort().join(", "); + + // Emphasize the matching text in the tags + this._setUpDescription(this._extra, sortedTags); + + // If we're suggesting bookmarks, then treat tagged matches as + // bookmarks for the star. + if (type == "bookmark-tag") { + type = "bookmark"; + } else { + this._typeImage.hidden = true; + } + // keyword and favicon type results for search engines + // have an extra magnifying glass icon after them + } else if (type == "keyword" || (initialTypes.has("search") && + initialTypes.has("favicon"))) { + // Configure the extra box for keyword display + this._extraBox.hidden = false; + this._extraBox.childNodes[0].hidden = true; + // The second child node is ":" and it should be hidden for non keyword types + this._extraBox.childNodes[1].hidden = type == "keyword" ? false : true; + this._extraBox.pack = "start"; + this._titleBox.flex = 0; + + // Hide the ellipsis so it doesn't take up space. + this._titleOverflowEllipsis.hidden = true; + + if (type == "keyword") { + // Put the parameters next to the title if we have any + let search = this.getAttribute("text"); + let params = ""; + let paramsIndex = search.indexOf(" "); + if (paramsIndex != -1) + params = search.substr(paramsIndex + 1); + + // Emphasize the keyword parameters + this._setUpDescription(this._extra, params); + + // Don't emphasize keyword searches in the title or url + emphasiseUrl = false; + emphasiseTitle = false; + } else { + // Don't show any description for non keyword types. + this._setUpDescription(this._extra, "", true); + } + // If the result has the type favicon and a known search provider, + // customize it the same way as a keyword result. + type = "keyword"; + } + + // Give the image the icon style and a special one for the type + this._typeImage.className = "ac-type-icon" + + (type ? " ac-result-type-" + type : ""); + + // Show the domain as the title if we don't have a title. + if (title == "") { + title = displayUrl; + try { + let uri = Services.io.newURI(originalUrl, null, null); + // Not all valid URLs have a domain. + if (uri.host) + title = uri.host; + } catch (e) {} + } + + // Emphasize the matching search terms for the description + if (Array.isArray(title)) + this._setUpEmphasisedSections(this._title, title); + else + this._setUpDescription(this._title, title, !emphasiseTitle); + + this._setUpDescription(this._url, displayUrl, !emphasiseUrl); + + // Set up overflow on a timeout because the contents of the box + // might not have a width yet even though we just changed them + setTimeout(this._setUpOverflow, 0, this._titleBox, this._titleOverflowEllipsis); + setTimeout(this._setUpOverflow, 0, this._urlBox, this._urlOverflowEllipsis); + ]]> + + + + + + + + + + + + + 0) { + // Subtract a little less to account for subpixel rounding + widthDiff -= childWidth - .5; + + // Add to the tooltip if it's not hidden and has text + let childText = children[i].textContent; + if (childText) + tooltip.push(childText); + } + } + + // If the children take up more space than the parent.. overflow! + if (widthDiff < 0) { + // Re-show the ellipsis now that we know it's needed + aEllipsis.style.visibility = "visible"; + + // Separate text components with a ndash -- + aParentBox.tooltipText = tooltip.join(" \u2013 "); + } + ]]> + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Date.now() + -1 + + + + + + + + 30) { + let item = event.target; + while (item && item.localName != "richlistitem") { + item = item.parentNode; + } + + if (!item) + return; + + let index = this.getIndexOfItem(item); + if (index != this.selectedIndex) { + this.mouseSelectedIndex = this.selectedIndex = index; + } + + this.mLastMoveTime = Date.now(); + } + ]]> + + + + + + + Date.now() + + + + + + + + 30) { + var rc = this.parentNode.treeBoxObject.getRowAt(event.clientX, event.clientY); + if (rc != this.parentNode.currentIndex) + this.parentNode.view.selection.select(rc); + this.mLastMoveTime = Date.now(); + } + ]]> + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/application/palemoon/base/content/browser.css b/application/palemoon/base/content/browser.css index 4865cfee7..a72d77488 100644 --- a/application/palemoon/base/content/browser.css +++ b/application/palemoon/base/content/browser.css @@ -328,6 +328,68 @@ panel[noactions] > richlistbox > richlistitem[type~="action"] > .ac-url-box > .a visibility: hidden; } +/* Override xul.css for autocomplete bindings and css */ +textbox[type="autocomplete"] { + -moz-binding: url("chrome://browser/content/autocomplete.xml#autocomplete"); +} + +panel[type="autocomplete"] { + -moz-binding: url("chrome://browser/content/autocomplete.xml#autocomplete-result-popup"); +} + +panel[type="autocomplete-richlistbox"] { + -moz-binding: url("chrome://browser/content/autocomplete.xml#autocomplete-rich-result-popup"); +} + +/* FIXME: bug 616258 */ + +.autocomplete-tree { + -moz-binding: url("chrome://browser/content/autocomplete.xml#autocomplete-tree"); + -moz-user-focus: ignore; +} + +.autocomplete-treebody { + -moz-binding: url("chrome://browser/content/autocomplete.xml#autocomplete-treebody"); +} + +.autocomplete-richlistbox { + -moz-binding: url("chrome://browser/content/autocomplete.xml#autocomplete-richlistbox"); + -moz-user-focus: ignore; +} + +.autocomplete-richlistbox > scrollbox { + overflow-x: hidden !important; +} + +.autocomplete-richlistitem { + -moz-binding: url("chrome://browser/content/autocomplete.xml#autocomplete-richlistitem"); + -moz-box-orient: vertical; + overflow: -moz-hidden-unscrollable; +} + +.autocomplete-treerows { + -moz-binding: url("chrome://browser/content/autocomplete.xml#autocomplete-treerows"); +} + +.autocomplete-history-dropmarker { + display: none; +} + +.autocomplete-history-dropmarker[enablehistory="true"] { + display: -moz-box; + -moz-binding: url("chrome://browser/content/autocomplete.xml#history-dropmarker"); +} + +.ac-ellipsis-after { + visibility: hidden; +} + +.ac-url-text[type~="action"], +.ac-action-text:not([type~="action"]) { + visibility: collapse; +} + + /* ::::: Unified Back-/Forward Button ::::: */ #back-button > .toolbarbutton-menu-dropmarker, #forward-button > .toolbarbutton-menu-dropmarker { diff --git a/application/palemoon/base/content/urlbarBindings.xml b/application/palemoon/base/content/urlbarBindings.xml index 8cc66f642..6b4350f99 100644 --- a/application/palemoon/base/content/urlbarBindings.xml +++ b/application/palemoon/base/content/urlbarBindings.xml @@ -17,7 +17,7 @@ xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:xbl="http://www.mozilla.org/xbl"> - + - + @@ -823,7 +823,7 @@ - + 0 diff --git a/application/palemoon/base/jar.mn b/application/palemoon/base/jar.mn index 29896341e..fd2df79e1 100644 --- a/application/palemoon/base/jar.mn +++ b/application/palemoon/base/jar.mn @@ -108,6 +108,8 @@ browser.jar: * content/browser/sanitize.xul (content/sanitize.xul) * content/browser/sanitizeDialog.js (content/sanitizeDialog.js) content/browser/sanitizeDialog.css (content/sanitizeDialog.css) +* content/browser/autocomplete.css (content/autocomplete.css) +* content/browser/autocomplete.xml (content/autocomplete.xml) content/browser/tabbrowser.css (content/tabbrowser.css) * content/browser/tabbrowser.xml (content/tabbrowser.xml) * content/browser/urlbarBindings.xml (content/urlbarBindings.xml) diff --git a/application/palemoon/themes/linux/autocomplete.css b/application/palemoon/themes/linux/autocomplete.css new file mode 100644 index 000000000..fffa2b1f0 --- /dev/null +++ b/application/palemoon/themes/linux/autocomplete.css @@ -0,0 +1,210 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +/* ===== autocomplete.css ================================================= + == Styles used by the autocomplete widget. + ======================================================================= */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +/* ::::: autocomplete ::::: */ + +/* .padded is used by autocomplete widgets that don't have an icon. Gross. -dwh */ +textbox:not(.padded) { + cursor: default; + padding: 0; +} + +textbox[enablehistory="true"] { + -moz-appearance: none; + border: 0; + background-color: transparent; +} + +textbox[nomatch="true"][highlightnonmatches="true"] { + color: red; +} + +.autocomplete-textbox-container { + -moz-box-align: center; +} + +textbox[enablehistory="true"] > .autocomplete-textbox-container { + -moz-appearance: menulist-textfield; +} + +textbox:not(.padded) .textbox-input-box { + margin: 0 3px; +} + +.textbox-input-box { + -moz-box-align: center; +} + +/* ::::: autocomplete popups ::::: */ + +panel[type="autocomplete"], +panel[type="autocomplete-richlistbox"], +.autocomplete-history-popup { + border-width: 1px; + -moz-border-top-colors: ThreeDDarkShadow; + -moz-border-right-colors: ThreeDDarkShadow; + -moz-border-bottom-colors: ThreeDDarkShadow; + -moz-border-left-colors: ThreeDDarkShadow; + padding: 0; + background-color: -moz-Field; +} + +.autocomplete-history-popup { + max-height: 180px; +} + +/* ::::: tree ::::: */ + +.autocomplete-tree { + -moz-appearance: none !important; + border: none !important; + background-color: transparent !important; + color: MenuText; +} + +.autocomplete-treecol { + -moz-appearance: none !important; + margin: 0 !important; + border: none !important; + padding: 0 !important; +} + +/* GTK calculates space for a sort arrow */ +.autocomplete-treecol > .treecol-sortdirection { + -moz-appearance: none !important; +} + +.autocomplete-treebody::-moz-tree-cell-text { + -moz-padding-start: 8px; +} + +treechildren.autocomplete-treebody::-moz-tree-row(selected) { + background-color: Highlight; +} + +treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) { + color: HighlightText !important; +} + +.autocomplete-treebody::-moz-tree-image(treecolAutoCompleteValue) { + max-width: 16px; + height: 16px; +} + +/* ::::: richlistbox autocomplete ::::: */ + +.autocomplete-richlistbox { + -moz-appearance: none; + margin: 1px; + background-color: transparent; +} + +.autocomplete-richlistitem[selected="true"] { + background-color: Highlight; + color: HighlightText; +} + +.autocomplete-richlistitem { + padding: 6px 2px; + color: MenuText; +} + +.ac-url-box { + /* When setting a vertical margin here, half of that needs to be added + .ac-title-box's translateY for when .ac-url-box is hidden (see below). */ + margin-top: 1px; +} + +.autocomplete-richlistitem[actiontype="keyword"] .ac-url-box, +.autocomplete-richlistitem[actiontype="searchengine"] .ac-url-box, +.autocomplete-richlistitem[actiontype="visiturl"] .ac-url-box, +.autocomplete-richlistitem[type~="autofill"] .ac-url-box { + visibility: hidden; +} + +.autocomplete-richlistitem[actiontype="keyword"] .ac-title-box, +.autocomplete-richlistitem[actiontype="searchengine"] .ac-title-box, +.autocomplete-richlistitem[actiontype="visiturl"] .ac-title-box, +.autocomplete-richlistitem[type~="autofill"] .ac-title-box { + /* Center the title by moving it down by half of .ac-url-box's height, + including vertical margins (if any). */ + transform: translateY(.5em); +} + +.ac-site-icon { + width: 16px; + height: 16px; + margin-bottom: -2px; + -moz-margin-start: 3px; + -moz-margin-end: 6px; +} + +.ac-type-icon { + width: 16px; + height: 16px; + -moz-margin-start: 6px; + -moz-margin-end: 4px; +} + +.ac-extra > .ac-result-type-tag { + margin: 0 4px; +} + +.ac-extra > .ac-comment { + padding-right: 4px; +} + +.ac-ellipsis-after { + margin: 0 !important; + padding: 0; + min-width: 1em; +} + +.ac-normal-text { + margin: 0 !important; + padding: 0; +} + +.ac-normal-text > html|span { + margin: 0 !important; + padding: 0; +} + +html|span.ac-emphasize-text { + box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.1); + background-color: rgba(0,0,0,0.05); + border-radius: 2px; + text-shadow: 0 0 currentColor; /*faux bold effect*/ +} + +.ac-url-text > html|span.ac-emphasize-text, +.ac-action-text > html|span.ac-emphasize-text { + box-shadow: none; +} + +.ac-normal-text[selected="true"] > html|span.ac-emphasize-text { + box-shadow: inset 0 0 1px 1px rgba(255,255,255,0.3); + background-color: rgba(255,255,255,0.2); +} + +.ac-title, .ac-url { + overflow: hidden; +} + +/* ::::: textboxes inside toolbarpaletteitems ::::: */ + +toolbarpaletteitem > toolbaritem > textbox > hbox > hbox > html|*.textbox-input { + visibility: hidden; +} + +toolbarpaletteitem > toolbaritem > * > textbox > hbox > hbox > html|*.textbox-input { + visibility: hidden; +} diff --git a/application/palemoon/themes/linux/jar.mn b/application/palemoon/themes/linux/jar.mn index f1339b803..7e67d0129 100644 --- a/application/palemoon/themes/linux/jar.mn +++ b/application/palemoon/themes/linux/jar.mn @@ -16,6 +16,7 @@ browser.jar: #ifdef MOZ_SERVICES_SYNC skin/classic/browser/aboutSyncTabs.css #endif +* skin/classic/browser/autocomplete.css skin/classic/browser/actionicon-tab.png * skin/classic/browser/browser.css skin/classic/browser/click-to-play-warning-stripes.png diff --git a/application/palemoon/themes/osx/autocomplete.css b/application/palemoon/themes/osx/autocomplete.css new file mode 100644 index 000000000..42b4ee430 --- /dev/null +++ b/application/palemoon/themes/osx/autocomplete.css @@ -0,0 +1,198 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +/* .padded is used by autocomplete widgets that don't have an icon. Gross. -dwh */ +textbox:not(.padded) { + cursor: default; + padding: 0; +} + +textbox[nomatch="true"][highlightnonmatches="true"] { + color: red; +} + +textbox:not(.padded) .textbox-input-box { + margin: 0 3px; +} + +.textbox-input-box { + -moz-box-align: center; +} + +/* ::::: history button ::::: */ + +.autocomplete-history-dropmarker { + -moz-appearance: none !important; + border: none !important; + background-color: transparent !important; + padding: 0px; + list-style-image: url("chrome://global/skin/icons/autocomplete-dropmarker.png"); + margin: 0px; +} + +/* ::::: autocomplete popups ::::: */ + +panel[type="autocomplete"], +panel[type="autocomplete-richlistbox"], +.autocomplete-history-popup { + padding: 0px !important; + color: -moz-FieldText; + background-color: -moz-Field; + font: icon; + -moz-appearance: none; +} + +.autocomplete-history-popup { + max-height: 180px; +} + +/* ::::: tree ::::: */ + +.autocomplete-tree { + -moz-appearance: none !important; + border: none !important; + background-color: transparent !important; +} + +.autocomplete-treecol { + -moz-appearance: none !important; + margin: 0 !important; + border: none !important; + padding: 0 !important; +} + +.autocomplete-treebody::-moz-tree-cell-text { + padding-left: 2px; +} + +.autocomplete-treebody::-moz-tree-row { + border-top: none; +} + +treechildren.autocomplete-treebody::-moz-tree-row(selected) { + background-color: Highlight; +} + +treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) { + color: HighlightText !important; +} + +.autocomplete-treebody::-moz-tree-image(treecolAutoCompleteValue) { + max-width: 16px; + height: 16px; +} + +/* ::::: richlistbox autocomplete ::::: */ + +.autocomplete-richlistbox { + -moz-appearance: none; + margin: 0; +} + +.autocomplete-richlistitem[selected="true"] { + background-color: Highlight; + color: HighlightText; + background-image: linear-gradient(rgba(255,255,255,0.3), transparent); +} + +.autocomplete-richlistitem { + padding: 5px 2px; +} + +.ac-url-box { + /* When setting a vertical margin here, half of that needs to be added + .ac-title-box's translateY for when .ac-url-box is hidden (see below). */ + margin-top: 1px; +} + +.autocomplete-richlistitem[actiontype="keyword"] .ac-url-box, +.autocomplete-richlistitem[actiontype="searchengine"] .ac-url-box, +.autocomplete-richlistitem[actiontype="visiturl"] .ac-url-box, +.autocomplete-richlistitem[type~="autofill"] .ac-url-box { + visibility: hidden; +} + +.autocomplete-richlistitem[actiontype="keyword"] .ac-title-box, +.autocomplete-richlistitem[actiontype="searchengine"] .ac-title-box, +.autocomplete-richlistitem[actiontype="visiturl"] .ac-title-box, +.autocomplete-richlistitem[type~="autofill"] .ac-title-box { + /* Center the title by moving it down by half of .ac-url-box's height, + including vertical margins (if any). */ + transform: translateY(.5em); +} + +.ac-site-icon { + width: 16px; + height: 16px; + margin-bottom: -1px; + -moz-margin-start: 7px; + -moz-margin-end: 5px; +} + +.ac-type-icon { + width: 16px; + height: 16px; + -moz-margin-start: 6px; + -moz-margin-end: 4px; +} + +.ac-url-box > .ac-site-icon, +.ac-url-box > .ac-type-icon { + /* Otherwise the spacer is big enough to stretch its container */ + height: auto; +} + +.ac-extra > .ac-result-type-tag { + margin: 0 4px; +} + +.ac-extra > .ac-comment { + padding-right: 4px; +} + +.ac-ellipsis-after { + margin: 0 !important; + padding: 0; + min-width: 1.1em; +} + +.ac-normal-text { + margin: 0 !important; + padding: 0; +} + +.ac-normal-text > html|span { + margin: 0 !important; + padding: 0; +} + +html|span.ac-emphasize-text { + box-shadow: inset 0 0 1px 1px rgba(208,208,208,0.4); + background-color: rgba(208,208,208,0.2); + border-radius: 2px; + text-shadow: 0 0 currentColor; +} + +.ac-url-text > html|span.ac-emphasize-text, +.ac-action-text > html|span.ac-emphasize-text { + box-shadow: inset 0 0 1px 1px rgba(183,210,226,0.4); + background-color: rgba(183,210,226,0.3); +} + +.ac-title, .ac-url { + overflow: hidden; +} + +/* ::::: textboxes inside toolbarpaletteitems ::::: */ + +toolbarpaletteitem > toolbaritem > textbox > hbox > hbox > html|*.textbox-input { + visibility: hidden; +} + +toolbarpaletteitem > toolbaritem > * > textbox > hbox > hbox > html|*.textbox-input { + visibility: hidden; +} diff --git a/application/palemoon/themes/osx/jar.mn b/application/palemoon/themes/osx/jar.mn index 904da3788..186cd8a75 100644 --- a/application/palemoon/themes/osx/jar.mn +++ b/application/palemoon/themes/osx/jar.mn @@ -15,6 +15,7 @@ browser.jar: #ifdef MOZ_SERVICES_SYNC skin/classic/browser/aboutSyncTabs.css #endif +* skin/classic/browser/autocomplete.css skin/classic/browser/actionicon-tab.png skin/classic/browser/appmenu-icons.png skin/classic/browser/appmenu-dropmarker.png diff --git a/application/palemoon/themes/windows/autocomplete.css b/application/palemoon/themes/windows/autocomplete.css new file mode 100644 index 000000000..f0f16cc27 --- /dev/null +++ b/application/palemoon/themes/windows/autocomplete.css @@ -0,0 +1,238 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +/* ===== autocomplete.css ================================================= + == Styles used by the autocomplete widget. + ======================================================================= */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +/* ::::: autocomplete ::::: */ + +/* .padded is used by autocomplete widgets that don't have an icon. Gross. -dwh */ +textbox:not(.padded) { + cursor: default; + padding: 0; +} + +textbox[nomatch="true"][highlightnonmatches="true"] { + color: red; +} + +.autocomplete-textbox-container { + -moz-box-align: center; +} + +textbox:not(.padded) .textbox-input-box { + margin: 0 3px; +} + +.textbox-input-box { + -moz-box-align: center; +} + +/* ::::: autocomplete popups ::::: */ + +panel[type="autocomplete"], +panel[type="autocomplete-richlistbox"], +.autocomplete-history-popup { + -moz-appearance: none; + border-width: 1px; + -moz-border-top-colors: ThreeDShadow; + -moz-border-right-colors: ThreeDShadow; + -moz-border-bottom-colors: ThreeDShadow; + -moz-border-left-colors: ThreeDShadow; + padding: 0; + color: -moz-FieldText; + background-color: -moz-Field; +} + +.autocomplete-history-popup { + max-height: 180px; +} + +/* ::::: tree ::::: */ + +.autocomplete-tree { + -moz-appearance: none !important; + border: none !important; + background-color: transparent !important; +} + +.autocomplete-treecol { + -moz-appearance: none !important; + margin: 0 !important; + border: none !important; + padding: 0 !important; +} + +/* GTK calculates space for a sort arrow */ +.autocomplete-treecol > .treecol-sortdirection { + -moz-appearance: none !important; +} + +.autocomplete-treebody::-moz-tree-cell-text { + -moz-padding-start: 8px; +} + +treechildren.autocomplete-treebody::-moz-tree-row(selected) { + background-color: Highlight; +} + +treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) { + color: HighlightText !important; +} + +.autocomplete-treebody::-moz-tree-image(treecolAutoCompleteValue) { + max-width: 16px; + height: 16px; +} + +/* ::::: richlistbox autocomplete ::::: */ + +.autocomplete-richlistbox { + -moz-appearance: none; + margin: 0; +} + +.autocomplete-richlistitem { + padding: 1px; +} + +.autocomplete-richlistitem[selected="true"] { + background-color: Highlight; + color: HighlightText; +} + +%ifdef XP_WIN +@media (-moz-os-version: windows-vista) and (-moz-windows-default-theme), + (-moz-os-version: windows-win7) and (-moz-windows-default-theme) { + .autocomplete-richlistitem[selected="true"] { + color: inherit; + background-color: transparent; + /* four gradients for the bevel highlights on each edge, one for blue background */ + background-image: + linear-gradient(to bottom, rgba(255,255,255,0.9) 3px, transparent 3px), + linear-gradient(to right, rgba(255,255,255,0.5) 3px, transparent 3px), + linear-gradient(to left, rgba(255,255,255,0.5) 3px, transparent 3px), + linear-gradient(to top, rgba(255,255,255,0.4) 3px, transparent 3px), + linear-gradient(to bottom, rgba(163,196,247,0.3), rgba(122,180,246,0.3)); + background-clip: content-box; + border-radius: 6px; + outline: 1px solid rgb(124,163,206); + -moz-outline-radius: 3px; + outline-offset: -2px; + } +} +%endif + +.ac-title-box { + margin-top: 4px; +} + +.ac-url-box { + /* When setting a vertical margin here, half of that needs to be added + .ac-title-box's translateY for when .ac-url-box is hidden (see below). */ + margin: 1px 0 4px; +} + +.autocomplete-richlistitem[actiontype="keyword"] .ac-url-box, +.autocomplete-richlistitem[actiontype="searchengine"] .ac-url-box, +.autocomplete-richlistitem[actiontype="visiturl"] .ac-url-box, +.autocomplete-richlistitem[type~="autofill"] .ac-url-box { + visibility: hidden; +} + +.autocomplete-richlistitem[actiontype="keyword"] .ac-title-box, +.autocomplete-richlistitem[actiontype="searchengine"] .ac-title-box, +.autocomplete-richlistitem[actiontype="visiturl"] .ac-title-box, +.autocomplete-richlistitem[type~="autofill"] .ac-title-box { + /* Center the title by moving it down by half of .ac-url-box's height, + including vertical margins (if any). */ + transform: translateY(calc(.5em + 2px)); +} + +.ac-site-icon { + width: 16px; + height: 16px; + margin: 0 5px -2px; +} + +.ac-type-icon { + width: 16px; + height: 16px; + -moz-margin-start: 6px; + -moz-margin-end: 4px; + margin-bottom: -1px; +} + +.ac-url-box > .ac-site-icon, +.ac-url-box > .ac-type-icon { + /* Otherwise the spacer is big enough to stretch its container */ + height: auto; +} + +.ac-extra > .ac-result-type-tag { + margin: 0 4px; +} + +.ac-extra > .ac-comment { + padding-right: 4px; +} + +.ac-ellipsis-after { + margin: 0 !important; + padding: 0; + min-width: 1em; +} + +.ac-normal-text { + margin: 0 !important; + padding: 0; +} + +.ac-normal-text > html|span { + margin: 0 !important; + padding: 0; +} + +html|span.ac-emphasize-text { + box-shadow: inset 0 0 1px 1px rgba(208,208,208,0.5); + background-color: rgba(208,208,208,0.3); + border-radius: 2px; + text-shadow: 0 0 currentColor; +} + +@media (-moz-windows-default-theme) { + @media not all and (-moz-os-version: windows-xp) { + html|span.ac-emphasize-text { + box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.1); + background-color: rgba(0,0,0,0.05); + } + } + + @media (-moz-os-version: windows-xp) { + .ac-url-text > html|span.ac-emphasize-text, + .ac-action-text > html|span.ac-emphasize-text { + box-shadow: inset 0 0 1px 1px rgba(202,214,201,0.3); + background-color: rgba(202,214,201,0.2); + } + } +} + +.ac-title, .ac-url { + overflow: hidden; +} + +/* ::::: textboxes inside toolbarpaletteitems ::::: */ + +toolbarpaletteitem > toolbaritem > textbox > hbox > hbox > html|*.textbox-input { + visibility: hidden; +} + +toolbarpaletteitem > toolbaritem > * > textbox > hbox > hbox > html|*.textbox-input { + visibility: hidden; +} + diff --git a/application/palemoon/themes/windows/jar.mn b/application/palemoon/themes/windows/jar.mn index 30643570b..a66714b13 100644 --- a/application/palemoon/themes/windows/jar.mn +++ b/application/palemoon/themes/windows/jar.mn @@ -15,6 +15,7 @@ browser.jar: #ifdef MOZ_SERVICES_SYNC skin/classic/browser/aboutSyncTabs.css #endif +* skin/classic/browser/autocomplete.css skin/classic/browser/actionicon-tab.png skin/classic/browser/appmenu-icons.png skin/classic/browser/appmenu-dropmarker.png -- cgit v1.2.3