From a5b3802ca3fcb95331fb56f3532c2b28b293b7ca Mon Sep 17 00:00:00 2001
From: David Hill <1879069+iamdavidhill@users.noreply.github.com>
Date: Thu, 17 Sep 2026 00:48:47 -0600
Subject: [PATCH] fix(app): keep compact tab icons visible (#49460)

---
 packages/app/src/shell/titlebar/tab-nav.css | 35 +++++++++++++++------
 1 file changed, 25 insertions(+), 10 deletions(-)

diff --git a/packages/app/src/shell/titlebar/tab-nav.css b/packages/app/src/shell/titlebar/tab-nav.css
index 1cea5e4e871..78ad4508004 100644
--- a/packages/app/src/shell/titlebar/tab-nav.css
+++ b/packages/app/src/shell/titlebar/tab-nav.css
@@ -218,22 +218,30 @@
   }
 }
 
-@container (max-width: 64px) {
+@container (44px < width <= 64px) {
+  [data-titlebar-tab]:not([data-orientation="vertical"]):not([data-editing="true"]):is(:hover, [data-active="true"])
+    [data-slot="tab-link"] {
+    -webkit-mask-image: none;
+    mask-image: none;
+  }
+
+  [data-titlebar-tab]:not([data-orientation="vertical"]):not([data-editing="true"]):is(:hover, [data-active="true"])
+    [data-titlebar-tab-title] {
+    visibility: hidden;
+  }
+}
+
+@container (max-width: 44px) {
   [data-titlebar-tab]:not([data-orientation="vertical"]) [data-titlebar-tab-link] {
     justify-content: center;
     gap: 0;
     padding-inline: 0;
   }
 
-  @media (hover: none) {
-    [data-titlebar-tab]:not([data-orientation="vertical"]):not([data-editing="true"]) [data-slot="tab-link"],
-    [data-titlebar-tab][data-title-overflow="true"]:not([data-orientation="vertical"]):not([data-editing="true"]):dir(
-        rtl
-      )
-      [data-slot="tab-link"] {
-      -webkit-mask-image: none;
-      mask-image: none;
-    }
+  [data-titlebar-tab]:not([data-orientation="vertical"]):not([data-editing="true"]) [data-slot="tab-link"],
+  [data-titlebar-tab]:not([data-orientation="vertical"]):not([data-editing="true"]):dir(rtl) [data-slot="tab-link"] {
+    -webkit-mask-image: none;
+    mask-image: none;
   }
 
   [data-titlebar-tab]:not([data-orientation="vertical"]) [data-titlebar-tab-title] {
@@ -244,6 +252,13 @@
     display: none;
   }
 
+  @media (hover: hover) {
+    [data-titlebar-tab]:not([data-orientation="vertical"]):not(:hover):not(:has(:focus-visible))
+      [data-slot="tab-close"] {
+      display: none;
+    }
+  }
+
   [data-titlebar-tab]:not([data-orientation="vertical"]) [data-slot="tab-close"] {
     right: auto;
     left: 50%;