summaryrefslogtreecommitdiffstats
path: root/toolkit/content/widgets/moz-toggle/moz-toggle.css
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:13:27 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:13:27 +0000
commit40a355a42d4a9444dc753c04c6608dade2f06a23 (patch)
tree871fc667d2de662f171103ce5ec067014ef85e61 /toolkit/content/widgets/moz-toggle/moz-toggle.css
parentAdding upstream version 124.0.1. (diff)
downloadfirefox-adbda400be353e676059e335c3c0aaf99e719475.tar.xz
firefox-adbda400be353e676059e335c3c0aaf99e719475.zip
Adding upstream version 125.0.1.upstream/125.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'toolkit/content/widgets/moz-toggle/moz-toggle.css')
-rw-r--r--toolkit/content/widgets/moz-toggle/moz-toggle.css39
1 files changed, 22 insertions, 17 deletions
diff --git a/toolkit/content/widgets/moz-toggle/moz-toggle.css b/toolkit/content/widgets/moz-toggle/moz-toggle.css
index 8b67a81878..2005544181 100644
--- a/toolkit/content/widgets/moz-toggle/moz-toggle.css
+++ b/toolkit/content/widgets/moz-toggle/moz-toggle.css
@@ -38,11 +38,15 @@
--toggle-background-color-pressed-hover: var(--color-accent-primary-hover);
--toggle-background-color-pressed-active: var(--color-accent-primary-active);
--toggle-border-color: var(--border-interactive-color);
+ --toggle-border-color-hover: var(--toggle-border-color);
+ --toggle-border-color-active: var(--toggle-border-color);
--toggle-border-radius: var(--border-radius-circle);
--toggle-border-width: var(--border-width);
--toggle-height: var(--size-item-small);
--toggle-width: var(--size-item-large);
--toggle-dot-background-color: var(--toggle-border-color);
+ --toggle-dot-background-color-hover: var(--toggle-dot-background-color);
+ --toggle-dot-background-color-active: var(--toggle-dot-background-color);
--toggle-dot-background-color-on-pressed: var(--color-canvas);
--toggle-dot-margin: 1px;
--toggle-dot-height: calc(var(--toggle-height) - 2 * var(--toggle-dot-margin) - 2 * var(--toggle-border-width));
@@ -141,17 +145,6 @@
background-color: var(--toggle-background-color-disabled);
}
- .toggle-button {
- --toggle-dot-background-color: var(--color-accent-primary);
- --toggle-dot-background-color-hover: var(--color-accent-primary-hover);
- --toggle-dot-background-color-active: var(--color-accent-primary-active);
- --toggle-dot-background-color-on-pressed: var(--button-background-color);
- --toggle-background-color-disabled: var(--button-background-color-disabled);
- --toggle-border-color-hover: var(--border-interactive-color-hover);
- --toggle-border-color-active: var(--border-interactive-color-active);
- --toggle-border-color-disabled: var(--border-interactive-color-disabled);
- }
-
.toggle-button:enabled:hover {
border-color: var(--toggle-border-color-hover);
}
@@ -175,6 +168,24 @@
border-color: var(--toggle-dot-background-color-hover);
}
+ .toggle-button:hover::before,
+ .toggle-button:active::before {
+ background-color: var(--toggle-dot-background-color-hover);
+ }
+}
+
+@media (forced-colors) {
+ .toggle-button {
+ --toggle-dot-background-color: var(--color-accent-primary);
+ --toggle-dot-background-color-hover: var(--color-accent-primary-hover);
+ --toggle-dot-background-color-active: var(--color-accent-primary-active);
+ --toggle-dot-background-color-on-pressed: var(--button-background-color);
+ --toggle-background-color-disabled: var(--button-background-color-disabled);
+ --toggle-border-color-hover: var(--border-interactive-color-hover);
+ --toggle-border-color-active: var(--border-interactive-color-active);
+ --toggle-border-color-disabled: var(--border-interactive-color-disabled);
+ }
+
.toggle-button[aria-pressed="true"]:enabled::after {
border: 1px solid var(--button-background-color);
content: '';
@@ -189,10 +200,4 @@
.toggle-button[aria-pressed="true"]:enabled:active::after {
border-color: var(--toggle-border-color-active);
}
-
- .toggle-button:hover::before,
- .toggle-button:hover:active::before,
- .toggle-button:active::before {
- background-color: var(--toggle-dot-background-color-hover);
- }
}