Source code
Revision control
Copy as Markdown
Other Tools
/* 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
/* DO NOT EDIT this file directly, instead modify urlbar.tokens.json
* and run `mach buildtokens` to see your changes. */
@layer tokens-foundation, tokens-browser-theme, tokens-foundation-brand, tokens-foundation-nova, tokens-browser-theme-nova, tokens-foundation-brand-nova, tokens-prefers-contrast, tokens-prefers-contrast-nova, tokens-forced-colors, tokens-forced-colors-nova;
:root,
:host {
@layer tokens-foundation {
--urlbar-background-color: var(--toolbar-field-background-color);
--urlbar-background-color-focus: var(--toolbar-field-background-color-focus);
--urlbar-border-radius: var(--button-border-radius);
--urlbar-box-background-color: var(--button-background-color);
--urlbar-box-background-color-hover: light-dark(var(--button-background-color-hover), color-mix(in srgb, currentColor 22%, transparent));
--urlbar-box-background-color-active: var(--button-background-color-active);
--urlbar-box-background-color-focus: light-dark(var(--button-background-color), color-mix(in srgb, currentColor 16%, transparent));
--urlbar-box-text-color: inherit;
--urlbar-box-text-color-hover: var(--urlbar-box-text-color);
--urlbar-box-text-color-active: var(--urlbar-box-text-color);
--urlbar-icon-fill-opacity: 0.9;
--urlbar-margin-inline: 5px;
--urlbar-padding-block: 4px;
}
@layer tokens-prefers-contrast {
@media (prefers-contrast) {
--urlbar-icon-fill-opacity: 1;
}
}
@media -moz-pref("browser.nova.enabled") {
@layer tokens-foundation-nova {
--urlbar-border-radius: var(--popup-border-radius);
--urlbar-box-background-color-focus: var(--urlbar-box-background-color);
--urlbar-box-background-color: color-mix(in srgb, currentColor 16%, transparent);
--urlbar-box-background-color-hover: color-mix(in srgb, currentColor 22%, transparent);
--urlbar-box-background-color-active: color-mix(in srgb, currentColor 30%, transparent);
--urlbar-icon-fill-opacity: 0.9;
}
@layer tokens-prefers-contrast-nova {
@media (prefers-contrast) {
--urlbar-icon-fill-opacity: 1;
}
}
}
}
:root:is([theme-in-app], :not([lwtheme])),
:host {
@layer tokens-browser-theme {
@media not ((forced-colors) or (-moz-native-theme)) {
--urlbar-box-background-color: light-dark(white, rgb(66, 65, 77));
--urlbar-icon-fill-opacity: 0.72;
}
}
@media -moz-pref("browser.nova.enabled") {
@layer tokens-browser-theme-nova {
@media not ((forced-colors) or (-moz-native-theme)) {
--urlbar-box-background-color: var(--urlbarview-background-color-hover);
--urlbar-box-background-color-hover: var(--urlbarview-background-color-selected);
--urlbar-box-background-color-active: light-dark(rgba(117, 102, 159, 0.6), rgba(176, 163, 210, 0.6));
--urlbar-icon-fill-opacity: light-dark(0.7, 0.95);
}
}
}
}