Include count in mobile post action link (reshare, comment and like)

app/assets/javascripts/mobile/mobile_post_actions.js

@@ -75,7 +75,7 @@
 
     onLike: function(evt){
       evt.preventDefault();
-      var link = $(evt.target),
+      var link = $(evt.target).closest(".like-action"),
           likeCounter = $(evt.target).closest(".stream-element").find(".like-count");
 
       if(!link.hasClass("loading") && link.hasClass("inactive")) {
@@ -89,7 +89,7 @@
     onReshare: function(evt) {
       evt.preventDefault();
 
-      var link = $(this),
+      var link = $(this).closest(".reshare-action"),
           href = link.attr("href"),
           confirmText = link.attr("title");
 

app/assets/stylesheets/mobile/comments.scss

@@ -43,16 +43,15 @@
     display: flex;
 
     .count {
+      color: $text-color;
+      font-family: $font-family-base;
+      font-size: $font-size-base;
       line-height: 22px;
       margin-left: 5px;
+      vertical-align: top;
       z-index: 2;
     }
 
-    .icon-count-group {
-      display: flex;
-      margin: 0 7px;
-    }
-
     [class^="entypo"] {
       color: $text-grey;
       font-size: 24px;
@@ -73,6 +72,9 @@
   }
 
   .post-action {
+    display: flex;
+    margin: 0 7px;
+
     .disabled { color: $medium-gray; }
   }
 

app/helpers/mobile_helper.rb

@@ -7,25 +7,30 @@ module MobileHelper
         reshare = Reshare.where(author_id: current_user.person_id,
                                 root_guid: absolute_root.guid).first
         klass = reshare.present? ? "active" : "inactive"
-        link_to "", reshares_path(root_guid: absolute_root.guid),
+        link_to content_tag(:span, post.reshares.size, class: "count reshare-count"),
+                reshares_path(root_guid: absolute_root.guid),
                 title: t("reshares.reshare.reshare_confirmation", author: absolute_root.author_name),
                 class: "entypo-reshare reshare-action #{klass}"
       else
-        content_tag :div, nil, class: "entypo-reshare reshare-action disabled"
+        content_tag :div,
+                    content_tag(:span, post.reshares.size, class: "count reshare-count"),
+                    class: "entypo-reshare reshare-action disabled"
       end
     else
-      content_tag :div, nil, class: "entypo-reshare reshare-action disabled"
+      content_tag :div,
+                  content_tag(:span, post.reshares.size, class: "count reshare-count"),
+                  class: "entypo-reshare reshare-action disabled"
     end
   end
 
   def mobile_like_icon(post)
     if current_user && current_user.liked?(post)
-      link_to "",
+      link_to content_tag(:span, post.likes.size, class: "count like-count"),
               "#",
               data:  {url: post_like_path(post.id, current_user.like_for(post).id)},
               class: "entypo-heart like-action active"
     else
-      link_to "",
+      link_to content_tag(:span, post.likes.size, class: "count like-count"),
               "#",
               data:  {url: post_likes_path(post.id)},
               class: "entypo-heart like-action inactive"
@@ -33,7 +38,9 @@ module MobileHelper
   end
 
   def mobile_comment_icon(post)
-    link_to "", new_post_comment_path(post), class: "entypo-comment comment-action inactive"
+    link_to content_tag(:span, post.comments.size, class: "count comment-count"),
+            new_post_comment_path(post),
+            class: "entypo-comment comment-action inactive"
   end
 
   def show_comments_link(post, klass="")

app/views/comments/_post_stats.mobile.haml

 .post-stats
   - if post.public?
-    .icon-count-group
-      .post-action= mobile_reshare_icon(post)
-      %span.reshare-count.count= post.reshares.size
+    .post-action
+      = mobile_reshare_icon(post)
 
-  .icon-count-group
-    .post-action= mobile_comment_icon(post)
-    %span.comment-count.count= post.comments.size
+  .post-action
+    = mobile_comment_icon(post)
 
-  .icon-count-group
-    .post-action= mobile_like_icon(post)
-    %span.like-count.count= post.likes.size
+  .post-action
+    = mobile_like_icon(post)