Bug 1703014 - Update hover and active effects in the downloads panel mainview for Proton. r=mconley,desktop-theme-reviewers,harry

Differential Revision: https://phabricator.services.mozilla.com/D111290
This commit is contained in:
prathikshaprasadsuman 2021-04-13 18:48:12 +00:00
parent 8cc5417248
commit 05f19be1fa
3 changed files with 44 additions and 19 deletions

View File

@ -24,6 +24,7 @@
outline-offset: -2px;
}
@media not (-moz-proton-doorhangers) {
@item@[verdict="Malware"]:not(:hover) {
color: #aa1b08;
}
@ -31,6 +32,7 @@
:root[lwt-popup-brighttext] @item@[verdict="Malware"]:not(:hover) {
color: #ff0039;
}
} /** END not Proton **/
.downloadProgress::-moz-progress-bar {
background-color: #3c9af8;

View File

@ -39,6 +39,27 @@
height: 3.1em;
padding: 0.31em;
margin: 0.31em 0;
border-radius: 4px;
}
@itemFinished@[exists]:hover,
@item@[verdict]:hover,
.downloadsPanelFooterButton:hover {
background-color: var(--button-hover-bgcolor);
}
@itemFinished@[exists]:hover:active,
.downloadsPanelFooterButton[open="true"],
@item@[verdict]:hover:active {
background-color: var(--button-active-bgcolor);
}
@item@[verdict="Malware"] .downloadDetails {
color: #C50042;
}
:root[lwt-popup-brighttext] @item@[verdict="Malware"] .downloadDetails {
color: #FF848B;
}
.downloadTypeIcon {
@ -55,7 +76,6 @@
.downloadTypeIcon {
margin: 8px 13px;
}
}/** END not Proton **/
.downloadsPanelFooterButton:hover {
outline: 1px solid var(--arrowpanel-dimmed);
@ -66,6 +86,25 @@
outline: 1px solid var(--arrowpanel-dimmed-further);
}
@itemFinished@[exists] .downloadMainArea:hover,
@item@:not([verdict]) > .downloadButton:hover,
@item@[verdict]:hover {
background-color: var(--arrowpanel-dimmed);
}
@itemFinished@[exists] > .downloadMainArea:hover:active,
@item@:not([verdict]) > .downloadButton:hover:active,
@item@[verdict]:hover:active {
background-color: var(--arrowpanel-dimmed-further);
}
@item@[verdict="Malware"]:hover,
@item@[verdict="Malware"]:hover:active {
background-color: #aa1b08;
color: white;
}
}/** END not Proton **/
@notKeyfocus@ .downloadsPanelFooterButton:-moz-focusring {
outline: none;
}
@ -191,24 +230,6 @@
padding: 0;
}
@itemFinished@[exists] .downloadMainArea:hover,
@item@:not([verdict]) > .downloadButton:hover,
@item@[verdict]:hover {
background-color: var(--arrowpanel-dimmed);
}
@itemFinished@[exists] > .downloadMainArea:hover:active,
@item@:not([verdict]) > .downloadButton:hover:active,
@item@[verdict]:hover:active {
background-color: var(--arrowpanel-dimmed-further);
}
@item@[verdict="Malware"]:hover,
@item@[verdict="Malware"]:hover:active {
background-color: #aa1b08;
color: white;
}
/*** Button icons ***/
.downloadIconCancel > .button-box > .button-icon {

View File

@ -27,6 +27,7 @@
}
@media (-moz-windows-default-theme) {
@media not (-moz-proton-doorhangers) {
@item@[verdict="Malware"]:not(:hover) {
color: #aa1b08;
}
@ -34,6 +35,7 @@
:root[lwt-popup-brighttext] @item@[verdict="Malware"]:not(:hover) {
color: #ff0039;
}
} /** END not Proton **/
/* Use unified color for the progressbar on default theme */
.downloadProgress::-moz-progress-bar {