From 845d12f098895e4c045d7486f88ce8cb907e8746 Mon Sep 17 00:00:00 2001
From: Julien Froidefond <julien.froidefond@cdbdx.biz>
Date: Tue, 16 Sep 2025 08:15:45 +0200
Subject: [PATCH] style: adjust spacing and sizing in DailyCheckboxItem and
 DailySection - Reduced padding and margin in DailyCheckboxItem for a more
 compact layout. - Updated checkbox sizes for consistency and improved visual
 hierarchy. - Adjusted the scrollable area in DailySection to enhance user
 experience.

---
 components/daily/DailyCheckboxItem.tsx | 14 +++++++-------
 components/daily/DailySection.tsx      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/components/daily/DailyCheckboxItem.tsx b/components/daily/DailyCheckboxItem.tsx
index 9b3e236..0eca04c 100644
--- a/components/daily/DailyCheckboxItem.tsx
+++ b/components/daily/DailyCheckboxItem.tsx
@@ -74,7 +74,7 @@ export function DailyCheckboxItem({
 
   return (
     <>
-      <div className={`flex items-center gap-3 p-2 rounded border transition-colors group ${
+      <div className={`flex items-center gap-2 px-3 py-1.5 rounded border transition-colors group ${
         checkbox.type === 'meeting' 
           ? 'border-l-4 border-l-blue-500 border-t-[var(--border)]/30 border-r-[var(--border)]/30 border-b-[var(--border)]/30 hover:border-t-[var(--border)] hover:border-r-[var(--border)] hover:border-b-[var(--border)]'
           : 'border-l-4 border-l-green-500 border-t-[var(--border)]/30 border-r-[var(--border)]/30 border-b-[var(--border)]/30 hover:border-t-[var(--border)] hover:border-r-[var(--border)] hover:border-b-[var(--border)]'
@@ -85,7 +85,7 @@ export function DailyCheckboxItem({
           checked={checkbox.isChecked}
           onChange={() => onToggle(checkbox.id)}
           disabled={saving}
-          className="w-4 h-4 rounded border border-[var(--border)] text-[var(--primary)] focus:ring-[var(--primary)]/20 focus:ring-2"
+          className="w-3.5 h-3.5 rounded border border-[var(--border)] text-[var(--primary)] focus:ring-[var(--primary)]/20 focus:ring-1"
         />
         
         {/* Contenu principal */}
@@ -96,13 +96,13 @@ export function DailyCheckboxItem({
             onKeyDown={handleInlineEditKeyPress}
             onBlur={handleSaveInlineEdit}
             autoFocus
-            className="flex-1 h-8 text-sm"
+            className="flex-1 h-7 text-sm"
           />
         ) : (
           <div className="flex-1 flex items-center gap-2">
             {/* Texte cliquable pour édition inline */}
             <span 
-              className={`flex-1 text-sm font-mono transition-all cursor-pointer hover:bg-[var(--muted)]/50 p-1 rounded ${
+              className={`flex-1 text-xs font-mono transition-all cursor-pointer hover:bg-[var(--muted)]/50 py-0.5 px-1 rounded ${
                 checkbox.isChecked 
                   ? 'line-through text-[var(--muted-foreground)]' 
                   : 'text-[var(--foreground)]'
@@ -117,7 +117,7 @@ export function DailyCheckboxItem({
             <button
               onClick={handleStartAdvancedEdit}
               disabled={saving}
-              className="opacity-0 group-hover:opacity-100 w-6 h-6 rounded-full bg-[var(--muted)]/50 hover:bg-[var(--muted)] border border-[var(--border)]/30 hover:border-[var(--border)] flex items-center justify-center transition-all duration-200 text-[var(--foreground)] text-xs"
+              className="opacity-0 group-hover:opacity-100 w-5 h-5 rounded-full bg-[var(--muted)]/50 hover:bg-[var(--muted)] border border-[var(--border)]/30 hover:border-[var(--border)] flex items-center justify-center transition-all duration-200 text-[var(--foreground)] text-xs"
               title="Éditer les options (type, liaison tâche)"
             >
               ✏️
@@ -129,7 +129,7 @@ export function DailyCheckboxItem({
         {checkbox.task && (
           <Link
             href={`/?highlight=${checkbox.task.id}`}
-            className="text-xs text-[var(--primary)] hover:text-[var(--primary)]/80 font-mono truncate max-w-[120px]"
+            className="text-xs text-[var(--primary)] hover:text-[var(--primary)]/80 font-mono truncate max-w-[100px]"
             title={`Tâche: ${checkbox.task.title}`}
           >
             {checkbox.task.title}
@@ -140,7 +140,7 @@ export function DailyCheckboxItem({
         <button
           onClick={() => onDelete(checkbox.id)}
           disabled={saving}
-          className="opacity-0 group-hover:opacity-100 w-6 h-6 rounded-full bg-[var(--destructive)]/20 hover:bg-[var(--destructive)]/30 border border-[var(--destructive)]/30 hover:border-[var(--destructive)]/50 flex items-center justify-center transition-all duration-200 text-[var(--destructive)] text-xs"
+          className="opacity-0 group-hover:opacity-100 w-5 h-5 rounded-full bg-[var(--destructive)]/20 hover:bg-[var(--destructive)]/30 border border-[var(--destructive)]/30 hover:border-[var(--destructive)]/50 flex items-center justify-center transition-all duration-200 text-[var(--destructive)] text-xs"
           title="Supprimer"
         >
           ×
diff --git a/components/daily/DailySection.tsx b/components/daily/DailySection.tsx
index 0b9b161..18cd1ce 100644
--- a/components/daily/DailySection.tsx
+++ b/components/daily/DailySection.tsx
@@ -73,7 +73,7 @@ export function DailySection({
 
       {/* Liste des checkboxes - zone scrollable */}
       <div className="flex-1 px-4 overflow-y-auto min-h-0">
-        <div className="space-y-2 pb-4">
+        <div className="space-y-1.5 pb-4">
           {checkboxes.map((checkbox) => (
             <DailyCheckboxItem
               key={checkbox.id}