Merge pull request #3341 from metacpan/oalders/stars

oalders/stars

Author: oalders

lib/MetaCPAN/Web/Model/ReleaseInfo.pm

@@ -95,6 +95,7 @@ sub _fetch {
 
         $data->{chat}       = $self->_get_chat( $release, $dist );
         $data->{issues}     = $self->_get_issues( $release, $dist );
+        $data->{github}     = $dist->{repo}->{github};
         $data->{repository} = $self->_get_repository( $release, $dist );
 
         Future->done($data);

root/inc/favorite.tx

@@ -10,3 +10,11 @@
 <div class="show-logged-out">
     <button class="fav-not-logged-in favorite[% if $favorites { %] highlight[% } %]"><span>[% $favorites %]</span> ++</button>
 </div>
+%% if $github && $repository.url {
+  <div class="star-rating">
+    <a href="[% $repository.url %]" target="_blank" class="btn btn-primary" title="View on GitHub">
+      ⭐ Starred <span>[% $github.stars %]</span>
+      <span class="sr-only">GitHub stars</span>
+    </a>
+  </div>
+%% }

root/static/less/global.less

@@ -110,11 +110,10 @@ a.favorite {
     display: inline-block;
     line-height: 1;
     text-align: right;
-    min-width: 25px;
     position: relative;
-    top: -1px;
     font-size: @font-size-base;
     font-weight: normal;
+    height: 100%;
     min-width: 35px;
     cursor: pointer;
 
@@ -236,6 +235,30 @@ a.ellipsis:hover * {
     margin-bottom: 1px;
 }
 
+.star-rating {
+    & a.btn.btn-primary {
+        padding: 1px 3px;
+        font-size: 0.9em;
+        background: #f0f0f0 linear-gradient(to bottom, #fbfbfb, #f0f0f0);
+        color: #000;
+        min-width: 25px;
+        position: relative;
+        font-size: @font-size-base;
+        font-weight: normal;
+        min-width: 35px;
+        border-color: #e0e0e0;
+        line-height: 1.54em;
+
+        &:hover {
+            background: #36c linear-gradient(to bottom, #69f, #36c);
+            color: #fff;
+            border-color: #36c;
+            opacity: 1;
+            text-decoration: none;
+        }
+    }
+}
+
 /* Contributors list on release pages
 * see /release/Plack for example
 */