css_modal_members_signature_ok

public/style/chat.css

@@ -470,7 +470,7 @@ body {
 }
 
 .modal-content {
-    background: var(--background-color);
+    background-color: var(--secondary-color);
     padding: 20px;
     border-radius: 8px;
     position: relative;
@@ -492,6 +492,15 @@ body {
     color: var(--accent-color);
 }
 
+.modal-members {
+    display: flex;
+    justify-content: space-between;
+}
+
+.modal-members ul li{
+    list-style: none;
+}
+
 #message-input {
     width: 100%;
     height: 50px;

src/pages/chat/chat.ts

@@ -1154,10 +1154,12 @@ class ChatElement extends HTMLElement {
                     <div class="modal-content">
                         <h2>New Request for ${emoji}</h2>
                         <button class="close-modal">&times;</button>
-                        <h2>To:</h2>
-                        <ul class="members-list-modal">
+                        <div class="modal-members">
+                            <h2>To:</h2>
+                            <ul class="members-list-modal">
                             ${membersList}
-                        </ul>
+                            </ul>
+                        </div>
                         <div class="modal-body">
                             <textarea id="message-input" placeholder="Write your message here..."></textarea>
                             <input type="file" id="file-input" placeholder="Select a file">
@@ -1180,9 +1182,8 @@ class ChatElement extends HTMLElement {
     private async generateMembersList(members: string[]) {
         let html = '';
         for (const member of members) {
-            console.log("Je suis le membre :", member);
             const emoji = await addressToEmoji(member);
-            html += `<li>${emoji}</li>`;
+            html += `<li>${emoji}<input type="checkbox" class="member-checkbox" data-member="${member}"></li>`;
         }
         return html;
     }