From 3035b83e15e1cd2a104834dcd454bd6835d86e4a Mon Sep 17 00:00:00 2001
From: tangjinzhou <415800467@qq.com>
Date: Thu, 1 Feb 2018 14:23:59 +0800
Subject: [PATCH] fix

---
 examples/components/demo.vue   | 20 ++++++++++++--------
 examples/components/header.vue | 24 ++++++++++++++++++++++++
 examples/index.less            | 14 ++++++++++++++
 3 files changed, 50 insertions(+), 8 deletions(-)
 create mode 100644 examples/components/header.vue

diff --git a/examples/components/demo.vue b/examples/components/demo.vue
index fbfc48ed8..b4654bb8a 100644
--- a/examples/components/demo.vue
+++ b/examples/components/demo.vue
@@ -1,6 +1,7 @@
 <script>
 import { Menu } from 'antd'
 import * as AllDemo from '../demo'
+import Header from './header'
 const MenuItem = Menu.Item
 export default {
   render () {
@@ -11,14 +12,17 @@ export default {
       lang = 'us'
     }
     return (
-      <div class='site page-container'>
-        <Menu class='nav' selectedKeys={[name]}>
-          {Object.keys(AllDemo).map(d => <MenuItem key={d}>
-            <router-link to={{ path: `/components/${lang}/${d}` }}>{d}</router-link>
-          </MenuItem>)}
-        </Menu>
-        <div class='content main-container'>
-          {Demo ? <Demo /> : '正在紧急开发中...'}
+      <div class='site'>
+        <Header />
+        <div class='main-wrapper'>
+          <Menu class='nav' selectedKeys={[name]}>
+            {Object.keys(AllDemo).map(d => <MenuItem key={d}>
+              <router-link to={{ path: `/components/${lang}/${d}` }}>{d}</router-link>
+            </MenuItem>)}
+          </Menu>
+          <div class='content main-container'>
+            {Demo ? <Demo /> : '正在紧急开发中...'}
+          </div>
         </div>
 
       </div>
diff --git a/examples/components/header.vue b/examples/components/header.vue
new file mode 100644
index 000000000..d122625b1
--- /dev/null
+++ b/examples/components/header.vue
@@ -0,0 +1,24 @@
+<template>
+  <header id='header'>
+    <a-menu v-model="current" mode="horizontal" id="nav">
+      <a-menu-item key='home'>
+        首页
+      </a-menu-item>
+      <a-menu-item key='design'>
+        设计语言
+      </a-menu-item>
+      <a-menu-item key='components'>
+        组件
+      </a-menu-item>
+    </a-menu>
+  </header>
+</template>
+<script>
+export default {
+  data () {
+    return {
+      current: ['components'],
+    }
+  },
+}
+</script>
diff --git a/examples/index.less b/examples/index.less
index a725b3921..b66151d20 100644
--- a/examples/index.less
+++ b/examples/index.less
@@ -1,11 +1,25 @@
 @import './theme/static/index.less';
+#app {
+  height: 100%;
+}
 .site {
   display: flex;
+  flex-direction: column;
+  height: 100%;
   .nav {
     width: 200px;
+    overflow-y: scroll;
   }
   .content {
     flex: 1;
+    overflow-y: scroll;
+  }
+  #header {
+    padding: 0 50px;
+  }
+  .main-wrapper {
+    display: flex;
+    flex: 1;
   }
 }