Bug 1289139 and
bug 950058 - Modifications for review.
MozReview-Commit-ID: DmDMs8boITL
--- a/browser/components/downloads/content/downloads.css
+++ b/browser/components/downloads/content/downloads.css
@@ -109,22 +109,17 @@ richlistitem.download button {
.download-state:not(:-moz-any([state="-1"],/* Starting (initial) */
[state="0"], /* Downloading */
[state="1"], /* Finished */
[state="4"], /* Paused */
[state="5"]) /* Starting (queued) */)
.downloadShowMenuItem,
-.download-state[state="7"] .downloadCommandsSeparator,
-
-.download-state:-moz-any( [state="6"], /* Blocked (parental) */
- [state="7"], /* Scanning */
- [state="9"]) /* Blocked (policy) */
- toolbarseparator
+.download-state[state="7"] .downloadCommandsSeparator
{
display: none;
}
/*** Visibility of download buttons ***/
.download-state:not(:-moz-any([state="-1"],/* Starting (initial) */
[state="5"], /* Starting (queued) */
@@ -161,16 +156,21 @@ richlistitem.download button {
.download-state:not(:-moz-any([state="2"], /* Failed */
[state="3"]) /* Canceled */)
.downloadRetry,
.download-state:not( [state="1"] /* Finished */)
.downloadShow,
+.download-state:-moz-any( [state="6"], /* Blocked (parental) */
+ [state="7"], /* Scanning */
+ [state="9"]) /* Blocked (policy) */
+ > toolbarseparator,
+
/* The "show blocked info" button is shown only in the downloads panel. */
.downloadShowBlockedInfo
{
display: none;
}
/*** Downloads panel ***/
--- a/browser/themes/linux/downloads/downloads.css
+++ b/browser/themes/linux/downloads/downloads.css
@@ -27,16 +27,8 @@
}
/*** Highlighted list items ***/
@keyfocus@ @itemFocused@ {
outline: 1px -moz-dialogtext dotted;
outline-offset: -1px;
}
-
-@item@[showingsubview] {
- background-color: Highlight;
- background-image: linear-gradient(hsla(0,0%,100%,.1), transparent);
- color: HighlightText;
-}
-
-}
--- a/browser/themes/osx/downloads/downloads.css
+++ b/browser/themes/osx/downloads/downloads.css
@@ -26,25 +26,18 @@
--downloads-item-details-opacity: 0.7;
}
.downloadButton:focus > .button-box {
outline: 2px -moz-mac-focusring solid;
outline-offset: -2px;
}
-/*** Highlighted list items ***/
+@item@[verdict="Malware"] {
+ color: #aa1b08;
+}
-@item@[showingsubview] {
- background-color: Highlight;
- color: HighlightText;
-}
+/*** Highlighted list items ***/
@keyfocus@ @itemFocused@ {
outline: 2px -moz-mac-focusring solid;
outline-offset: -2px;
}
-
-@item@[showingsubview] {
- transition: background-color var(--panelui-subview-transition-duration),
- color var(--panelui-subview-transition-duration);
-}
-
--- a/browser/themes/shared/downloads/allDownloadsViewOverlay.inc.css
+++ b/browser/themes/shared/downloads/allDownloadsViewOverlay.inc.css
@@ -84,71 +84,70 @@
-moz-appearance: none;
-moz-box-align: center;
background: transparent;
min-width: 0;
min-height: 0;
margin: 3px;
border: none;
padding: 5px;
- color: graytext;
+ color: inherit;
}
.downloadButton > .button-box {
-moz-appearance: none;
padding: 2px !important;
border-radius: 50%;
+ color: graytext;
}
.downloadButton > .button-box > .button-icon {
width: 16px;
height: 16px;
margin: 0;
filter: url("chrome://browser/skin/filters.svg#fill");
fill: currentColor;
}
.downloadButton > .button-box > .button-text {
display: none;
}
-@item@ .downloadButton:hover > .button-box {
+.downloadButton:hover > .button-box {
background-color: graytext;
+ color: -moz-field;
}
-@item@:hover .downloadButton:hover {
- color: HighlightText;
-}
-
-@itemFocused@ .downloadButton:hover > .button-box {
- background-color: HighlightText;
+.downloadButton:hover:active > .button-box {
+ background-color: -moz-fieldtext;
}
-@itemFocused@ .downloadButton:hover:active > .button-box {
- background-color: graytext;
+@itemFocused@ > .downloadButtonArea > .downloadButton > .button-box {
+ color: inherit;
}
-@itemFocused@ .downloadButton,
-@itemFocused@:hover .downloadButton {
- color: HighlightText;
+@itemFocused@ > .downloadButtonArea > .downloadButton:hover > .button-box {
+ background-color: HighlightText;
+ color: Highlight;
}
-@itemFocused@:hover .downloadButton:hover {
- color: Highlight;
+@itemFocused@ > .downloadButtonArea > .downloadButton:hover:active > .button-box {
+ background-color: -moz-field;
+ color: -moz-fieldtext;
}
/*** Button icons ***/
-.downloadButton.downloadIconCancel .button-icon {
+.downloadIconCancel > .button-box > .button-icon {
list-style-image: url("chrome://browser/skin/panel-icons.svg#cancel");
}
-.downloadButton.downloadIconShow .button-icon {
+.downloadIconShow > .button-box > .button-icon {
%ifdef XP_MACOSX
list-style-image: url("chrome://browser/skin/panel-icons.svg#magnifier");
%else
list-style-image: url("chrome://browser/skin/panel-icons.svg#folder");
%endif
}
-.downloadButton.downloadIconRetry .button-icon {
+.downloadIconRetry > .button-box > .button-icon {
list-style-image: url("chrome://browser/skin/panel-icons.svg#retry");
}
--- a/browser/themes/shared/downloads/downloads.inc.css
+++ b/browser/themes/shared/downloads/downloads.inc.css
@@ -179,17 +179,16 @@ richlistitem[type="download"] {
padding: 0;
}
richlistitem[type="download"]:last-child {
border-bottom: none;
}
richlistitem[type="download"] > .downloadMainArea {
- padding-inline-end: 0;
padding: 8px;
}
.downloadTypeIcon {
margin-top: 8px;
margin-inline-end: 12px;
margin-bottom: 8px;
margin-inline-start: 0;
@@ -209,20 +208,16 @@ richlistitem[type="download"] > .downloa
@item@[verdict="PotentiallyUnwanted"] .downloadBlockedBadge {
background-image: url("chrome://browser/skin/warning.svg");
}
@item@[verdict="Uncommon"] .downloadBlockedBadge {
background-image: url("chrome://browser/skin/info.svg");
}
-@item@[verdict="Malware"] {
- color: #aa1b08;
-}
-
/* We hold .downloadTarget, .downloadProgress and .downloadDetails inside of
a vbox with class .downloadContainer. We set the font-size of the entire
container to --downloads-item-font-size-factor because:
1) This is the size that we want .downloadDetails to be
2) The container's width is set by localizers by &downloadDetails.width;,
which is a ch unit. Since this is the value that should control the
panel width, we apply it to the outer container to constrain
@@ -249,24 +244,23 @@ richlistitem[type="download"] > .downloa
#downloadsSummaryDetails,
.downloadDetails {
margin-top: var(--downloads-item-details-margin-top);
opacity: var(--downloads-item-details-opacity);
cursor: inherit;
}
-@item@[state="8"] > toolbarseparator {
+@item@[verdict] > toolbarseparator {
visibility: hidden;
}
.downloadButton {
-moz-appearance: none;
min-width: 58px;
- height: var(--downloads-item-height);
margin: 0;
border: none;
background: transparent;
padding: 8px;
color: graytext;
}
.downloadButton > .button-box > .button-icon {
@@ -277,73 +271,74 @@ richlistitem[type="download"] > .downloa
fill: currentColor;
}
.downloadButton > .button-box > .button-text {
margin: 0 !important;
padding: 0;
}
-@itemFinished@[exists]:hover .downloadMainArea,
-@item@:hover .downloadButton,
-@item@[verdict]:hover {
+@itemFinished@[exists]:hover > .downloadMainArea,
+@item@:not([verdict]):hover > .downloadButtonArea {
background-color: var(--arrowpanel-dimmed);
}
-@item@ .downloadButton:hover,
-@itemFinished@[exists] .downloadMainArea:hover {
+@itemFinished@[exists] .downloadMainArea:hover,
+@item@:not([verdict]) > .downloadButtonArea:hover,
+@item@[verdict]:hover {
background-color: var(--arrowpanel-dimmed-further);
}
-@item@ .downloadButton:hover:active,
-@itemFinished@[exists] .downloadMainArea:hover:active {
+@itemFinished@[exists] > .downloadMainArea:hover:active,
+@item@:not([verdict]) > .downloadButtonArea:hover:active,
+@item@[verdict]:hover:active {
background-color: var(--arrowpanel-dimmed-even-further);
}
-@item@[verdict] .downloadButton,
-@item@[verdict] .downloadButton:hover,
-@item@[verdict] .downloadButton:hover:active {
- background-color: transparent;
+@item@[showingsubview] {
+ background-color: Highlight;
+ color: HighlightText;
+ transition: background-color var(--panelui-subview-transition-duration),
+ color var(--panelui-subview-transition-duration);
}
-@notKeyfocus@ @item@[verdict="Malware"]:hover,
-@notKeyfocus@ @item@[verdict="Malware"]:hover:active,
-@item@[showingsubview][verdict="Malware"] {
+@item@[verdict="Malware"]:hover,
+@item@[verdict="Malware"]:hover:active,
+@item@[verdict="Malware"][showingsubview] {
background-color: #aa1b08;
color: white;
}
-@item@[verdict="Malware"]:hover .downloadButton.downloadShowBlockedInfo,
-@keyfocus@ @itemFocused@[verdict="Malware"] .downloadButton.downloadShowBlockedInfo {
- color: HighlightText;
+@item@[verdict="Malware"]:hover > .downloadButtonArea > .downloadButton {
+ color: inherit;
}
/*** Button icons ***/
-.downloadButton.downloadIconCancel > .button-box > .button-icon {
+.downloadIconCancel > .button-box > .button-icon {
list-style-image: url("chrome://browser/skin/panel-icons.svg#cancel");
}
-.downloadButton.downloadIconShow > .button-box > .button-icon {
+.downloadIconShow > .button-box > .button-icon {
%ifdef XP_MACOSX
list-style-image: url("chrome://browser/skin/panel-icons.svg#magnifier");
%else
list-style-image: url("chrome://browser/skin/panel-icons.svg#folder");
%endif
}
-.downloadButton.downloadIconRetry > .button-box > .button-icon {
+.downloadIconRetry > .button-box > .button-icon {
list-style-image: url("chrome://browser/skin/panel-icons.svg#retry");
}
-.downloadButton.downloadShowBlockedInfo > .button-box > .button-icon {
+.downloadShowBlockedInfo > .button-box > .button-icon {
list-style-image: url("chrome://browser/skin/panel-icons.svg#arrow-right");
}
-.downloadButton.downloadShowBlockedInfo > .button-box > .button-icon:-moz-locale-dir(rtl) {
+.downloadShowBlockedInfo > .button-box > .button-icon:-moz-locale-dir(rtl) {
list-style-image: url("chrome://browser/skin/panel-icons.svg#arrow-left");
}
/*** Blocked subview ***/
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype=main] > .panel-subviews {
/* When the main view is showing, the shadow on the left edge of the subview is
barely visible on the right edge of the main view, so set it to none. */
--- a/browser/themes/windows/downloads/downloads.css
+++ b/browser/themes/windows/downloads/downloads.css
@@ -68,22 +68,20 @@
.downloadButton > .button-box {
border: 1px solid transparent;
}
@keyfocus@ .downloadButton:focus > .button-box {
border: 1px dotted ThreeDDarkShadow;
}
+@media (-moz-windows-default-theme) {
+ @item@[verdict="Malware"] {
+ color: #aa1b08;
+ }
+}
+
/*** Highlighted list items ***/
@keyfocus@ @itemFocused@ {
outline: 1px -moz-dialogtext dotted;
outline-offset: -1px;
}
-
-@item@[showingsubview] {
- background-color: Highlight;
- color: HighlightText;
- transition: background-color var(--panelui-subview-transition-duration),
- color var(--panelui-subview-transition-duration);
-}
-