From f9d0641d77b40b867a7ccd90754c3495f0c5536a Mon Sep 17 00:00:00 2001
From: Julien Froidefond <julien.froidefond@cdbdx.biz>
Date: Mon, 22 Sep 2025 08:49:47 +0200
Subject: [PATCH] fix: improve text truncation in EditCheckboxModal - Added
 `min-w-0` to the title container to prevent overflow in the
 `EditCheckboxModal`. - Updated task title and description elements to use
 `truncate` for better text handling and prevent layout issues.

---
 src/components/daily/EditCheckboxModal.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/daily/EditCheckboxModal.tsx b/src/components/daily/EditCheckboxModal.tsx
index b3421ac..7817111 100644
--- a/src/components/daily/EditCheckboxModal.tsx
+++ b/src/components/daily/EditCheckboxModal.tsx
@@ -161,8 +161,8 @@ export function EditCheckboxModal({
               // Tâche déjà sélectionnée
               <div className="border border-[var(--border)] rounded-lg p-3 bg-[var(--muted)]/30">
                 <div className="flex items-center justify-between">
-                  <div className="flex-1">
-                    <div className="font-medium text-sm">{selectedTask.title}</div>
+                  <div className="flex-1 min-w-0">
+                    <div className="font-medium text-sm truncate">{selectedTask.title}</div>
                     {selectedTask.description && (
                       <div className="text-xs text-[var(--muted-foreground)] truncate">
                         {selectedTask.description}
@@ -219,9 +219,9 @@ export function EditCheckboxModal({
                           className="w-full text-left p-3 hover:bg-[var(--muted)]/50 transition-colors border-b border-[var(--border)]/30 last:border-b-0"
                           disabled={saving}
                         >
-                          <div className="font-medium text-sm">{task.title}</div>
+                          <div className="font-medium text-sm truncate">{task.title}</div>
                           {task.description && (
-                            <div className="text-xs text-[var(--muted-foreground)] truncate mt-1">
+                            <div className="text-xs text-[var(--muted-foreground)] truncate mt-1 max-w-full overflow-hidden">
                               {task.description}
                             </div>
                           )}