Fixes #505 by making popup vertically aligned when appearing in Firefox panel menu

platform/firefox/css/popup-vertical.css

@@ -0,0 +1,23 @@
+/* Overrides to popup.css for display in a vertical panel, such as the firefox panel menu */
+body {
+	width: 100%;
+}
+
+#panes > div {
+	display: block;
+}
+
+#panes > #dfPane {
+	width: 100%;
+	border-right: none;
+}
+
+body[dir="ltr"] #panes > #dfPane {
+	direction: ltr; /* reset scroll bar to the right */
+	margin-right: 0;
+}
+
+body[dir="rtl"] #panes > #dfPane {
+	direction: rtl; /* reset scroll bar to the left */
+	margin-left: 0;
+}

platform/firefox/vapi-background.js

@@ -1470,6 +1470,8 @@ vAPI.toolbarButton.init = function() {
         return;
     }
 
+    this.CustomizableUI = CustomizableUI;
+
     this.defaultArea = CustomizableUI.AREA_NAVBAR;
     this.styleURI = [
         '#' + this.id + '.off {',
@@ -1482,7 +1484,7 @@ vAPI.toolbarButton.init = function() {
                 vAPI.getURL('img/browsericons/icon16.svg'),
             ');',
         '}',
-        '#' + this.viewId + ', #' + this.viewId + ' > iframe {',
+        '#' + this.viewId + ' {',
             'width: 160px;',
             'height: 290px;',
             'overflow: hidden !important;',
@@ -1639,6 +1641,9 @@ vAPI.toolbarButton.onBeforeCreated = function(doc) {
             delayedResize();
         }
     };
+
+    var CustomizableUI = this.CustomizableUI;
+    var widgetId = this.id;
     var onPopupReady = function() {
         var win = this.contentWindow;
 
@@ -1646,6 +1651,13 @@ vAPI.toolbarButton.onBeforeCreated = function(doc) {
             return;
         }
 
+        var placement = CustomizableUI.getPlacementOfWidget(widgetId);
+        if (placement.area === CustomizableUI.AREA_PANEL) {
+            // Add some overrides for displaying the popup correctly in a panel
+            win.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowUtils)
+                .loadSheet(Services.io.newURI(vAPI.getURL("css/popup-vertical.css"), null, null), Ci.nsIDOMWindowUtils.AUTHOR_SHEET);
+        }
+
         new win.MutationObserver(delayedResize).observe(win.document.body, {
             attributes: true,
             characterData: true,

tools/make-firefox.sh

@@ -21,6 +21,7 @@ cp platform/firefox/vapi-*.js $DES/js/
 cp platform/firefox/bootstrap.js $DES/
 cp platform/firefox/frame*.js $DES/
 cp -R platform/firefox/img $DES/
+cp -R platform/firefox/css $DES/
 cp platform/firefox/chrome.manifest $DES/
 cp platform/firefox/install.rdf $DES/
 cp platform/firefox/*.xul $DES/