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

chrome/content/zotero/elements/guidancePanel.js

@@ -29,21 +29,23 @@
 	class GuidancePanel extends XULElementBase {
 		content = MozXULElement.parseXULToFragment(`
 			<panel type="arrow" align="top">
-				<stack>
+				<html:div class="panel-container">
-					<hbox align="center">
+					<html:div class="panel-text"></html:div>
-						<image src="chrome://zotero/skin/zotero-new-z-48px.png" style="margin-right: 10px; width: 48px; height: 48px;"></image>
+				</html:div>
-						<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>
 			</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);

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._showCreatorTypeGuidance = true;
-					this._id("zotero-author-guidance").show({
-						forEl: creatorTypeLabels[creatorTypeLabels.length - 1]
-					});
 				}
 			}
 			

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"?>

scss/elements/_guidancePanel.scss

@@ -1,14 +1,12 @@
 guidance-panel {
-	panel {
+	.panel-container {
-		min-width: none;
-	}
-
-	stack {
 		width: 400px;
-		margin: 0;
+		display: flex;
-		padding: 0;
+		align-items: center;
+		font-size: 1.1em;
+		padding: 8px 0;
 	}
-
+	
 	#nav-buttons {
 		-moz-box-align: end;
 		-moz-box-pack: end;