update example

Author: leezng

example/App.vue

@@ -1,7 +1,7 @@
 <template>
-  <div id="app">
-    <div class="example example-1">
-      <h2>EXAMPLE 1</h2>
+  <div class="example">
+    <div class="example-box">
+      <h2 class="title">EXAMPLE 1</h2>
       <div class="block">
         <h3>JSON Input:</h3>
         <textarea v-model="val"></textarea>
@@ -15,8 +15,8 @@
       </div>
     </div>
 
-    <div class="example example-2">
-      <h2>EXAMPLE 2</h2>
+    <div class="example-box">
+      <h2 class="title">EXAMPLE 2</h2>
       <div class="block">
         <h3>JSON Input:</h3>
         <textarea v-model="val"></textarea>
@@ -37,6 +37,7 @@
         </vue-json-pretty>
       </div>
     </div>
+    <a style="position: fixed; right: 0; top: 0;" href="https://github.com/leezng/el-form-renderer" target="_blank"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/652c5b9acfaddf3a9c326fa6bde407b87f7be0f4/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6f72616e67655f6666373630302e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_orange_ff7600.png"></a>
   </div>
 </template>
 
@@ -103,29 +104,38 @@ export default {
   html, body {
     margin: 0;
   }
-  h2, h3 {
-    margin: 0 0 10px;
-  }
   .example {
-    padding: 10px;
+    position: relative;
+    padding: 0 15px;
+    margin: 0 auto;
+    width: 1200px;
+  }
+  .example-box {
+    margin: 0 -15px;
     overflow: hidden;
+    .title {
+      text-align: center;
+    }
     .block {
       float: left;
-      padding: 0 20px;
+      padding: 0 15px;
       width: 50%;
       box-sizing: border-box;
     }
     textarea {
       padding: 5px;
       width: 100%;
-      height: 100px;
+      height: 150px;
       box-sizing: border-box;
+      border-radius: 5px;
       resize: vertical;
       font-family: inherit;
     }
     pre{
       margin: 0;
       font-family: Consolas;
+      overflow: auto;
+      text-overflow: ellipsis;
     }
   }
 </style>