Fix a couple of issues related to dark mode icons (#4655)

- Fixed missing dark mode icons in the advanced search dialog.
- Corrected inconsistent icon shading in some menus.

chrome/content/zotero/customElements.js

@@ -206,10 +206,16 @@ Services.scriptloader.loadSubScript('chrome://zotero/content/elements/itemPaneSe
 		};
 	}
 
-	// inject custom CSS into FF built-in custom elements (currently only <wizard>)
+	// The menulist CE is defined lazily. Create one now to get menulist defined, so we can patch it
+	if (!customElements.get("menulist")) {
+		delete document.createXULElement("menulist");
+	}
+
+	// inject custom CSS into FF built-in custom elements
 	const InjectCSSConfig = {
 		global: [
 			"wizard",
+			"menulist",
 			{
 				element: "dialog",
 				patchedFunction: "connectedCallback"

chrome/content/zotero/newCollectionDialog.js

@@ -54,13 +54,6 @@ var Zotero_New_Collection_Dialog = {
 		menupopup.replaceWith(menupopup = document.createXULElement('menupopup'));
 		menupopup.id = id;
 
-		let style = document.createElement('style');
-		style.innerHTML = `image {
-			-moz-context-properties: fill, fill-opacity;
-			fill: var(--fill-secondary);
-		 }`;
-		createInField.shadowRoot.appendChild(style);
-
 		let createdNode = Zotero.Utilities.Internal.createMenuForTarget(
 			Zotero.Libraries.get(this._libraryID),
 			menupopup,

scss/components/_menu.scss

@@ -81,9 +81,11 @@ $menu-icons: (
 	@include macOS-hide-menu-icons;
 }
 
-#zotero-new-collection-menu {
-	image {
-		-moz-context-properties: fill, fill-opacity;
+menupopup image {
+	-moz-context-properties: fill, fill-opacity;
+	fill: var(--fill-secondary);
+	
+	@media (-moz-platform: macos) {
 		fill: currentColor;
 	}
 }

scss/xulElementPatches/menulist.scss

@@ -0,0 +1,8 @@
+image {
+    -moz-context-properties: fill, fill-opacity;
+    fill: var(--fill-secondary);
+    
+    @media (-moz-platform: macos) {
+        fill: currentColor;
+    }
+}