forked from mirrors/gecko-dev
Bug 1818356 - Clean up --panel-description-color and --panel-disabled-color. r=sfoster
Differential Revision: https://phabricator.services.mozilla.com/D172270
This commit is contained in:
parent
9dafe649b4
commit
4692815ff1
5 changed files with 5 additions and 34 deletions
|
|
@ -29,7 +29,6 @@
|
||||||
|
|
||||||
--arrowpanel-dimmed: color-mix(in srgb, currentColor 12%, transparent);
|
--arrowpanel-dimmed: color-mix(in srgb, currentColor 12%, transparent);
|
||||||
--arrowpanel-dimmed-further: color-mix(in srgb, currentColor 20%, transparent);
|
--arrowpanel-dimmed-further: color-mix(in srgb, currentColor 20%, transparent);
|
||||||
--panel-disabled-color: color-mix(in srgb, currentColor 40%, transparent);
|
|
||||||
--panel-shortcut-color: rgb(91,91,102);
|
--panel-shortcut-color: rgb(91,91,102);
|
||||||
|
|
||||||
--input-color: rgb(21,20,26);
|
--input-color: rgb(21,20,26);
|
||||||
|
|
|
||||||
|
|
@ -72,12 +72,6 @@ add_task(async function test_popup_styling(browser, accDoc) {
|
||||||
"Popup text color should have been themed"
|
"Popup text color should have been themed"
|
||||||
);
|
);
|
||||||
|
|
||||||
Assert.equal(
|
|
||||||
arrowContentComputedStyle.getPropertyValue("--panel-description-color"),
|
|
||||||
`rgba(${hexToRGB(POPUP_TEXT_COLOR).join(", ")}, 0.7)`,
|
|
||||||
"Popup text description color should have been themed"
|
|
||||||
);
|
|
||||||
|
|
||||||
// Ensure popup border color was set properly
|
// Ensure popup border color was set properly
|
||||||
testBorderColor(arrowContent, POPUP_BORDER_COLOR);
|
testBorderColor(arrowContent, POPUP_BORDER_COLOR);
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -75,28 +75,6 @@ const toolkitVariableMap = [
|
||||||
"--arrowpanel-color",
|
"--arrowpanel-color",
|
||||||
{
|
{
|
||||||
lwtProperty: "popup_text",
|
lwtProperty: "popup_text",
|
||||||
processColor(rgbaChannels, element) {
|
|
||||||
const disabledColorVariable = "--panel-disabled-color";
|
|
||||||
const descriptionColorVariable = "--panel-description-color";
|
|
||||||
|
|
||||||
if (!rgbaChannels) {
|
|
||||||
element.style.removeProperty(disabledColorVariable);
|
|
||||||
element.style.removeProperty(descriptionColorVariable);
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
let { r, g, b, a } = rgbaChannels;
|
|
||||||
|
|
||||||
element.style.setProperty(
|
|
||||||
disabledColorVariable,
|
|
||||||
`rgba(${r}, ${g}, ${b}, 0.5)`
|
|
||||||
);
|
|
||||||
element.style.setProperty(
|
|
||||||
descriptionColorVariable,
|
|
||||||
`rgba(${r}, ${g}, ${b}, 0.7)`
|
|
||||||
);
|
|
||||||
return `rgba(${r}, ${g}, ${b}, ${a})`;
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
[
|
[
|
||||||
|
|
|
||||||
|
|
@ -8,9 +8,6 @@
|
||||||
@namespace html url("http://www.w3.org/1999/xhtml");
|
@namespace html url("http://www.w3.org/1999/xhtml");
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
/* ::::: Variables ::::: */
|
|
||||||
--panel-description-color: hsl(0,0%,50%);
|
|
||||||
|
|
||||||
/* ::::: Styles ::::: */
|
/* ::::: Styles ::::: */
|
||||||
appearance: auto;
|
appearance: auto;
|
||||||
-moz-default-appearance: dialog;
|
-moz-default-appearance: dialog;
|
||||||
|
|
|
||||||
|
|
@ -30,8 +30,8 @@
|
||||||
--arrowpanel-dimmed: color-mix(in srgb, currentColor 17%, transparent);
|
--arrowpanel-dimmed: color-mix(in srgb, currentColor 17%, transparent);
|
||||||
--arrowpanel-dimmed-further: color-mix(in srgb, currentColor 30%, transparent);
|
--arrowpanel-dimmed-further: color-mix(in srgb, currentColor 30%, transparent);
|
||||||
|
|
||||||
--panel-description-color: GrayText;
|
--panel-description-color: color-mix(in srgb, currentColor 60%, transparent);;
|
||||||
--panel-disabled-color: GrayText;
|
--panel-disabled-color: color-mix(in srgb, currentColor 40%, transparent);;
|
||||||
|
|
||||||
--popup-notification-body-width: calc(31em - calc(2 * var(--arrowpanel-padding)));
|
--popup-notification-body-width: calc(31em - calc(2 * var(--arrowpanel-padding)));
|
||||||
|
|
||||||
|
|
@ -56,6 +56,9 @@
|
||||||
@media (prefers-contrast) {
|
@media (prefers-contrast) {
|
||||||
:root:not(:-moz-lwtheme) {
|
:root:not(:-moz-lwtheme) {
|
||||||
--toolbarbutton-disabled-opacity: 0.3;
|
--toolbarbutton-disabled-opacity: 0.3;
|
||||||
|
|
||||||
|
--panel-description-color: inherit;
|
||||||
|
--panel-disabled-color: GrayText;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue