Bug 587909 - Improve the visual style of location bar results. r=Unfocused ui-r=shorlander

--HG--
extra : rebase_source : 625a3e2cf16b2601c20709b1ff6ee7c3792a6faa
This commit is contained in:
Andrew Hurle 2012-07-12 20:53:00 -07:00
parent 9dae93ab98
commit 1e3bb07c3f
12 changed files with 153 additions and 48 deletions

View File

@ -230,7 +230,7 @@
}
}
synthesizeMouse(node, x + 1, y + 1, {}, targetWindow);
synthesizeMouseAtCenter(node, {}, targetWindow);
}
this.getID = function selectByClick_getID()

Binary file not shown.

Before

Width:  |  Height:  |  Size: 244 B

After

Width:  |  Height:  |  Size: 236 B

View File

@ -1290,7 +1290,7 @@ toolbar[iconsize="small"] #feed-button {
}
.ac-comment {
font-size: 1.15em;
font-size: 1.05em;
}
.ac-extra > .ac-comment {
@ -1300,6 +1300,7 @@ toolbar[iconsize="small"] #feed-button {
.ac-url-text,
.ac-action-text {
color: -moz-nativehyperlinktext;
font-size: 0.9em;
}
richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 649 B

After

Width:  |  Height:  |  Size: 645 B

View File

@ -1114,7 +1114,7 @@ toolbar[mode="icons"] #zoom-in-button {
height: 12px;
}
richlistitem[selected="true"][current="true"] > hbox > .ac-result-type-bookmark,
richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type-bookmark,
.autocomplete-treebody::-moz-tree-image(selected, current, bookmark, treecolAutoCompleteImage) {
list-style-image: url("chrome://browser/skin/places/star-icons.png");
-moz-image-region: rect(0, 64px, 16px, 48px);
@ -1139,20 +1139,20 @@ richlistitem[selected="true"][current="true"] > hbox > .ac-result-type-bookmark,
richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
list-style-image: url("chrome://browser/skin/actionicon-tab.png");
-moz-image-region: rect(0, 16px, 16px, 0);
-moz-image-region: rect(0, 16px, 11px, 0);
padding: 0 3px;
}
richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
-moz-image-region: rect(16px, 16px, 32px, 0);
-moz-image-region: rect(11px, 16px, 22px, 0);
}
window[tabsontop="false"] richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
-moz-image-region: rect(0, 32px, 16px, 16px);
-moz-image-region: rect(0, 32px, 11px, 16px);
}
window[tabsontop="false"] richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
-moz-image-region: rect(16px, 32px, 32px, 16px);
-moz-image-region: rect(11px, 32px, 22px, 16px);
}
.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 434 B

After

Width:  |  Height:  |  Size: 425 B

View File

