/* This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ /* DO NOT EDIT this file directly, instead modify the relevant *.tokens.json file * and run `mach buildtokens` to see your changes. */ @layer acorn.tokens { :host { --toggle-background-color: var(--button-background-color); --toggle-background-color-hover: var(--button-background-color-hover); --toggle-background-color-active: var(--button-background-color-active); --toggle-background-color-pressed: var(--button-background-color-primary); --toggle-background-color-pressed-hover: var(--button-background-color-primary-hover); --toggle-background-color-pressed-active: var(--button-background-color-primary-active); --toggle-border-color: var(--border-color-interactive); --toggle-border-color-hover: var(--border-color-interactive-hover); --toggle-border-color-active: var(--border-color-interactive-active); --toggle-border-radius: var(--border-radius-circle); --toggle-border-width: var(--border-width); --toggle-dot-background-color: var(--toggle-border-color); --toggle-dot-background-color-hover: var(--toggle-border-color-hover); --toggle-dot-background-color-active: var(--toggle-border-color-active); --toggle-dot-background-color-on-pressed: var(--background-color-box); --toggle-dot-height: calc(var(--toggle-height) - 2 * var(--toggle-dot-margin) - 2 * var(--toggle-border-width)); --toggle-dot-margin: 1px; --toggle-dot-transform-x: calc(var(--toggle-width) - 2 * var(--toggle-dot-margin) - 2px - var(--toggle-dot-width)); --toggle-dot-width: var(--toggle-dot-height); --toggle-height: var(--size-item-small); --toggle-inset: -2px; --toggle-opacity-disabled: var(--button-opacity-disabled); --toggle-width: var(--size-item-large); } @media (prefers-contrast) { :host { --toggle-border-color: var(--border-color-interactive); } } @media (forced-colors: active) { :host { --toggle-background-color-disabled: var(--button-background-color-disabled); --toggle-background-color-pressed-disabled: var(--button-background-color-primary-disabled); --toggle-border-color: var(--border-color-interactive); --toggle-border-color-hover: var(--border-color-interactive-hover); --toggle-border-color-active: var(--border-color-interactive-active); --toggle-border-color-disabled: var(--border-color-interactive-disabled); --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-disabled: var(--button-text-color-disabled); --toggle-dot-background-color-on-pressed: var(--button-background-color); --toggle-dot-background-color-on-pressed-disabled: var(--button-text-color-primary-disabled); } } }