trying out carbon

Author: Evan You

themes/vue/layout/layout.ejs

@@ -28,5 +28,8 @@
         <% } %>
         </div>
         <script src="/js/common.js"></script>
+        <div id="ad">
+            <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=vuejs" id="_carbonads_js"></script>
+        </div>
     </body>
 </html>

themes/vue/layout/partials/sidebar.ejs

@@ -12,8 +12,5 @@
             src="//gttp.co/v1.js"></script>
         </li>
         </ul>
-        <div class="ad">
-            <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=vuejs" id="_carbonads_js"></script>
-        </div>
     </div>
 </div>

themes/vue/source/css/_common.styl

@@ -98,4 +98,24 @@ a.button
 #main
     position relative
     z-index 1
-    padding 0 60px 30px
+    padding 0 60px 30px
+
+#ad
+    width 130px
+    position fixed
+    z-index 99
+    bottom 10px
+    right 10px
+    padding 10px
+    background-color #fff
+    border-radius 3px
+    font-size 13px
+    .carbon-img, .carbon-text
+        display block
+        margin-bottom 6px
+    .carbon-poweredby
+        color #aaa
+
+@media screen and (max-width: 720px)
+    #ad
+        display none

themes/vue/source/css/page.styl

@@ -66,15 +66,6 @@ $header-height = 40px
             color $green
         &:hover
             border-bottom 2px solid $green
-    .ad
-        margin-top 30px
-        width 130px
-        font-size 13px
-    .carbon-img, .carbon-text
-        display block
-        margin-bottom 6px
-    .carbon-poweredby
-        color #aaa
 
 .content
     padding 2.2em 0