微调二维码样式, 支持关闭二维码

app/assets/javascripts/angularjs/qrcodes.js.coffee

@@ -1,3 +1,3 @@
 @app.controller 'QRCodesController', ($scope)->
   $scope.show = ->
-    $scope.qrcode = true
+    $scope.qrcode = ! $scope.qrcode

app/assets/stylesheets/blogs.css.scss

@@ -60,3 +60,8 @@
     margin-right: 0.5rem;
   }
 }
+
+.qrcode-wrapper {
+  float: right;
+  margin-top: -2rem;
+}

app/assets/stylesheets/qrcodes.css.scss

@@ -12,8 +12,8 @@
      border-collapse: collapse;
      padding: 0;
      margin: 0;
-     width: 10px;
-     height: 10px;
+     width: 0.3rem;
+     height: 0.3rem;
    }
    td.black { background-color: #000; }
    td.white { background-color: #fff; }

app/views/blogs/_post.html.slim

@@ -21,10 +21,11 @@ p ng-controller="LikesController"
     span Liked
   div ng-controller = "QRCodesController"
     .qrcode
-      i.fi-link
-      a href="#" ng-model="qrcode" ng-init="qrcode=false" ng-click="show()" 二维码
+      span.has-tip data-tooltip="" title="使用手机继续阅读 or 帮我分享至微信朋友圈"
+        i.fi-link
+        a href="#" ng-model="qrcode" ng-init="qrcode=false" ng-click="show()" 二维码
     .social-share ng-show='qrcode'
-      = debug blog_url(post)
-      = render partial: "qrcode", locals: { str: blog_url(post) }
+      .qrcode-wrapper
+        = render partial: "qrcode", locals: { str: blog_url(post) }