topic-box: Support clicking on the left side.

Fixes:
https://chat.zulip.org/#narrow/channel/9-issues/topic/Clicking.20the.20right.20end.20of.20DM.20list.20items.20doesn't.20work/near/2191051.
Signed-off-by: apoorvapendse <apoorvavpendse@gmail.com>

web/src/topic_popover.ts

@@ -38,7 +38,7 @@ function get_conversation(instance: tippy.Instance): {
         const $elt = $(instance.reference).closest(".topic-sidebar-menu-icon").expectOne();
         const $stream_li = $elt.closest(".narrow-filter").expectOne();
         topic_name = $elt.closest("li").expectOne().attr("data-topic-name")!;
-        url = util.the($elt.closest("li").find<HTMLAnchorElement>("a.sidebar-topic-name")).href;
+        url = util.the($elt.closest("li").find<HTMLAnchorElement>("a.topic-box")).href;
         stream_id = stream_popover.elem_to_stream_id($stream_li);
     }
 

web/styles/left_sidebar.css

@@ -1177,6 +1177,21 @@ li.top_left_scheduled_messages {
         var(--left-sidebar-icon-content-gap)
         minmax(0, 1fr) minmax(0, max-content) minmax(0, max-content)
         var(--left-sidebar-vdots-width) 0;
+    text-decoration: none;
+    color: inherit;
+
+    &:hover {
+        opacity: 1;
+        text-decoration: none;
+        color: inherit;
+    }
+
+    &:not(:active):focus {
+        text-decoration: none;
+        border: none;
+        outline: none;
+        color: inherit;
+    }
 }
 
 .searching-for-more-topics {

web/templates/topic_list_item.hbs

@@ -1,11 +1,11 @@
 <li class="bottom_left_row {{#if is_active_topic}}active-sub-filter{{/if}} {{#if is_zero}}zero-topic-unreads{{/if}} {{#if is_muted}}muted_topic{{/if}} {{#if is_unmuted_or_followed}}unmuted_or_followed_topic{{/if}} topic-list-item" data-topic-name="{{topic_name}}">
-    <div class="topic-box">
+    <a href="{{url}}" class="topic-box">
         <span class="sidebar-topic-check">
             {{topic_resolved_prefix}}
         </span>
-        <a href="{{url}}" class="sidebar-topic-name">
+        <span class="sidebar-topic-name">
             <span class="sidebar-topic-name-inner {{#if is_empty_string_topic}}empty-topic-display{{/if}}">{{topic_display_name}}</span>
-        </a>
+        </span>
         <div class="topic-markers-and-unreads change_visibility_policy" data-stream-id="{{stream_id}}" data-topic-name="{{topic_name}}">
             {{#if contains_unread_mention}}
                 <span class="unread_mention_info">
@@ -21,5 +21,5 @@
         <span class="sidebar-menu-icon topic-sidebar-menu-icon">
             <i class="zulip-icon zulip-icon-more-vertical" aria-hidden="true"></i>
         </span>
-    </div>
+    </a>
 </li>