From 4a8935eefd1acb76a9363982369cedf43af15dfb Mon Sep 17 00:00:00 2001
From: Dan Stillman <dstillman@zotero.org>
Date: Fri, 7 Jul 2023 07:03:31 -0400
Subject: [PATCH] Guidance panel fixes

- Fix missing styling in Quick Format dialog
- Fix Book Section panel being immediately hidden
- Remove low-res Zotero icon
- Increase font size and tweak padding
---
 .../content/zotero/elements/guidancePanel.js  | 30 ++++++++++---------
 chrome/content/zotero/elements/itemBox.js     | 13 +++++---
 .../zotero/integration/quickFormat.xhtml      |  1 +
 scss/elements/_guidancePanel.scss             | 14 ++++-----
 4 files changed, 32 insertions(+), 26 deletions(-)

diff --git a/chrome/content/zotero/elements/guidancePanel.js b/chrome/content/zotero/elements/guidancePanel.js
index 4d1cde88c1..a290b28ab1 100644
--- a/chrome/content/zotero/elements/guidancePanel.js
+++ b/chrome/content/zotero/elements/guidancePanel.js
@@ -29,21 +29,23 @@
 	class GuidancePanel extends XULElementBase {
 		content = MozXULElement.parseXULToFragment(`
 			<panel type="arrow" align="top">
-				<stack>
-					<hbox align="center">
-						<image src="chrome://zotero/skin/zotero-new-z-48px.png" style="margin-right: 10px; width: 48px; height: 48px;"></image>
-						<label id="panel-description" flex="1"></label>
-					</hbox>
-					<hbox id="close-button-box">
-						<toolbarbutton id="close-button" class="close-icon" hidden="true"></toolbarbutton>
-					</hbox>
-					<hbox id="nav-buttons">
-						<toolbarbutton id="back-button" hidden="true"></toolbarbutton>
-						<toolbarbutton id="forward-button" hidden="true"></toolbarbutton>
-					</hbox>
-				</stack>
+				<html:div class="panel-container">
+					<html:div class="panel-text"></html:div>
+				</html:div>
 			</panel>
 		`);
+		
+		/*
+			Unused:
+			
+			<hbox id="close-button-box">
+				<toolbarbutton id="close-button" class="close-icon" hidden="true"></toolbarbutton>
+			</hbox>
+			<hbox id="nav-buttons">
+				<toolbarbutton id="back-button" hidden="true"></toolbarbutton>
+				<toolbarbutton id="forward-button" hidden="true"></toolbarbutton>
+			</hbox>
+		*/
 
 		get panel() {
 			return this.querySelector('panel');
@@ -113,7 +115,7 @@
 					text = Zotero.getString("firstRunGuidance." + about);
 				}
 				text = text.split("\n");
-				var descriptionNode = this.id('panel-description');
+				var descriptionNode = document.querySelector('.panel-text');
 				
 				while (descriptionNode.hasChildNodes()) {
 					descriptionNode.removeChild(descriptionNode.firstChild);
diff --git a/chrome/content/zotero/elements/itemBox.js b/chrome/content/zotero/elements/itemBox.js
index 46ae8b376f..5349e210d3 100644
--- a/chrome/content/zotero/elements/itemBox.js
+++ b/chrome/content/zotero/elements/itemBox.js
@@ -778,6 +778,14 @@
 				this._focusNextField(this._lastTabIndex);
 			}
 			
+			if (this._showCreatorTypeGuidance) {
+				let creatorTypeLabels = this.querySelectorAll(".creator-type-label");
+				this._id("zotero-author-guidance").show({
+					forEl: creatorTypeLabels[creatorTypeLabels.length - 1]
+				});
+				this._showCreatorTypeGuidance = false;
+			}
+			
 			this._refreshed = true;
 		}
 		
@@ -1985,10 +1993,7 @@
 				newVal = val;
 				
 				if (Zotero.ItemTypes.getName(this.item.itemTypeID) === "bookSection") {
-					var creatorTypeLabels = this.querySelectorAll(".creator-type-label");
-					this._id("zotero-author-guidance").show({
-						forEl: creatorTypeLabels[creatorTypeLabels.length - 1]
-					});
+					this._showCreatorTypeGuidance = true;
 				}
 			}
 			
diff --git a/chrome/content/zotero/integration/quickFormat.xhtml b/chrome/content/zotero/integration/quickFormat.xhtml
index 13b82d364c..99d07ad4d4 100644
--- a/chrome/content/zotero/integration/quickFormat.xhtml
+++ b/chrome/content/zotero/integration/quickFormat.xhtml
@@ -26,6 +26,7 @@
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
 <?xml-stylesheet href="chrome://global/skin/browser.css" type="text/css"?>
 <?xml-stylesheet href="chrome://zotero/skin/zotero.css" type="text/css"?>
+<?xml-stylesheet href="chrome://zotero-platform/content/zotero.css"?>
 <?xml-stylesheet href="chrome://zotero/skin/integration.css" type="text/css"?>
 <?xml-stylesheet href="chrome://zotero-platform/content/integration.css" type="text/css"?>
 <?xml-stylesheet href="chrome://zotero-platform-version/content/style.css" type="text/css"?>
diff --git a/scss/elements/_guidancePanel.scss b/scss/elements/_guidancePanel.scss
index 1a73fdc050..cb0416f7d5 100644
--- a/scss/elements/_guidancePanel.scss
+++ b/scss/elements/_guidancePanel.scss
@@ -1,14 +1,12 @@
 guidance-panel {
-	panel {
-		min-width: none;
-	}
-
-	stack {
+	.panel-container {
 		width: 400px;
-		margin: 0;
-		padding: 0;
+		display: flex;
+		align-items: center;
+		font-size: 1.1em;
+		padding: 8px 0;
 	}
-
+	
 	#nav-buttons {
 		-moz-box-align: end;
 		-moz-box-pack: end;