Bug 1796385 - Improve the color scheme of the Address Book. r=micahilbery,Paenglab
Differential Revision: https://phabricator.services.mozilla.com/D159958 --HG-- extra : moz-landing-system : lando
This commit is contained in:
Alessandro Castellani
Родитель
58c2ab35a3
Коммит
4b8b458534
|
|
@ -1452,7 +1452,7 @@ var cardsPane = {
|
|||
|
||||
init() {
|
||||
this.searchInput = document.getElementById("searchInput");
|
||||
this.sortButton = document.getElementById("sortButton");
|
||||
this.displayButton = document.getElementById("displayButton");
|
||||
this.sortContext = document.getElementById("sortContext");
|
||||
this.cardsHeader = document.getElementById("cardsHeader");
|
||||
this.cardsList = document.getElementById("cards");
|
||||
|
|
@ -1542,7 +1542,7 @@ var cardsPane = {
|
|||
}
|
||||
|
||||
this.searchInput.addEventListener("command", this);
|
||||
this.sortButton.addEventListener("click", this);
|
||||
this.displayButton.addEventListener("click", this);
|
||||
this.sortContext.addEventListener("command", this);
|
||||
this.cardsHeader.addEventListener("click", this);
|
||||
this.cardsList.addEventListener("select", this);
|
||||
|
|
@ -1630,6 +1630,16 @@ var cardsPane = {
|
|||
"rows",
|
||||
isTableLayout ? "ab-table-card-listrow" : "ab-card-listrow"
|
||||
);
|
||||
if (isTableLayout) {
|
||||
this.sortContext
|
||||
.querySelector("#sortContextTableLayout")
|
||||
.setAttribute("checked", "true");
|
||||
} else {
|
||||
this.sortContext
|
||||
.querySelector("#sortContextTableLayout")
|
||||
.removeAttribute("checked");
|
||||
}
|
||||
|
||||
this.cardsList.scrollToIndex(this.cardsList.selectedIndex);
|
||||
Services.xulStore.setValue(
|
||||
"about:addressbook",
|
||||
|
|
@ -2140,10 +2150,7 @@ var cardsPane = {
|
|||
|
||||
switch (event.target.id) {
|
||||
case "sortContextTableLayout":
|
||||
this.toggleLayout(true);
|
||||
break;
|
||||
case "sortContextListLayout":
|
||||
this.toggleLayout(false);
|
||||
this.toggleLayout(event.target.getAttribute("checked") === "true");
|
||||
break;
|
||||
case "cardContextWrite":
|
||||
this.writeToSelected();
|
||||
|
|
@ -2200,8 +2207,8 @@ var cardsPane = {
|
|||
},
|
||||
|
||||
_onClick(event) {
|
||||
if (event.target.closest("button") == this.sortButton) {
|
||||
this.sortContext.openPopup(this.sortButton, { triggerEvent: event });
|
||||
if (event.target.closest("button") == this.displayButton) {
|
||||
this.sortContext.openPopup(this.displayButton, { triggerEvent: event });
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
|
@ -2787,7 +2794,7 @@ var detailsPane = {
|
|||
}
|
||||
|
||||
// Remove these elements from (or add them back to) the tab focus cycle.
|
||||
for (let id of ["books", "searchInput", "sortButton", "cards"]) {
|
||||
for (let id of ["books", "searchInput", "displayButton", "cards"]) {
|
||||
document.getElementById(id).tabIndex = editing ? -1 : 0;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -112,8 +112,8 @@
|
|||
<input is="ab-card-search-input" id="searchInput"
|
||||
type="search"
|
||||
data-l10n-attrs="placeholder" />
|
||||
<button id="sortButton" data-l10n-id="about-addressbook-sort-button2">
|
||||
<img src="chrome://messenger/skin/icons/new/compact/sort.svg" alt="" />
|
||||
<button id="displayButton" data-l10n-id="about-addressbook-sort-button2">
|
||||
<img src="chrome://messenger/skin/icons/new/compact/filter.svg" alt="" />
|
||||
</button>
|
||||
</div>
|
||||
<div id="cardsHeader"></div>
|
||||
|
|
@ -429,9 +429,8 @@
|
|||
data-l10n-id="about-addressbook-sort-email-descending"/>
|
||||
<xul:menuseparator/>
|
||||
<xul:menuitem id="sortContextTableLayout"
|
||||
data-l10n-id="about-addressbook-horizontal-layout"/>
|
||||
<xul:menuitem id="sortContextListLayout"
|
||||
data-l10n-id="about-addressbook-vertical-layout"/>
|
||||
type="checkbox"
|
||||
data-l10n-id="about-addressbook-table-layout"/>
|
||||
</xul:menupopup>
|
||||
<xul:menupopup id="cardContext">
|
||||
<xul:menuitem id="cardContextWrite"
|
||||
|
|
|
|||
|
|
@ -890,7 +890,7 @@ add_task(async function test_layout() {
|
|||
|
||||
// Switch layout to table.
|
||||
|
||||
await toggleLayout(true);
|
||||
await toggleLayout();
|
||||
|
||||
Assert.ok(
|
||||
abDocument.body.classList.contains("layout-table"),
|
||||
|
|
@ -1040,7 +1040,7 @@ add_task(async function test_layout() {
|
|||
|
||||
// Reset layout to list.
|
||||
|
||||
await toggleLayout(false);
|
||||
await toggleLayout();
|
||||
|
||||
Assert.ok(
|
||||
!abDocument.body.classList.contains("layout-table"),
|
||||
|
|
@ -1155,7 +1155,7 @@ add_task(async function test_list_table_layout() {
|
|||
|
||||
// Switch layout to table.
|
||||
|
||||
await toggleLayout(true);
|
||||
await toggleLayout();
|
||||
|
||||
await showSortMenu("toggle", "addrbook");
|
||||
await TestUtils.waitForCondition(
|
||||
|
|
|
|||
|
|
@ -273,10 +273,10 @@ async function showSortMenu(name, value) {
|
|||
let abWindow = getAddressBookWindow();
|
||||
let abDocument = abWindow.document;
|
||||
|
||||
let sortButton = abDocument.getElementById("sortButton");
|
||||
let displayButton = abDocument.getElementById("displayButton");
|
||||
let sortContext = abDocument.getElementById("sortContext");
|
||||
let shownPromise = BrowserTestUtils.waitForEvent(sortContext, "popupshown");
|
||||
EventUtils.synthesizeMouseAtCenter(sortButton, {}, abWindow);
|
||||
EventUtils.synthesizeMouseAtCenter(displayButton, {}, abWindow);
|
||||
await shownPromise;
|
||||
let hiddenPromise = BrowserTestUtils.waitForEvent(sortContext, "popuphidden");
|
||||
sortContext.activateItem(
|
||||
|
|
@ -288,21 +288,17 @@ async function showSortMenu(name, value) {
|
|||
await hiddenPromise;
|
||||
}
|
||||
|
||||
async function toggleLayout(tableLayout) {
|
||||
async function toggleLayout() {
|
||||
let abWindow = getAddressBookWindow();
|
||||
let abDocument = abWindow.document;
|
||||
|
||||
let sortButton = abDocument.getElementById("sortButton");
|
||||
let displayButton = abDocument.getElementById("displayButton");
|
||||
let sortContext = abDocument.getElementById("sortContext");
|
||||
let shownPromise = BrowserTestUtils.waitForEvent(sortContext, "popupshown");
|
||||
EventUtils.synthesizeMouseAtCenter(sortButton, {}, abWindow);
|
||||
EventUtils.synthesizeMouseAtCenter(displayButton, {}, abWindow);
|
||||
await shownPromise;
|
||||
let hiddenPromise = BrowserTestUtils.waitForEvent(sortContext, "popuphidden");
|
||||
sortContext.activateItem(
|
||||
abDocument.getElementById(
|
||||
tableLayout ? "sortContextTableLayout" : "sortContextListLayout"
|
||||
)
|
||||
);
|
||||
sortContext.activateItem(abDocument.getElementById("sortContextTableLayout"));
|
||||
await hiddenPromise;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -91,10 +91,8 @@ about-addressbook-sort-email-ascending =
|
|||
about-addressbook-sort-email-descending =
|
||||
.label = Sort by email address (Z > A)
|
||||
|
||||
about-addressbook-horizontal-layout =
|
||||
.label = Switch to horizontal layout
|
||||
about-addressbook-vertical-layout =
|
||||
.label = Switch to vertical layout
|
||||
about-addressbook-table-layout =
|
||||
.label = Table layout
|
||||
|
||||
## Card column headers
|
||||
## Each string is listed here twice, and the values should match.
|
||||
|
|
|
|||
|
|
@ -54,7 +54,6 @@ body > div {
|
|||
section {
|
||||
padding-block: 0.5em;
|
||||
line-height: 1.2;
|
||||
box-shadow: var(--address-book-blocks-box-shadow);
|
||||
box-sizing: border-box;
|
||||
break-inside: avoid-column;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,9 +9,7 @@
|
|||
:root {
|
||||
appearance: none;
|
||||
font: message-box;
|
||||
background-color: var(--in-content-page-background);
|
||||
color: var(--in-content-page-color);
|
||||
--address-book-blocks-box-shadow: 0 6px 6px -5px var(--in-content-button-background);
|
||||
background-color: var(--color-white);
|
||||
|
||||
--address-book-book-label-color: var(--color-white);
|
||||
--address-book-book-label-background: var(--color-gray-50);
|
||||
|
|
@ -19,8 +17,6 @@
|
|||
|
||||
--ab-card-line-height: 1.3em;
|
||||
--ab-card-table-row-height: 22px;
|
||||
|
||||
--counter-bg-color: var(--color-gray-20)
|
||||
}
|
||||
|
||||
:root[uidensity="compact"] {
|
||||
|
|
@ -35,21 +31,47 @@
|
|||
|
||||
@media (prefers-contrast) {
|
||||
:root {
|
||||
--address-book-blocks-box-shadow: none;
|
||||
--in-content-categories-background: transparent;
|
||||
background-color: transparent;
|
||||
color: currentColor;
|
||||
|
||||
--address-book-books-list-bg: transparent;
|
||||
--address-book-cards-list-bg: transparent;
|
||||
|
||||
--address-book-icons-color: currentColor;
|
||||
|
||||
--address-book-section-border-color: currentColor;
|
||||
--address-book-section-bg: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
@media not (prefers-contrast) {
|
||||
:root {
|
||||
color: var(--color-gray-80);
|
||||
|
||||
--address-book-books-list-bg: var(--color-gray-10);
|
||||
--address-book-cards-list-bg: var(--color-gray-05);
|
||||
|
||||
--address-book-icons-color: var(--color-ink-80);
|
||||
|
||||
--in-content-button-background-active: var(--grey-90-a30);
|
||||
--in-content-categories-background: #ebebef;
|
||||
--in-content-item-selected-unfocused: var(--grey-20);
|
||||
--splitter-color: var(--in-content-border-color);
|
||||
|
||||
--address-book-section-border-color: var(--color-gray-30);
|
||||
--address-book-section-bg: var(--color-gray-05);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
background: var(--color-gray-90);
|
||||
color: var(--color-gray-05);
|
||||
|
||||
--address-book-books-list-bg: var(--color-gray-80);
|
||||
--address-book-cards-list-bg: var(--color-gray-80);
|
||||
|
||||
--address-book-icons-color: var(--color-gray-30);
|
||||
|
||||
--in-content-categories-background: rgba(249, 249, 250, 0.1);
|
||||
--in-content-item-selected-unfocused: rgba(249, 249, 250, 0.05);
|
||||
--in-content-button-background-active: rgba(249, 249, 250, 0.2);
|
||||
|
|
@ -58,11 +80,11 @@
|
|||
--in-content-primary-button-background-active: #85e1ff;
|
||||
--in-content-focus-outline-color: #45a1ff;
|
||||
|
||||
--address-book-blocks-box-shadow: none;
|
||||
--address-book-book-label-color: var(--color-white);
|
||||
--address-book-book-label-background: var(--color-gray-50);
|
||||
|
||||
--counter-bg-color: var(--color-gray-80);
|
||||
--address-book-section-border-color: transparent;
|
||||
--address-book-section-bg: var(--color-gray-80);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -146,8 +168,7 @@ body.layout-table {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
color: var(--in-content-page-color);
|
||||
background-color: var(--in-content-categories-background);
|
||||
background-color: var(--address-book-books-list-bg);
|
||||
}
|
||||
|
||||
#booksSplitter {
|
||||
|
|
@ -183,26 +204,33 @@ body.layout-table {
|
|||
align-items: center;
|
||||
margin-inline: 6px;
|
||||
border-radius: var(--in-content-button-border-radius);
|
||||
color: var(--listbox-color);
|
||||
-moz-context-properties: fill, stroke;
|
||||
fill: color-mix(in srgb, currentColor 20%, transparent);
|
||||
stroke: currentColor;
|
||||
fill: color-mix(in srgb, var(--address-book-icons-color) 20%, transparent);
|
||||
stroke: var(--address-book-icons-color);
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.bookRow.selected > .bookRow-container,
|
||||
.listRow.selected > .listRow-container {
|
||||
background-color: var(--in-content-button-background);
|
||||
#books:not(:focus) :where(.bookRow, .listRow).selected > :is(.bookRow-container, .listRow-container) {
|
||||
background-color: var(--listbox-selected-bg);
|
||||
outline: var(--listbox-selected-outline);
|
||||
outline-offset: -2px;
|
||||
}
|
||||
|
||||
.bookRow > .bookRow-container:hover,
|
||||
.listRow > .listRow-container:hover {
|
||||
background-color: var(--in-content-item-hover);
|
||||
background-color: var(--listbox-hover);
|
||||
}
|
||||
|
||||
#books:focus .bookRow.selected > .bookRow-container,
|
||||
#books:focus .listRow.selected > .listRow-container {
|
||||
background-color: var(--in-content-item-selected);
|
||||
color: var(--in-content-item-selected-text);
|
||||
#books:focus :where(.bookRow, .listRow).selected > :is(.bookRow-container, .listRow-container) {
|
||||
background-color: var(--listbox-focused-selected-bg);
|
||||
color: var(--listbox-selected-color);
|
||||
fill: color-mix(in srgb, currentColor 20%, transparent);
|
||||
stroke: currentColor;
|
||||
}
|
||||
|
||||
#books:focus .selected .twisty {
|
||||
stroke: currentColor;
|
||||
}
|
||||
|
||||
.bookRow.drop-target > .bookRow-container,
|
||||
|
|
@ -216,7 +244,7 @@ body.layout-table {
|
|||
width: 26px;
|
||||
height: 26px;
|
||||
-moz-context-properties: stroke;
|
||||
stroke: currentColor;
|
||||
stroke: var(--address-book-icons-color);
|
||||
}
|
||||
|
||||
.bookRow:not(.children) .twisty-icon {
|
||||
|
|
@ -338,8 +366,7 @@ body.layout-table {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: hidden;
|
||||
color: var(--in-content-page-color);
|
||||
background-color: var(--in-content-box-background);
|
||||
background-color: var(--address-book-cards-list-bg);
|
||||
}
|
||||
|
||||
#cardsPaneHeader {
|
||||
|
|
@ -363,11 +390,11 @@ body.layout-table {
|
|||
|
||||
#searchInput:focus {
|
||||
border-color: transparent;
|
||||
outline: 2px solid var(--in-content-focus-outline-color);
|
||||
outline: 2px solid var(--color-blue-60);
|
||||
outline-offset: -1px;
|
||||
}
|
||||
|
||||
#sortButton {
|
||||
#displayButton {
|
||||
display: inline-flex;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
|
|
@ -379,12 +406,8 @@ body.layout-table {
|
|||
stroke: currentColor;
|
||||
}
|
||||
|
||||
#sortButton dropmarker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body:not(.layout-table) ~ menupopup#sortContext > :is(menuitem[name="toggle"], #sortContextListLayout),
|
||||
body.layout-table ~ menupopup#sortContext > :is(menuitem[name="sort"], #sortContextTableLayout) {
|
||||
body:not(.layout-table) ~ menupopup#sortContext > menuitem[name="toggle"],
|
||||
body.layout-table ~ menupopup#sortContext > menuitem[name="sort"] {
|
||||
/* Hide table items in list view, and list items in table view. */
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -396,7 +419,7 @@ body.layout-table ~ menupopup#sortContext > :is(menuitem[name="sort"], #sortCont
|
|||
font-weight: initial;
|
||||
}
|
||||
|
||||
body:not(.layout-table).all-ab-selected ~ menupopup#sortContext > :is(menuitem[value="addrbook"], #sortContextTableLayout) {
|
||||
body:not(.layout-table).all-ab-selected ~ menupopup#sortContext > menuitem[value="addrbook"] {
|
||||
/* Show address book toggle in the list view if All Address Book is
|
||||
selected. */
|
||||
display: initial;
|
||||
|
|
@ -474,11 +497,6 @@ ab-card-listrow {
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
ab-card-listrow:hover,
|
||||
ab-table-card-listrow:hover {
|
||||
background-color: var(--in-content-item-hover);
|
||||
}
|
||||
|
||||
.selected-card {
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
|
|
@ -671,8 +689,6 @@ body:not(.layout-table) #sharedSplitter {
|
|||
|
||||
#detailsPane {
|
||||
grid-area: details;
|
||||
color: var(--in-content-page-color);
|
||||
background-color: var(--in-content-categories-background);
|
||||
min-height: var(--address-book-card-min-height);
|
||||
}
|
||||
|
||||
|
|
@ -754,9 +770,8 @@ body:not(.is-editing) #editContactForm {
|
|||
object-fit: cover;
|
||||
object-position: center;
|
||||
background-color: var(--in-content-button-background);
|
||||
box-shadow: var(--address-book-blocks-box-shadow);
|
||||
-moz-context-properties: stroke;
|
||||
stroke: var(--in-content-box-background);
|
||||
stroke: color-mix(in srgb, transparent 50%, var(--recipient-avatar-color));
|
||||
}
|
||||
|
||||
#photoButton {
|
||||
|
|
@ -847,13 +862,11 @@ body:not(.is-editing) #editContactForm {
|
|||
|
||||
#detailsBody section {
|
||||
padding: 15px;
|
||||
border-radius: 3px;
|
||||
background-color: var(--in-content-page-background);
|
||||
color: var(--in-content-page-color);
|
||||
border-radius: var(--in-content-button-border-radius);
|
||||
border: 1px solid var(--address-book-section-border-color);
|
||||
background-color: var(--address-book-section-bg);
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.2;
|
||||
box-shadow: var(--address-book-blocks-box-shadow);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.button-block:not([hidden]) {
|
||||
|
|
@ -1093,8 +1106,11 @@ input[type="number"]::-moz-number-spin-down {
|
|||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
ab-card-listrow,
|
||||
ab-table-card-listrow {
|
||||
transition: background-color 320ms ease;
|
||||
ab-table-card-listrow,
|
||||
.bookRow-container,
|
||||
.listRow-container,
|
||||
.twisty {
|
||||
transition: color 320ms ease, background-color 320ms ease, fill 320ms ease, stroke 320ms ease;
|
||||
}
|
||||
|
||||
#photoDropTarget.drop-loading .icon {
|
||||
|
|
@ -1183,9 +1199,9 @@ input[type="number"]::-moz-number-spin-down {
|
|||
#cardCount {
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
background-color: var(--counter-bg-color);
|
||||
border-top: 1px solid var(--button-border-color);
|
||||
color: color-mix(in srgb, var(--in-content-page-color) 75%, transparent);
|
||||
background-color: var(--address-book-books-list-bg);
|
||||
border-top: 1px solid var(--splitter-color);
|
||||
color: color-mix(in srgb, currentColor 75%, transparent);
|
||||
padding: 9px;
|
||||
margin-block-start: 6px;
|
||||
font-weight: 500;
|
||||
|
|
|
|||
|
|
@ -23,10 +23,19 @@
|
|||
--recipient-avatar-placeholder-size: 16px;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
@media not (prefers-contrast) {
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--recipient-avatar-color: var(--color-gray-30);
|
||||
--recipient-avatar-background-color: var(--color-gray-60);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-contrast) {
|
||||
:root {
|
||||
--recipient-avatar-color: var(--color-gray-40);
|
||||
--recipient-avatar-background-color: var(--color-gray-60);
|
||||
--recipient-avatar-color: currentColor;
|
||||
--recipient-avatar-background-color: color-mix(in srgb, currentColor 30%, transparent);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,37 @@
|
|||
* 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/. */
|
||||
|
||||
@import url("chrome://messenger/skin/colors.css");
|
||||
|
||||
:root {
|
||||
--listbox-color: var(--color-gray-80);
|
||||
--listbox-selected-bg: var(--color-gray-20);
|
||||
--listbox-focused-selected-bg: var(--color-blue-50);
|
||||
--listbox-selected-color: var(--color-white);
|
||||
--listbox-hover: color-mix(in srgb, transparent 80%, var(--listbox-focused-selected-bg));
|
||||
--listbox-selected-outline: none;
|
||||
}
|
||||
|
||||
@media not (prefers-contrast) {
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--listbox-color: var(--color-gray-05);
|
||||
--listbox-selected-bg: var(--color-gray-70);
|
||||
--listbox-focused-selected-bg: var(--color-blue-60);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-contrast) {
|
||||
:root {
|
||||
--listbox-color: currentColor;
|
||||
--listbox-selected-bg: transparent;
|
||||
--listbox-selected-color: SelectedItemText;
|
||||
--listbox-focused-selected-bg: SelectedItem;
|
||||
--listbox-selected-outline: 2px solid SelectedItem;
|
||||
}
|
||||
}
|
||||
|
||||
tree-view-listbox {
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
|
|
@ -26,22 +57,28 @@ tree-view-listbox > * {
|
|||
cursor: default;
|
||||
}
|
||||
|
||||
tree-view-listbox > *:hover {
|
||||
background-color: var(--listbox-hover);
|
||||
}
|
||||
|
||||
tree-view-listbox > .selected {
|
||||
background-color: var(--in-content-button-background);
|
||||
background-color: var(--listbox-selected-bg);
|
||||
outline: var(--listbox-selected-outline);
|
||||
outline-offset: -2px;
|
||||
}
|
||||
|
||||
tree-view-listbox:focus > .current {
|
||||
outline: 2px dotted var(--in-content-focus-outline-color);
|
||||
outline: 2px dotted var(--listbox-selected-color);
|
||||
outline-offset: -2px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
tree-view-listbox:focus > .selected {
|
||||
color: var(--in-content-item-selected-text);
|
||||
background-color: var(--in-content-item-selected);
|
||||
color: var(--listbox-selected-color);
|
||||
background-color: var(--listbox-focused-selected-bg);
|
||||
}
|
||||
|
||||
tree-view-listbox:focus > .current.selected {
|
||||
outline: 1px dashed var(--in-content-item-selected-text);
|
||||
outline: 1px dashed var(--listbox-selected-color);
|
||||
outline-offset: -1px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -93,7 +93,6 @@
|
|||
:root:not(:-moz-lwtheme) .toolbarbutton-1[checked="true"],
|
||||
:root:not(:-moz-lwtheme) .toolbarbutton-menubutton-button:hover {
|
||||
color: SelectedItemText !important;
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
menulist {
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче