From 04bd5b1c09df6ca7330ad1a8c5269b0f85ba13af Mon Sep 17 00:00:00 2001
From: Agent Zero <agent@media-on.de>
Date: Tue, 28 Jul 2026 12:31:18 +0200
Subject: [PATCH] fix: multi-select icon before label, checkboxes not indented
 in multi-select mode

---
 .../components/contacts/ContactFolderTree.tsx | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/frontend/src/components/contacts/ContactFolderTree.tsx b/frontend/src/components/contacts/ContactFolderTree.tsx
index 6104e92..d9d99bd 100644
--- a/frontend/src/components/contacts/ContactFolderTree.tsx
+++ b/frontend/src/components/contacts/ContactFolderTree.tsx
@@ -163,7 +163,7 @@ function FolderTreeItem({
 
   return (
     <div>
-      <div className="flex items-center" style={{ paddingLeft: depth * 12 + 8 }}>
+      <div className="flex items-center" style={{ paddingLeft: multiSelectMode ? 8 : depth * 12 + 8 }}>
         <div
           draggable
           onDragStart={(e) => {
@@ -420,10 +420,9 @@ export function ContactFolderTree({
         <span>{t('contacts.allContacts')}</span>
       </button>
 
-      {/* Folder tree header with add button */}
+      {/* Folder tree header with multi-select toggle + add button */}
       <div className="flex items-center justify-between px-2 pt-2 pb-1">
-        <span className="text-xs font-semibold text-secondary-500 uppercase tracking-wide">Ordner</span>
-        <div className="flex items-center gap-1">
+        <div className="flex items-center gap-1.5">
           <button
             onClick={handleToggleMultiSelectMode}
             className={`text-secondary-400 hover:text-primary-600 p-0.5 ${multiSelectMode ? 'text-primary-600 bg-primary-50 rounded' : ''}`}
@@ -437,15 +436,16 @@ export function ContactFolderTree({
               <rect x="14" y="14" width="7" height="7" rx="1" />
             </svg>
           </button>
-          <button
-            onClick={handleNewFolder}
-            className="text-secondary-400 hover:text-primary-600 p-0.5"
-            title="Neuer Ordner"
-            aria-label="Neuer Ordner"
-          >
-            {icon(ICONS.plus, 'w-3.5 h-3.5')}
-          </button>
+          <span className="text-xs font-semibold text-secondary-500 uppercase tracking-wide">Ordner</span>
         </div>
+        <button
+          onClick={handleNewFolder}
+          className="text-secondary-400 hover:text-primary-600 p-0.5"
+          title="Neuer Ordner"
+          aria-label="Neuer Ordner"
+        >
+          {icon(ICONS.plus, 'w-3.5 h-3.5')}
+        </button>
       </div>
 
       {/* Multi-select info */}