Bug 1698814 - Part 2 - Consolidate toolbar-field color variables. r=desktop-theme-reviewers,dao

Depends on D117028

Differential Revision: https://phabricator.services.mozilla.com/D117029
This commit is contained in:
Harry Twyford 2021-08-04 18:01:09 +00:00
parent 2d4da45cce
commit 5a78aad0cc
7 changed files with 20 additions and 24 deletions

View File

@ -43,8 +43,8 @@
}
.identity-color-toolbar {
--identity-tab-color: var(--lwt-toolbar-field-color, FieldText);
--identity-icon-color: var(--lwt-toolbar-field-color, FieldText);
--identity-tab-color: var(--toolbar-field-color);
--identity-icon-color: var(--toolbar-field-color);
}
.identity-icon-fence {

View File

@ -61,7 +61,7 @@
--chrome-content-separator-color: rgb(204,204,204);
--toolbar-field-background-color: rgb(240,240,244);
--toolbar-field-non-lwt-color: rgb(21,20,26);
--toolbar-field-color: rgb(21,20,26);
--autocomplete-popup-highlight-background: #e0e0e6;
--autocomplete-popup-highlight-color: rgb(21,20,26);

View File

@ -36,7 +36,7 @@
#searchbar {
min-height: var(--urlbar-min-height);
text-shadow: none;
color: var(--toolbar-field-non-lwt-color, FieldText);
color: var(--toolbar-field-color);
}
#urlbar-background,
@ -96,11 +96,6 @@
border-color: var(--toolbar-field-focus-border-color);
}
#urlbar:-moz-lwtheme,
#searchbar:-moz-lwtheme {
color: var(--lwt-toolbar-field-color, black);
}
#urlbar:not([focused="true"], [open]):-moz-lwtheme > #urlbar-background,
#searchbar:not(:focus-within):-moz-lwtheme {
border-color: var(--lwt-toolbar-field-border-color, var(--toolbar-field-border-color));
@ -111,9 +106,9 @@
border-color: var(--lwt-toolbar-field-border-color, @fieldHoverBorderColor@);
}
#urlbar:is([focused="true"], [open]):-moz-lwtheme,
#searchbar:focus-within:-moz-lwtheme {
color: var(--lwt-toolbar-field-focus-color);
#urlbar:is([focused="true"], [open]),
#searchbar:focus-within {
color: var(--toolbar-field-focus-color);
}
#urlbar:is([focused="true"], [open]) > #urlbar-background,
@ -330,7 +325,7 @@
-moz-context-properties: fill, fill-opacity;
fill-opacity: 0.6;
stroke-opacity: var(--identity-box-label-opacity);
fill: var(--lwt-toolbar-field-focus-color);
fill: inherit;
border-radius: var(--urlbar-icon-border-radius);
}

View File

@ -581,10 +581,7 @@
thus we invert the background, using the panel color, instead. */
.urlbarView-row:is([type=switchtab], [type=remotetab]):is([selected], :hover) > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-action {
background-color: var(--toolbar-field-focus-background-color);
color: FieldText;
}
.urlbarView-row:is([type=switchtab], [type=remotetab]):is([selected], :hover) > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-action:-moz-lwtheme {
color: var(--lwt-toolbar-field-focus-color);
color: var(--toolbar-field-focus-color);
}
.urlbarView-row[type=remotetab]:not([selected], :hover) > .urlbarView-row-inner > .urlbarView-no-wrap > .urlbarView-title-separator::before,
@ -722,8 +719,8 @@
--panel-padding: var(--panel-subview-body-padding);
}
#PopupSearchAutoComplete:-moz-lwtheme {
--panel-color: var(--lwt-toolbar-field-focus-color);
#PopupSearchAutoComplete {
--panel-color: var(--toolbar-field-focus-color);
--panel-background: var(--toolbar-field-focus-background-color);
}

View File

@ -115,7 +115,7 @@ const toolkitVariableMap = [
},
],
[
"--lwt-toolbar-field-color",
"--toolbar-field-color",
{
lwtProperty: "toolbar_field_text",
processColor(rgbaChannels, element) {
@ -164,7 +164,7 @@ const toolkitVariableMap = [
},
],
[
"--lwt-toolbar-field-focus-color",
"--toolbar-field-focus-color",
{
lwtProperty: "toolbar_field_text_focus",
fallbackProperty: "toolbar_field_text",

View File

@ -44,10 +44,10 @@ findbar[noanim] {
contrast issues, see bug 1506913 */
html|html[lwtheme-image] findbar {
--toolbar-field-background-color: initial;
--lwt-toolbar-field-color: initial;
--toolbar-field-color: initial;
--lwt-toolbar-field-border-color: initial;
--toolbar-field-focus-background-color: initial;
--lwt-toolbar-field-focus-color: initial;
--toolbar-field-focus-color: initial;
}
html|input.findbar-textbox {
@ -64,7 +64,7 @@ html|input.findbar-textbox {
html|input.findbar-textbox:-moz-lwtheme {
background-color: var(--input-bgcolor, var(--toolbar-field-background-color));
color: var(--input-color, var(--lwt-toolbar-field-color, FieldText));
color: var(--input-color, var(--toolbar-field-color));
}
html|input.findbar-textbox:focus {

View File

@ -30,13 +30,17 @@
--toolbarbutton-icon-fill: currentColor;
--toolbar-field-background-color: Field;
--toolbar-field-color: FieldText;
--toolbar-field-focus-background-color: Field;
--toolbar-field-focus-color: FieldText;
}
:root:-moz-lwtheme {
--toolbar-field-background-color: rgba(255, 255, 255, 0.8);
/* --toolbar-field-focus-background-color is given a `white` fallback in
LightweightThemeConsumer.jsm. */
--toolbar-field-color: black;
--toolbar-field-focus-color: black;
}
:is(menupopup, panel)[type=arrow] {