sketch-container-status: fix long branch names
diff --git a/webui/src/web-components/demo/sketch-container-status.demo.ts b/webui/src/web-components/demo/sketch-container-status.demo.ts
index 20d6a47..b57412d 100644
--- a/webui/src/web-components/demo/sketch-container-status.demo.ts
+++ b/webui/src/web-components/demo/sketch-container-status.demo.ts
@@ -52,7 +52,10 @@
     ) as any;
     heavyStatus.id = "heavy-status";
     heavyStatus.state = heavyUsageState;
-
+    heavyStatus.lastCommit = {
+      hash: "deadbeef",
+      pushedBranch: "user/sketch/really-long-branch-name-that-stains-layout",
+    };
     const heavyLabel = document.createElement("h4");
     heavyLabel.textContent = "Heavy Usage";
     heavyLabel.style.cssText = "margin: 20px 0 10px 0; color: #24292f;";
diff --git a/webui/src/web-components/sketch-container-status.ts b/webui/src/web-components/sketch-container-status.ts
index 8071783..09fe41e 100644
--- a/webui/src/web-components/sketch-container-status.ts
+++ b/webui/src/web-components/sketch-container-status.ts
@@ -351,7 +351,7 @@
       <div class="flex items-center relative">
         <!-- Main visible info in two columns - github/hostname/dir and last commit -->
         <div class="flex flex-wrap gap-2 px-2.5 py-1 flex-1">
-          <div class="grid grid-cols-2 gap-2.5 w-full">
+          <div class="flex gap-2.5 w-full">
             <!-- First column: GitHub repo (or hostname) and working dir -->
             <div class="flex flex-col gap-0.5">
               <div class="flex items-center whitespace-nowrap mr-2.5 text-xs">