UX: Larger clickable area for mobile topic list (#16473)

app/assets/javascripts/discourse/app/components/topic-list-item.js

@@ -258,6 +258,19 @@ export default Component.extend({
       return this.navigateToTopic(topic, e.target.getAttribute("href"));
     }
 
+    // make full row click target on mobile, due to size constraints
+    if (
+      this.site.mobileView &&
+      (e.target.classList.contains("right") ||
+        e.target.classList.contains("topic-item-stats") ||
+        e.target.classList.contains("main-link"))
+    ) {
+      if (wantsNewWindow(e)) {
+        return true;
+      }
+      return this.navigateToTopic(topic, topic.lastUnreadUrl);
+    }
+
     if (e.target.closest("a.topic-status")) {
       this.topic.togglePinnedForUser();
       return false;

app/assets/javascripts/discourse/app/templates/mobile/list/topic-list-item.hbr

@@ -38,14 +38,10 @@
         </div>
       {{/unless}}
       {{discourse-tags topic mode="list"}}
-      <div class="pull-right">
-        <div class='num activity last'>
-          <span class="age activity" title="{{topic.bumpedAtTitle}}"><a
-              href="{{topic.lastPostUrl}}">{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a>
-          </span>
-        </div>
+      <div class='num activity last'>
+        <span class="age activity" title="{{topic.bumpedAtTitle}}"><a
+            href="{{topic.lastPostUrl}}">{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a>
+        </span>
       </div>
-      <div class="clearfix"></div>
-    </div>
   </div>
 </td>