feat: refine sidenav and layout demo, update veui

components/OneDemo.vue

@@ -7,7 +7,7 @@
     <browser-window
       v-if="browser"
       :url="browser"
-      width="80%"
+      width="calc(100% - 40px)"
       height="400px"
     >
       <slot/>
@@ -86,6 +86,7 @@
       }"
       :code="code"
       :expanded="editorExpanded"
+      :browser="!!browser"
       @close="handleEditorClose"
       @toggle="handleEditorToggle"
     />
@@ -221,6 +222,10 @@ Icon.register({
   border-top-right-radius 4px
   padding 30px
 
+  & >>> .style-module_body__14MV-
+    transform translate(0, 0)
+    padding 0
+
 .desc
   border 1px solid #eee
   padding 18px 20px

components/OneLive.vue

@@ -64,6 +64,9 @@
   <v-pane
     min-size="40"
     class="live-preview"
+    :class="{
+      'live-preview-browser': browser
+    }"
   >
     <v-live-preview
       class="editor-preview"
@@ -166,7 +169,8 @@ export default {
     code: {
       type: String,
       default: ''
-    }
+    },
+    browser: Boolean
   },
   data () {
     return {
@@ -321,6 +325,10 @@ export default {
   & >>> .live-preview
     overflow auto
 
+.live-preview-browser
+  transform translate(0, 0)
+  padding 0 !important
+
 .editor-toolbar
   position absolute
   top 12px

components/OneRepl.vue

@@ -21,6 +21,7 @@
   <one-live
     class="editor"
     :code="code"
+    :browser="browser"
   />
 </article>
 </template>
@@ -60,7 +61,8 @@ export default {
       type: String,
       default: ''
     },
-    expanded: Boolean
+    expanded: Boolean,
+    browser: Boolean
   },
   methods: {
     handleClose () {