From c74b8e014ecb86798f730d15d800dcb237f6dcab Mon Sep 17 00:00:00 2001
From: Brandon Oxendine <brandon.oxendine@gmail.com>
Date: Tue, 14 Apr 2026 08:30:11 +0200
Subject: [PATCH] Truncate repo header text

---
 src/components/CheckoutRepoButton.svelte |  3 ++-
 src/components/RepoHeader.svelte         | 11 +++++++++--
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/CheckoutRepoButton.svelte b/src/components/CheckoutRepoButton.svelte
index e5089dbd8..97b606057 100644
--- a/src/components/CheckoutRepoButton.svelte
+++ b/src/components/CheckoutRepoButton.svelte
@@ -20,7 +20,8 @@
       variant="secondary"
       {onclick}
       active={popoverExpanded}>
-      <Icon name="checkout" />Checkout repo
+      <Icon name="checkout" />
+      <span class="global-hide-on-medium-desktop-down">Checkout repo</span>
     </Button>
   {/snippet}
 
diff --git a/src/components/RepoHeader.svelte b/src/components/RepoHeader.svelte
index c4e9462a8..8fbe53c9a 100644
--- a/src/components/RepoHeader.svelte
+++ b/src/components/RepoHeader.svelte
@@ -45,6 +45,10 @@
     border-bottom: 1px solid var(--color-border-subtle);
     flex-shrink: 0;
   }
+  .project {
+    flex: 1;
+    min-width: 0;
+  }
   .name {
     font: var(--txt-body-l-semibold);
     color: var(--color-text-primary);
@@ -58,6 +62,7 @@
     align-items: center;
     gap: 1rem;
     margin-left: auto;
+    flex-shrink: 0;
   }
   .meta-item {
     display: flex;
@@ -86,6 +91,7 @@
     display: flex;
     align-items: center;
     gap: 0.5rem;
+    flex-shrink: 0;
   }
   a {
     color: inherit;
@@ -101,7 +107,7 @@
 </style>
 
 <div class="header">
-  <div class="txt-selectable">
+  <div class="project txt-selectable">
     <div class="name txt-overflow">{project.data.name}</div>
     {#if project.data.description}
       <div class="description txt-overflow">{project.data.description}</div>
@@ -162,7 +168,8 @@
 
   <div class="actions">
     <Button variant="ghost" styleHeight="2rem" onclick={copyLink}>
-      <Icon name={copyIcon} />Copy Link
+      <Icon name={copyIcon} />
+      <span class="global-hide-on-medium-desktop-down">Copy Link</span>
     </Button>
     <CheckoutRepoButton rid={repo.rid} />
   </div>