@ -1489,47 +1489,54 @@ html|*.urlbar-input:-moz-lwtheme:-moz-placeholder,
}
.ac-comment {
font-size: 1.15em;
font-size: 1.06em;
}
.ac-extra > .ac-comment {
font-size: inherit;
font-size: 1em;
}
.ac-url-text,
.ac-action-text {
font-size: 1em;
color: -moz-nativehyperlinktext;
}
%ifndef WINSTRIPE_AERO
@media (-moz-windows-default-theme) {
.ac-url-text,
.ac-action-text {
color: #006600;
.ac-url-text:not([selected="true"]),
.ac-action-text:not([selected="true"]) {
color: #008800;
}
}
%endif
richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
list-style-image: url("chrome://browser/skin/actionicon-tab.png");
-moz-image-region: rect(0, 16px, 16px, 0);
-moz-image-region: rect(0, 16px, 11px, 0);
padding: 0 3px;
}
richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
-moz-image-region: rect(16px, 16px, 32px, 0);
%ifdef WINSTRIPE_AERO
@media not all and (-moz-windows-default-theme) {
%endif
richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
-moz-image-region: rect(11px, 16px, 22px, 0);
}
.ac-comment[selected="true"],
.ac-url-text[selected="true"],
.ac-action-text[selected="true"] {
color: inherit !important;
}
%ifdef WINSTRIPE_AERO
}
%endif
.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
color: GrayText;
}
.ac-comment[selected="true"],
.ac-url-text[selected="true"],
.ac-action-text[selected="true"] {
color: inherit !important;
}
.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
{

View File

@ -113,23 +113,27 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
}
.autocomplete-richlistitem {
padding: 1px 2px;
padding: 6px 2px;
color: MenuText;
}
.autocomplete-richlistitem:not(:first-child) {
border-top: 1px solid ThreeDLightShadow;
.ac-url-box {
margin-top: 1px;
}
.ac-site-icon {
width: 16px;
height: 16px;
margin: 0 5px -3px 3px;
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 {
@ -141,13 +145,13 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
}
.ac-ellipsis-after {
margin: 2px 0px 0px 0px !important;
margin: 0 !important;
padding: 0;
min-width: 1em;
}
.ac-normal-text {
margin: 2px 0px 0px 0px !important;
margin: 0 !important;
padding: 0;
}
@ -157,8 +161,20 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
}
html|span.ac-emphasize-text {
font-weight: bold;
text-decoration: underline;
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);
}
html|span.ac-emphasize-alt {

View File

@ -95,25 +95,36 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
.autocomplete-richlistitem[selected="true"] {
background-color: Highlight;
color: HighlightText;
background-image: -moz-linear-gradient(rgba(255,255,255,0.3), transparent);
}
.autocomplete-richlistitem {
padding: 1px 2px;
padding: 5px 2px;
}
.autocomplete-richlistitem:not(:first-child) {
border-top: 1px solid ThreeDLightShadow;
.ac-url-box {
margin-top: 1px;
}
.ac-site-icon {
width: 16px;
height: 16px;
margin: 0 5px -3px 3px;
margin-bottom: -1px;
-moz-margin-start: 7px;
-moz-margin-end: 5px;
}
.ac-type-icon {
width: 16px;
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 {
@ -125,13 +136,13 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
}
.ac-ellipsis-after {
margin: 2px 0px 0px 0px !important;
margin: 0 !important;
padding: 0;
min-width: 1.1em;
}
.ac-normal-text {
margin: 2px 0px 0px 0px !important;
margin: 0 !important;
padding: 0;
}
@ -141,8 +152,16 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
}
html|span.ac-emphasize-text {
font-weight: bold;
text-decoration: underline;
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);
}
html|span.ac-emphasize-alt {

View File

@ -0,0 +1,7 @@
/* 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/. */
%define WINSTRIPE_AERO
%include autocomplete.css
%undef WINSTRIPE_AERO

View File

@ -96,28 +96,66 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
margin: 0;
}
.autocomplete-richlistitem {
padding: 1px;
}
.autocomplete-richlistitem[selected="true"] {
background-color: Highlight;
color: HighlightText;
}
.autocomplete-richlistitem {
padding: 1px 2px;
%ifdef WINSTRIPE_AERO
@media (-moz-windows-default-theme) {
/*
-moz-appearance: menuitem is almost right, but the hover effect is not
transparent and is lighter than desired.
*/
.autocomplete-richlistitem[selected="true"] {
color: inherit;
background-color: transparent;
/* four gradients for the bevel highlights on each edge, one for blue background */
background-image:
-moz-linear-gradient(to bottom, rgba(255,255,255,0.9) 3px, rgba(255,255,255,0) 3px),
-moz-linear-gradient(to right, rgba(255,255,255,0.5) 3px, rgba(255,255,255,0) 3px),
-moz-linear-gradient(to left, rgba(255,255,255,0.5) 3px, rgba(255,255,255,0) 3px),
-moz-linear-gradient(to top, rgba(255,255,255,0.4) 3px, rgba(255,255,255,0) 3px),
-moz-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;
}
.autocomplete-richlistitem:not(:first-child) {
border-top: 1px solid ThreeDLightShadow;
.ac-url-box {
margin: 1px 0 4px;
}
.ac-site-icon {
width: 16px;
height: 16px;
margin: 0 5px -3px 3px;
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 {
@ -129,13 +167,13 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
}
.ac-ellipsis-after {
margin: 2px 0px 0px 0px !important;
margin: 0 !important;
padding: 0;
min-width: 1em;
}
.ac-normal-text {
margin: 2px 0px 0px 0px !important;
margin: 0 !important;
padding: 0;
}
@ -145,8 +183,25 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) {
}
html|span.ac-emphasize-text {
font-weight: bold;
text-decoration: underline;
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) {
%ifdef WINSTRIPE_AERO
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);
}
%else
.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);
}
%endif
}
html|span.ac-emphasize-alt {

View File

@ -190,7 +190,7 @@ toolkit.jar:
skin/classic/aero/global/aboutSupport.css
skin/classic/aero/global/appPicker.css
skin/classic/aero/global/arrow.css
skin/classic/aero/global/autocomplete.css
* skin/classic/aero/global/autocomplete.css (autocomplete-aero.css)
skin/classic/aero/global/button.css
skin/classic/aero/global/checkbox.css
skin/classic/aero/global/colorpicker.css