Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-12-01 00:32:11 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1754329 - Add hover interactions to settings menu r=thecount

Browse Source 
Differential Revision: https://phabricator.services.mozilla.com/D200386
This commit is contained in:
Nathan Barrett 2024-02-22 20:39:58 +00:00
parent a12c77df67
commit 5d5dcf47d6
4 changed files with 52 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
browser/components/newtab/content-src/components/CustomizeMenu/_CustomizeMenu.scss
View File

@ -143,6 +143,10 @@
border-radius: 4px;
appearance: none;
background-color: var(--newtab-element-secondary-color);
&:hover {
background-color: var(--newtab-element-secondary-hover-color);
}
}
.sponsored-checkbox:checked {
@ -151,6 +155,14 @@
background: url('chrome://global/skin/icons/check.svg') center no-repeat;
background-color: var(--newtab-primary-action-background);
&:hover {
background-color: var(--newtab-primary-element-hover-color);
}
&:active {
background-color: var(--newtab-primary-element-active-color);
}
@media (forced-colors: active) {
fill: $black;
}
@ -178,6 +190,10 @@
background-origin: content-box;
background-color: var(--newtab-background-color-secondary);
&:hover {
background-color: var(--newtab-element-secondary-hover-color);
}
&:dir(rtl) {
background-position-x: left;
}

12
browser/components/newtab/css/activity-stream-linux.css
View File

@ -1699,12 +1699,21 @@ main section {
appearance: none;
background-color: var(--newtab-element-secondary-color);
}
.home-section .section .sponsored-checkbox:hover {
background-color: var(--newtab-element-secondary-hover-color);
}
.home-section .section .sponsored-checkbox:checked {
-moz-context-properties: fill;
fill: var(--newtab-primary-element-text-color);
background: url("chrome://global/skin/icons/check.svg") center no-repeat;
background-color: var(--newtab-primary-action-background);
}
.home-section .section .sponsored-checkbox:checked:hover {
background-color: var(--newtab-primary-element-hover-color);
}
.home-section .section .sponsored-checkbox:checked:active {
background-color: var(--newtab-primary-element-active-color);
}
@media (forced-colors: active) {
.home-section .section .sponsored-checkbox:checked {
fill: #000;
@ -1731,6 +1740,9 @@ main section {
background-origin: content-box;
background-color: var(--newtab-background-color-secondary);
}
.home-section .section .selector:hover {
background-color: var(--newtab-element-secondary-hover-color);
}
.home-section .section .selector:dir(rtl) {
background-position-x: left;
}

12
browser/components/newtab/css/activity-stream-mac.css
View File

@ -1703,12 +1703,21 @@ main section {
appearance: none;
background-color: var(--newtab-element-secondary-color);
}
.home-section .section .sponsored-checkbox:hover {
background-color: var(--newtab-element-secondary-hover-color);
}
.home-section .section .sponsored-checkbox:checked {
-moz-context-properties: fill;
fill: var(--newtab-primary-element-text-color);
background: url("chrome://global/skin/icons/check.svg") center no-repeat;
background-color: var(--newtab-primary-action-background);
}
.home-section .section .sponsored-checkbox:checked:hover {
background-color: var(--newtab-primary-element-hover-color);
}
.home-section .section .sponsored-checkbox:checked:active {
background-color: var(--newtab-primary-element-active-color);
}
@media (forced-colors: active) {
.home-section .section .sponsored-checkbox:checked {
fill: #000;
@ -1735,6 +1744,9 @@ main section {
background-origin: content-box;
background-color: var(--newtab-background-color-secondary);
}
.home-section .section .selector:hover {
background-color: var(--newtab-element-secondary-hover-color);
}
.home-section .section .selector:dir(rtl) {
background-position-x: left;
}

12
browser/components/newtab/css/activity-stream-windows.css
View File

@ -1699,12 +1699,21 @@ main section {
appearance: none;
background-color: var(--newtab-element-secondary-color);
}
.home-section .section .sponsored-checkbox:hover {
background-color: var(--newtab-element-secondary-hover-color);
}
.home-section .section .sponsored-checkbox:checked {
-moz-context-properties: fill;
fill: var(--newtab-primary-element-text-color);
background: url("chrome://global/skin/icons/check.svg") center no-repeat;
background-color: var(--newtab-primary-action-background);
}
.home-section .section .sponsored-checkbox:checked:hover {
background-color: var(--newtab-primary-element-hover-color);
}
.home-section .section .sponsored-checkbox:checked:active {
background-color: var(--newtab-primary-element-active-color);
}
@media (forced-colors: active) {
.home-section .section .sponsored-checkbox:checked {
fill: #000;
@ -1731,6 +1740,9 @@ main section {
background-origin: content-box;
background-color: var(--newtab-background-color-secondary);
}
.home-section .section .selector:hover {
background-color: var(--newtab-element-secondary-hover-color);
}
.home-section .section .selector:dir(rtl) {
background-position-x: left;
}