From dd7a47495aa8d8a8c07030b4b322edcfaac22961 Mon Sep 17 00:00:00 2001
From: Tao Wang <twang2218@gmail.com>
Date: Sun, 27 Nov 2016 05:20:38 +1100
Subject: [PATCH] Fix #8 Make github-buttons hide on mobile

The button will be hidden on mobile portrait mode, they are still visible on landscape mode on most phone.

Signed-off-by: Tao Wang <twang2218@gmail.com>
---
 _layouts/website/page.html | 9 ++++++++-
 src/plugin.js              | 2 +-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/_layouts/website/page.html b/_layouts/website/page.html
index 4cd2415..18e1516 100644
--- a/_layouts/website/page.html
+++ b/_layouts/website/page.html
@@ -2,7 +2,14 @@
 
 {% block head %}
     {{ super() }}
+    <style>
+    @media only screen and (max-width: 640px) {
+        .book-header .hidden-mobile {
+            display: none;
+        }
+    }
+    </style>
     <script>
         window["gitbook-plugin-github-buttons"] = {{ config.pluginsConfig['github-buttons']|dump|safe }};
     </script>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/src/plugin.js b/src/plugin.js
index bfb4332..65e4ef8 100644
--- a/src/plugin.js
+++ b/src/plugin.js
@@ -15,7 +15,7 @@ require(['gitbook'], function (gitbook) {
         var width = size === "large" ? "170" : "160";
         var height = size === "large" ? "30" : "20";
         var extraParam = type === "watch" ? "&v=2" : "";
-        return `<a class="btn pull-right" aria-label="github">
+        return `<a class="btn pull-right hidden-mobile" aria-label="github">
         <iframe style="display:inline-block;vertical-align:middle;" src="https://ghbtns.com/github-btn.html?user=${user}&repo=${repo}&type=${type}&count=${count}&size=${size}${extraParam}" frameborder="0" scrolling="0" width="${width}px" height="${height}px"></iframe>
         </a>`;
     }