fix mobile style

docs/src/ExamplesApp.vue

@@ -1,18 +1,54 @@
 <template>
-  <div class="examples-container">
-    <router-view></router-view>
-    <div class="footer">
+  <div class="examples-container" ref="container">
+    <div class="demo-content" ref="demo">
+      <router-view></router-view>
+    </div>
+    <div class="footer" :class="{ 'footer-fixed': isFooterFixed }">
       <img src="https://img.yzcdn.cn/upload_files/2017/04/18/FjupTe9o1apJhJr5qR-4ucXqPs7e.png" alt="logo" class="zanui-logo">
     </div>
   </div>
 </template>
 
 <script>
+import Vue from 'vue';
+
 export default {
   computed: {
     visible() {
       return ['/'].indexOf(this.$route.path) < 0;
     }
+  },
+
+  data() {
+    return {
+      isFooterFixed: false
+    };
+  },
+
+  mounted() {
+    this.computeFooterFixed();
+  },
+
+  watch: {
+    '$route.path': function(val) {
+      Vue.nextTick(() => {
+        this.computeFooterFixed();
+      });
+    }
+  },
+
+  methods: {
+    computeFooterFixed() {
+      if (this.$refs.container) {
+        const demoSize = this.$refs.demo.getBoundingClientRect();
+        const containerSize = this.$refs.container.getBoundingClientRect();
+        if (demoSize.height < containerSize.height - 54) {
+          this.isFooterFixed = true;
+          return;
+        }
+      }
+      this.isFooterFixed = false;
+    }
   }
 };
 </script>
@@ -48,7 +84,6 @@ export default {
   }
 
   .examples-container {
-    padding-bottom: 54px;
     height: 100%;
     overflow: auto;
     background: #f8f8f8;
@@ -89,10 +124,13 @@ export default {
     margin-top: 30px;
     width: 100%;
     padding: 10px 0 20px;
-    position: fixed;
-    bottom: 0;
-    left: 0;
     background: #f8f8f8;
+    
+    &.footer-fixed {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+    }
   }
 
   .zanui-logo {