From e199f35006f0dd0b1046c747bdf424668cbfce9d Mon Sep 17 00:00:00 2001
From: Abe Jellinek <jellinek@berkeley.edu>
Date: Thu, 6 Jul 2023 14:25:03 -0400
Subject: [PATCH] Fix _getColorIcon(), update stroke color, use for selected
 menuitems

- Need to set width/height for macOS native menu
- CSS named grays are too light to show well on the background, so use #555
- type="checkbox" menuitems don't show their icons, so use the icon stroke
  instead
---
 chrome/content/zotero/xpcom/reader.js | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/chrome/content/zotero/xpcom/reader.js b/chrome/content/zotero/xpcom/reader.js
index 4d27b2b613..4f298bbc2b 100644
--- a/chrome/content/zotero/xpcom/reader.js
+++ b/chrome/content/zotero/xpcom/reader.js
@@ -795,9 +795,9 @@ class ReaderInstance {
 	}
 
 	_getColorIcon(color, selected) {
-		let stroke = selected ? 'lightgray' : 'transparent';
+		let stroke = selected ? '%23555' : 'transparent';
 		let fill = '%23' + color.slice(1);
-		return `data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><rect shape-rendering="geometricPrecision" fill="${fill}" stroke-width="2" x="2" y="2" stroke="${stroke}" width="12" height="12" rx="3"/></svg>`;
+		return `data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><rect shape-rendering="geometricPrecision" fill="${fill}" stroke-width="2" x="2" y="2" stroke="${stroke}" width="12" height="12" rx="3"/></svg>`;
 	}
 
 	_openTagsPopup(item, x, y) {
@@ -847,13 +847,13 @@ class ReaderInstance {
 						let menuitem = parentNode.ownerDocument.createXULElement('menuitem');
 						menuitem.setAttribute('label', item.label);
 						menuitem.setAttribute('disabled', item.disabled);
-						if (item.checked) {
-							menuitem.setAttribute('type', 'checkbox');
-							menuitem.setAttribute('checked', item.checked);
-						}
 						if (item.color) {
 							menuitem.className = 'menuitem-iconic';
-							menuitem.setAttribute('image', this._getColorIcon(item.color));
+							menuitem.setAttribute('image', this._getColorIcon(item.color, item.checked));
+						}
+						else if (item.checked) {
+							menuitem.setAttribute('type', 'checkbox');
+							menuitem.setAttribute('checked', item.checked);
 						}
 						menuitem.addEventListener('command', () => item.onCommand());
 						parentNode.appendChild(menuitem);