From 73b3442e969000a7b37e63fbd91cf84ff8111925 Mon Sep 17 00:00:00 2001
From: Jason Zimdars <jz@37signals.com>
Date: Mon, 16 Jun 2025 19:53:55 -0500
Subject: [PATCH] Make cards resilient to long collection names

---
 app/views/cards/display/_preview.html.erb     | 32 +++++++++----------
 app/views/cards/display/perma/_tags.html.erb  |  2 +-
 .../cards/display/preview/_tags.html.erb      |  2 +-
 3 files changed, 17 insertions(+), 19 deletions(-)

diff --git a/app/views/cards/display/_preview.html.erb b/app/views/cards/display/_preview.html.erb
index e7b8a61ec..fa3145508 100644
--- a/app/views/cards/display/_preview.html.erb
+++ b/app/views/cards/display/_preview.html.erb
@@ -2,27 +2,25 @@
 
 <% cache cacheable_preview_parts_for(card, draggable) do %>
   <%= card_article_tag card, class: "card", draggable: draggable, data: { id: card.id, drag_and_drop_target: "item" } do %>
-    <div class="flex gap">
-      <div class="flex flex-column flex-item-grow max-inline-size">
-        <header class="card__header">
-          <%= render "cards/display/preview/collection", card: card %>
-          <%= render "cards/display/preview/tags", card: card %>
-        </header>
+    <div class="flex flex-column flex-item-grow max-inline-size">
+      <header class="card__header">
+        <%= render "cards/display/preview/collection", card: card %>
+        <%= render "cards/display/preview/tags", card: card %>
+      </header>
 
-        <div class="card__body justify-space-between">
-          <div class="card__content">
-            <h1 class="card__title overflow-line-clamp">
-              <%= card.title %>
-            </h1>
+      <div class="card__body justify-space-between">
+        <div class="card__content">
+          <h1 class="card__title overflow-line-clamp">
+            <%= card.title %>
+          </h1>
 
-            <%= link_to collection_card_path(card.collection, card), draggable: false, class: "card__link", title: card_title_tag(card), data: { action: "dialog#close", turbo_frame: "_top" } do %>
-              <span class="for-screen-reader"><%= card.title %></span>
-            <% end %>
-          </div>
+          <%= link_to collection_card_path(card.collection, card), draggable: false, class: "card__link", title: card_title_tag(card), data: { action: "dialog#close", turbo_frame: "_top" } do %>
+            <span class="for-screen-reader"><%= card.title %></span>
+          <% end %>
         </div>
-      </div>
 
-      <%= render "cards/stagings/stages", card: card if card.doing? %>
+        <%= render "cards/stagings/stages", card: card if card.doing? %>
+      </div>
     </div>
 
     <footer class="card__footer">
diff --git a/app/views/cards/display/perma/_tags.html.erb b/app/views/cards/display/perma/_tags.html.erb
index ff6c97b8e..637b55097 100644
--- a/app/views/cards/display/perma/_tags.html.erb
+++ b/app/views/cards/display/perma/_tags.html.erb
@@ -1,4 +1,4 @@
-<div id="<%= dom_id(card, :tags) %>" class="card__tags flex-item-grow min-width gap-half">
+<div id="<%= dom_id(card, :tags) %>" class="card__tags flex-item-grow flex-item-no-shrink min-width gap-half">
   <div class="overflow-ellipsis">
     <% if card.tags.any? || card.creating? %>
       <span class="margin-inline-start-half"># </span>
diff --git a/app/views/cards/display/preview/_tags.html.erb b/app/views/cards/display/preview/_tags.html.erb
index 35f7c41dc..6c802a331 100644
--- a/app/views/cards/display/preview/_tags.html.erb
+++ b/app/views/cards/display/preview/_tags.html.erb
@@ -1,4 +1,4 @@
-<div class="card__tags flex-item-grow min-width">
+<div class="card__tags flex-item-grow flex-item-no-shrink min-width">
   <div class="overflow-ellipsis">
     <% if card.tags.any?  %>
       <span># </span>