From d9b16c15f778486f0eabfffff249151992d2ab1c Mon Sep 17 00:00:00 2001
From: Abe Jellinek <jellinek@berkeley.edu>
Date: Fri, 24 Mar 2023 16:42:52 -0400
Subject: [PATCH] fx-compat: <split-menu-button>: Use margin instead of
 absolute height

And add space to the right of the button text. Should look right on Linux now.

Fixes #3041
---
 chrome/content/zotero/elements/splitMenuButton.js | 3 +++
 chrome/skin/default/zotero/overlay.css            | 8 +++-----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/chrome/content/zotero/elements/splitMenuButton.js b/chrome/content/zotero/elements/splitMenuButton.js
index 08f2280492..da8e1e00cc 100644
--- a/chrome/content/zotero/elements/splitMenuButton.js
+++ b/chrome/content/zotero/elements/splitMenuButton.js
@@ -71,6 +71,9 @@
 			let hiDPISuffix = window.devicePixelRatio > 1 ? '@2x' : '';
 			let frag = document.importNode(
 				MozXULElement.parseXULToFragment(`
+					<vbox>
+						<box anonid="dropmarker-separator"/>
+					</vbox>
 					<hbox align="center" anonid="dropmarker-box">
 						<image src="chrome://zotero/skin/searchbar-dropmarker${hiDPISuffix}.png" width="7" height="4" class="split-menu-button-dropmarker"/>
 					</hbox>
diff --git a/chrome/skin/default/zotero/overlay.css b/chrome/skin/default/zotero/overlay.css
index eca11b937f..ab5469a84e 100644
--- a/chrome/skin/default/zotero/overlay.css
+++ b/chrome/skin/default/zotero/overlay.css
@@ -721,12 +721,10 @@
 	overflow: hidden;
 }
 
-.split-menu-button [anonid="dropmarker-box"]::before {
-	content: '';
-	display: inline-block;
-	height: 12px;
+.split-menu-button [anonid="dropmarker-separator"] {
+	-moz-box-flex: 1;
 	border-inline-start: 1px solid #aaa;
-	margin-inline-end: 2px;
+	margin: 5px 2px 5px 4px;
 }
 
 .split-menu-button .split-menu-button-dropmarker {