Merge pull request #14516 from calixteman/focused_buttons

[UI] Avoid to have buttons in hover state after having been clicked (bug 836732)
This commit is contained in:
Jonas Jenwald 2022-01-31 11:27:17 +01:00 committed by GitHub
commit bff7eb8ce8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -559,7 +559,7 @@ html[dir="rtl"] .findbar .splitToolbarButton > .findNext {
} }
.findbar label:hover, .findbar label:hover,
.findbar input:focus + label { .findbar input:focus-visible + label {
color: var(--toggled-btn-color); color: var(--toggled-btn-color);
background-color: var(--button-hover-color); background-color: var(--button-hover-color);
} }
@ -753,12 +753,12 @@ html[dir="rtl"] .splitToolbarButton > .toolbarButton {
} }
.overlayButton:hover, .overlayButton:hover,
.overlayButton:focus { .overlayButton:focus-visible {
background-color: var(--overlay-button-hover-bg-color); background-color: var(--overlay-button-hover-bg-color);
} }
.overlayButton:hover > span, .overlayButton:hover > span,
.overlayButton:focus > span { .overlayButton:focus-visible > span {
color: var(--overlay-button-hover-color); color: var(--overlay-button-hover-color);
} }
@ -780,10 +780,10 @@ html[dir="rtl"] .splitToolbarButton > .toolbarButton {
} }
.splitToolbarButton > .toolbarButton:hover, .splitToolbarButton > .toolbarButton:hover,
.splitToolbarButton > .toolbarButton:focus, .splitToolbarButton > .toolbarButton:focus-visible,
.dropdownToolbarButton:hover, .dropdownToolbarButton:hover,
.toolbarButton.textButton:hover, .toolbarButton.textButton:hover,
.toolbarButton.textButton:focus { .toolbarButton.textButton:focus-visible {
background-color: var(--button-hover-color); background-color: var(--button-hover-color);
z-index: 199; z-index: 199;
} }
@ -847,11 +847,11 @@ html[dir="rtl"] #toolbarViewerLeft > .toolbarButton:first-child {
margin-right: 2px; margin-right: 2px;
} }
.toolbarButton:hover, .toolbarButton:hover,
.toolbarButton:focus { .toolbarButton:focus-visible {
background-color: var(--button-hover-color); background-color: var(--button-hover-color);
} }
.secondaryToolbarButton:hover, .secondaryToolbarButton:hover,
.secondaryToolbarButton:focus { .secondaryToolbarButton:focus-visible {
background-color: var(--doorhanger-hover-bg-color); background-color: var(--doorhanger-hover-bg-color);
color: var(--doorhanger-hover-color); color: var(--doorhanger-hover-color);
} }
@ -917,7 +917,7 @@ html[dir="rtl"] .dropdownToolbarButton > select {
padding-right: 4px; padding-right: 4px;
} }
.dropdownToolbarButton > select:hover, .dropdownToolbarButton > select:hover,
.dropdownToolbarButton > select:focus { .dropdownToolbarButton > select:focus-visible {
background-color: var(--button-hover-color); background-color: var(--button-hover-color);
color: var(--toggled-btn-color); color: var(--toggled-btn-color);
} }
@ -959,7 +959,7 @@ html[dir="rtl"] .dropdownToolbarButton > select {
} }
.dropdownToolbarButton:hover::after, .dropdownToolbarButton:hover::after,
.dropdownToolbarButton:focus::after, .dropdownToolbarButton:focus-visible::after,
.dropdownToolbarButton:active::after { .dropdownToolbarButton:active::after {
background-color: var(--toolbar-icon-hover-bg-color); background-color: var(--toolbar-icon-hover-bg-color);
} }
@ -971,9 +971,9 @@ html[dir="rtl"] .dropdownToolbarButton > select {
} }
.toolbarButton:hover::before, .toolbarButton:hover::before,
.toolbarButton:focus::before, .toolbarButton:focus-visible::before,
.secondaryToolbarButton:hover::before, .secondaryToolbarButton:hover::before,
.secondaryToolbarButton:focus::before { .secondaryToolbarButton:focus-visible::before {
background-color: var(--toolbar-icon-hover-bg-color); background-color: var(--toolbar-icon-hover-bg-color);
} }