add the topic name to the +more popover in social toolbar, fix bug in…

… lookup of topic, adjust styles

inc/post-tags.php

@@ -206,22 +206,23 @@ function largo_post_social_links( $echo = true ) {
 		}
 
 		if ( ! empty( $top_term_id ) ) {
-			$top_term_link = get_term_link( $top_term_id, $top_term_taxonomy );
+			$top_term = get_term( (int) $top_term_id, $top_term_taxonomy );
+			$top_term_link = get_term_link( (int) $top_term_id, $top_term_taxonomy );
 			if ( ! is_wp_error( $top_term_link ) ) {
-				$more_social_links[] = '<li><a href="' . $top_term_link . '"><i class="icon-link"></i> More on this topic</a></li>';
+				$more_social_links[] = '<li><a href="' . $top_term_link . '"><i class="icon-link"></i> <span>More on ' . $top_term->name . '</span></a></li>';
 			}
 
 			$top_term_feed_link = get_term_feed_link( $top_term_id, $top_term_taxonomy );
 			if ( ! is_wp_error( $top_term_feed_link ) ) {
-				$more_social_links[] = '<li><a href="' . $top_term_feed_link . '"><i class="icon-rss"></i> Subscribe to this topic</a></li>';
+				$more_social_links[] = '<li><a href="' . $top_term_feed_link . '"><i class="icon-rss"></i> <span>Subscribe to ' . $top_term->name . '</span></a></li>';
 			}
 		}
 
 		// Try to get the author's Twitter link
 		$twitter_username = get_user_meta( $post->post_author, 'twitter', true );
 		if ( ! empty( $twitter_username ) ) {
 			$twitter_link = 'https://twitter.com/' . $twitter_username;
-			$more_social_links[] = '<li><a href="' . $twitter_link . '"><i class="icon-twitter"></i> Follow this author</a></li>';
+			$more_social_links[] = '<li><a href="' . $twitter_link . '"><i class="icon-twitter"></i> <span>Follow this author</span></a></li>';
 		}
 
 		if ( count( $more_social_links ) ) {

less/inc/single.less

@@ -231,12 +231,11 @@ body.normal.page {
 
 .post-social {
   margin-bottom: @baseline;
-  &> span {
+  & > span {
     // copied from widgets/largo-follow.less
     line-height: 1.5em;
     max-width: 250px;
     margin: 0.5em 0;
-    padding: 0.3em 1em 0.3em 0.5em; // Irregular padding is to counter 0.2em margin-left on the icon.
     text-align: center;
     text-transform: uppercase;
     font-weight: 300;
@@ -245,19 +244,24 @@ body.normal.page {
     font-size: @baseFontSize;
     color: @white;
 
-    @media (max-width: 768px) {
-      padding: 0.3em 0.6em;
-    }
-    @media (max-width: 480px) {
-      padding: 0.3em 0.2em;
-    }
-
     &:hover {
       cursor: pointer;
     }
     &:last-child {
       margin-right: 0;
     }
+
+    & > a {
+      display: block;
+      padding: 0.3em 1em 0.3em 0.5em; // Irregular padding is to counter 0.2em margin-left on the icon.
+
+      @media (max-width: 768px) {
+        padding: 0.3em 0.6em;
+      }
+      @media (max-width: 480px) {
+        padding: 0.3em 0.2em;
+      }
+    }
   }
   a {
     color: @white;
@@ -284,6 +288,8 @@ body.normal.page {
 
       a {
         color: @gray;
+        position: relative;
+        float: left;
         &:hover {
           color: @grayDark;
           text-decoration: underline;
@@ -293,14 +299,31 @@ body.normal.page {
       i {
         color: @grayLight;
         margin-right: 0.25em;
+        position: absolute;
+        top: 0;
+        left: 0;
       }
 
       ul, li {
         list-style-type: none;
         margin: 0;
         padding: 0;
         font-size: 14px;
-        line-height: 24px;
+        line-height: 20px;
+      }
+
+      li {
+        margin-bottom: 0.5em;
+        float: left;
+
+        &:last-child {
+          margin-bottom: 0;
+        }
+
+        span {
+          display: block;
+          margin-left: 28px;
+        }
       }
 
       @media (max-width: 480px) {