Add margin

src/components/manageMember/ManageMember.jsx

@@ -19,7 +19,7 @@ export default function ManageMember({ user }) {
 
             <div className={styles.manageSection}>
                 <h3>Supprimer le compte</h3>
-                <DeleteMemberBtn name={user.name} id={user.id} />
+                <DeleteMemberBtn name={user.name} id={user.id} className={styles.manageBlockContent} />
             </div>
         </Modal>
     </>

src/components/manageMember/deleteMember/deleteMemberBtn.jsx

@@ -4,7 +4,7 @@ import { useState } from "react";
 import deleteUser from "../../../utils/users/deleteUser.js"
 import { useNavigate } from "react-router";
 
-export default function DeleteMemberBtn({ name, id }) {
+export default function DeleteMemberBtn({ name, id, ...props }) {
 
     const [open, setOpen] = useState(false);
     const navigate = useNavigate();
@@ -18,7 +18,7 @@ export default function DeleteMemberBtn({ name, id }) {
         }
     }
 
-    return <>
+    return <div {...props}>
         <Button variant={"danger"} onClick={() => setOpen(true)}>Supprimer</Button>
 
         <Modal open={open} onClose={() => setOpen(false)} title={"Supprimer"}>
@@ -27,5 +27,5 @@ export default function DeleteMemberBtn({ name, id }) {
                 <Button variant={"danger"} onClick={delMember}>Supprimer</Button>
             </div>
         </Modal>
-    </>
+    </div>
 }

src/components/manageMember/manageMember.module.css

@@ -12,4 +12,8 @@
     flex-direction: column;
     gap: 8px;
     margin: 1.5em;
+}
+
+.manageBlockContent {
+    margin: 0.5em;
 }