Make the "Edit message" button accessible via keyboard

docs/CHANGELOG.md

@@ -6,6 +6,7 @@ Changelog
 - Fix #512: Validate `from` pagination cursor to prevent unbounded conversation loading
 - Fix #514: Optimize pin icon rendering on the inbox message list
 - Fix #515: Reduce database queries in the inbox list, conversation loading, reply action and unread count polling
+- Fix #519: Make the "Edit message" button accessible via keyboard
 
 3.3.12 (July 16, 2026)
 ----------------------

resources/css/humhub.mail.css

@@ -248,7 +248,7 @@
   position: relative;
 }
 .mail-conversation-entry .conversation-menu {
-  visibility: hidden;
+  opacity: 0;
   padding-left: 35px;
 }
 .mail-conversation-entry .conversation-menu .conversation-menu-item {
@@ -276,8 +276,12 @@
   background-color: var(--hh-background-color-secondary);
   color: inherit;
 }
-.mail-conversation-entry:hover .conversation-menu {
-  visibility: visible;
+.mail-conversation-entry .conversation-menu .conversation-edit-button:focus-visible {
+  outline: 0;
+  box-shadow: 0 0 0 2px var(--accent);
+}
+.mail-conversation-entry:hover .conversation-menu, .mail-conversation-entry:focus-within .conversation-menu {
+  opacity: 1;
 }
 .mail-conversation-entry .author-image .img-user {
   max-width: 100%;

resources/css/humhub.mail.scss

@@ -317,7 +317,10 @@ $radiusNone: 0;
     position: relative;
 
     .conversation-menu {
-        visibility: hidden; // Visible on .mail-conversation-entry:hover
+        // Kept in the layout and only visually hidden (not visibility:hidden/display:none),
+        // so the edit button stays focusable and reachable via keyboard Tab.
+        // Revealed on hover or when it (or a child) receives focus below.
+        opacity: 0;
         padding-left: 35px;
 
         .conversation-menu-item {
@@ -349,12 +352,21 @@ $radiusNone: 0;
                 background-color: $bgColorDefault;
                 color: inherit;
             }
+
+            // Now that the button is a real, focusable link (see ConversationEntryMenu::initMenus()),
+            // give it its own visible focus indicator - the round shape/badge background can make the
+            // browser's default outline hard to notice. Same treatment as .task-list-edit etc. in the
+            // tasks module.
+            &:focus-visible {
+                outline: 0;
+                box-shadow: 0 0 0 2px var(--accent);
+            }
         }
     }
 
-    &:hover {
+    &:hover, &:focus-within {
         .conversation-menu {
-            visibility: visible;
+            opacity: 1;
         }
     }