Tag is not tappable in topic list on mobile

Hmm it seems something may have regressed… what I see now on iOS is that the categories tap through to the category page and the tags are a dead zone (so they don’t even click through to the topic). I can look into this. That CSS is also out of date… at the moment it would be (I’ll update that post):

.topic-list .topic-item-stats__category-tags { 
  .discourse-tag,
  .badge-wrapper {
    pointer-events: all; 
  }
}

I definitely understand the desire for consistency, but accidentally tapping on a category or tag instead of a topic, or tapping on the wrong category/tag is very easy… and it’s a particularly bad experience on the topic list where entering a topic is the primary action.

The minimum recommended size for a tappable element on a mobile device is generally around 45px square, and we’d have to nearly double the height of categories and tags to get there. This is possible if categories and tags are limited to a single line, but a lot of sites have enough content here for it to wrap… and spacing like this wouldn’t be great:

I could imagine redesigning categories and tags to use some kind of more button-like styling to ensure proper tap sizes, but that would be a big change that we’d want to implement throughout all of Discourse.

2 Likes