Commit 4268b7e3 authored by Gijs Kruitbosch's avatar Gijs Kruitbosch
Browse files

Bug 1746501 - add high-contrast-mode styling to download buttons, r=mhowell 

Differential Revision: https://phabricator.services.mozilla.com/D134453
parent 67f17519

browser/themes/shared/downloads/downloads.inc.css

+27 −3
Original line number Diff line number Diff line
@@ -55,7 +55,6 @@ 


@itemFinished@[exists].hoveringMainArea:hover,

@item@:is(.openWhenFinished).hoveringMainArea:hover,

@item@:not([verdict]) > .downloadButton:hover,

@item@[verdict]:hover,

@item@:hover:is(.openWhenFinished),

.downloadsPanelFooterButton:hover {
@@ -64,7 +63,6 @@ 


@itemFinished@[exists].hoveringMainArea:hover:active,

@item@:is(.openWhenFinished).hoveringMainArea:hover:active,

@item@:not([verdict]) > .downloadButton:hover:active,

.downloadsPanelFooterButton[open="true"],

@item@[verdict]:hover:active {

  background-color: var(--panel-item-active-bgcolor);
@@ -176,11 +174,15 @@ 
  height: 32px;

  margin: 0;

  margin-inline-start: 4px;

  border: none;

  border: 1px solid transparent;

  padding: 0;

  background: transparent;

  color: inherit;

  border-radius: 4px;

  --button-hover-bgcolor: var(--panel-item-hover-bgcolor);

  --button-hover-color: inherit;

  --button-active-bgcolor: var(--panel-item-active-bgcolor);

  --button-active-color: inherit;

}



.downloadButton > .button-box > .button-icon {
@@ -196,6 +198,28 @@ 
  padding: 0;

}



@media (prefers-contrast) {

  .downloadButton {

    background-color: Button;

    color: ButtonText;

    border-color: currentColor;

    --button-hover-bgcolor: SelectedItem;

    --button-hover-color: SelectedItemText;

    --button-active-bgcolor: Button;

    --button-active-color: ButtonText;

  }

}



.downloadButton:hover:not(:active) {

  background-color: var(--button-hover-bgcolor);

  color: var(--button-hover-color);

  border-color: var(--button-hover-bgcolor);

}

.downloadButton:hover:active {

  background-color: var(--button-active-bgcolor);

  color: var(--button-active-color);

}



/*** Button icons ***/



.downloadIconCancel > .button-box > .button-icon {