feat: chat — boutons discrets sous l'image, image en onglet d'app, point de non-lus, notification OS, suppression annulable BUG-110

frontend/style.css

@@ -13828,8 +13828,8 @@ body.reading-mode .file-actions {
 }
 .file-chat-meta {
   display: flex;
-  justify-content: space-between;
-  gap: 8px;
+  align-items: center;
+  gap: 6px;
   font-size: 0.72rem;
   color: var(--text-muted, #8b949e);
   margin-bottom: 4px;
@@ -13947,18 +13947,23 @@ textarea.file-chat-input {
 /* Suppression d'un post */
 .file-chat-del {
   border: none;
-  background: transparent;
+  background: var(--bg-hover, #1f2430);
   cursor: pointer;
-  font-size: 0.75rem;
-  padding: 0 2px;
-  opacity: 0;
-  transition: opacity 0.12s;
+  font-size: 0.72rem;
+  padding: 2px 6px;
+  border-radius: 4px;
+  opacity: 0.6;
+  transition: opacity 0.15s, background 0.15s;
+  color: var(--danger, #ff7b72);
+  line-height: 1;
+  margin-left: auto; /* #110 — l'action se détache à droite de la ligne */
 }
 .file-chat-msg:hover .file-chat-del {
-  opacity: 0.7;
+  opacity: 1;
 }
 .file-chat-del:hover {
   opacity: 1 !important;
+  background: var(--danger-bg, #3d1a18);
 }
 /* Link preview (#191) */
 .file-chat-preview {
@@ -14035,6 +14040,25 @@ textarea.file-chat-input {
 .sidebar-tab {
   position: relative;
 }
+
+/* #110 — point de couleur sur l'icône chat tant qu'il reste des non-lus */
+.sidebar-tab#sidebar-tab-chat.chat-has-unread::after {
+  content: "";
+  position: absolute;
+  top: 3px;
+  left: 6px;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--danger, #e5534b);
+  animation: chat-dot-pulse 1.8s ease-out infinite;
+}
+
+@keyframes chat-dot-pulse {
+  0% { box-shadow: 0 0 0 0 rgba(229, 83, 75, 0.5); }
+  70% { box-shadow: 0 0 0 6px rgba(229, 83, 75, 0); }
+  100% { box-shadow: 0 0 0 0 rgba(229, 83, 75, 0); }
+}
 .chat-unread-badge {
   position: absolute;
   top: 2px;
@@ -14107,12 +14131,46 @@ textarea.file-chat-input {
   color: inherit;
   cursor: pointer;
 }
-.file-chat-image {
+.file-chat-image-container {
+  max-width: 100%;
+  margin-top: 6px;
+}
+.file-chat-image-container .file-chat-image {
+  display: block;
   max-width: 100%;
   max-height: 220px;
   border-radius: 8px;
-  margin-top: 6px;
-  display: block;
+  cursor: zoom-in;
+}
+/* Boutons discrets : icônes seules, sous l'image, alignés à droite */
+.file-chat-image-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 2px;
+  margin-top: 2px;
+}
+.file-chat-image-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: none;
+  border-radius: 4px;
+  background: transparent;
+  color: var(--text-muted, #8b949e);
+  opacity: 0.55;
+  cursor: pointer;
+  transition: opacity 0.15s, color 0.15s, background 0.15s;
+}
+.file-chat-image-btn:hover {
+  opacity: 1;
+  color: var(--accent, #58a6ff);
+  background: var(--bg-hover, rgba(128, 128, 128, 0.12));
+}
+.file-chat-image-btn i {
+  flex-shrink: 0;
 }
 .file-chat-video {
   max-width: 100%;
@@ -14120,10 +14178,50 @@ textarea.file-chat-input {
   border-radius: 8px;
   margin-top: 6px;
   display: block;
-}
-.file-chat-link {
+}.file-chat-link {
   color: var(--accent, #58a6ff);
   word-break: break-all;
 }
 
+/* #110 — message supprimé avec bouton Undo */
+.file-chat-deleted {
+  opacity: 0.7;
+  background: var(--bg-hover, #1f2430);
+  border-left: 2px solid var(--text-muted, #484f58);
+  padding: 4px 8px;
+  border-radius: 4px;
+  margin: 4px 0;
+}
+
+.file-chat-deleted-text {
+  font-style: italic;
+  color: var(--text-muted, #8b949e);
+  font-size: 0.85rem;
+}
+
+.file-chat-undo {
+  background: var(--accent, #58a6ff);
+  color: #fff;
+  border: none;
+  border-radius: 4px;
+  padding: 2px 8px;
+  font-size: 0.72rem;
+  cursor: pointer;
+  margin-left: 6px;
+  transition: background 0.15s;
+  vertical-align: middle;
+}
+
+.file-chat-undo:hover {
+  background: var(--accent-hover, #4494e6);
+}
+
+.file-chat-undo i {
+  margin-right: 3px;
+}
+
+
+
+
+