logo fix 5

banner.js

@@ -120,14 +120,18 @@
   // filename inject-banner.sh replaces for the top-bar logo; keep these two
   // in sync if that ever changes again.
   const LOGO_IMG_MATCH = 'icon-transparent';
-  const LOGO_MAX_SIZE = '2.75em'; // grow the icon now that the text next to it is gone
+  const LOGO_MAX_SIZE = '44px'; // grow the icon now that the text next to it is gone; fixed
+                                 // px instead of em, since em resolves against whatever
+                                 // (possibly tiny/zeroed) font-size the icon wrapper uses
 
   function hideLogoText() {
     const logoImg = document.querySelector('img[src*="' + LOGO_IMG_MATCH + '"]');
     if (!logoImg) return;
 
+    logoImg.style.setProperty('height', LOGO_MAX_SIZE, 'important');
     logoImg.style.setProperty('max-height', LOGO_MAX_SIZE, 'important');
-    logoImg.style.setProperty('max-width', LOGO_MAX_SIZE, 'important');
+    logoImg.style.setProperty('width', 'auto', 'important');
+    logoImg.style.setProperty('max-width', 'none', 'important');
 
     // The image is usually wrapped in its own icon span, so the text label
     // is a sibling of that wrapper, not of the <img> itself. Walk up to the
@@ -135,6 +139,18 @@
     // of the branch containing the image.
     const container = logoImg.closest('button, a, [role="button"]') || logoImg.parentElement;
     if (!container) return;
+
+    // Strip any fixed size/overflow-clipping the icon wrapper itself might
+    // impose (MUI's startIcon span is normally sized for a small icon font),
+    // which would otherwise clip the enlarged image regardless of its own size.
+    const iconWrap = logoImg.parentElement;
+    if (iconWrap && iconWrap !== container) {
+      iconWrap.style.setProperty('overflow', 'visible', 'important');
+      iconWrap.style.setProperty('height', 'auto', 'important');
+      iconWrap.style.setProperty('width', 'auto', 'important');
+      iconWrap.style.setProperty('max-height', 'none', 'important');
+      iconWrap.style.setProperty('max-width', 'none', 'important');
+    }
     Array.prototype.forEach.call(container.childNodes, function (node) {
       if (node === logoImg) return;
       if (node.nodeType === Node.ELEMENT_NODE && node.contains(logoImg)) return;