css: Allow reaction button to be visible in message box.

It enables the reaction button to become visible when clicking on a
message-box in a mobile view.

Fixes #29529.

web/src/click_handlers.js

@@ -289,6 +289,11 @@ export function initialize() {
         navigate.to_end();
     });
 
+    $("body").on("click", ".message_row", function () {
+        $(".selected_msg_for_touchscreen").removeClass("selected_msg_for_touchscreen");
+        $(this).addClass("selected_msg_for_touchscreen");
+    });
+
     // MESSAGE EDITING
 
     $("body").on("click", ".edit_content_button", function (e) {

web/styles/zulip.css

@@ -1377,6 +1377,19 @@ td.pointer {
     }
 }
 
+.selected_msg_for_touchscreen {
+    @media (hover: none) {
+        .message_reactions {
+            .message_reaction {
+                + .reaction_button {
+                    visibility: visible;
+                    pointer-events: all;
+                }
+            }
+        }
+    }
+}
+
 .message_sender {
     & i.zulip-icon.zulip-icon-bot {
         font-size: 12px;