no message

Former-commit-id: 43a8224a34f70bb4292c77196f4d98d18b58cb44
Former-commit-id: d154b16d0b3f214e55815c123b775681016c5a70
Former-commit-id: 22378774d55271fb76d5827ea0ffdfd1f2678831

src/assets/style/fixed/base.scss

@@ -8,3 +8,7 @@ pre {
   margin: 0px;
   border-radius: $border-radius;
 }
+
+a {
+  text-decoration: none;
+}

src/assets/style/public-class.scss

@@ -23,6 +23,12 @@ html, body {
   }
 }
 
+.fl {
+  float: left;
+}
+.fr {
+  float: right;
+}
 .clearfix:before,
 .clearfix:after {
   display: table;

src/components/demo/GithubLink/index.vue

@@ -1,6 +1,6 @@
 <template>
   <el-tooltip :content="url" :placement="tooltipPlacement">
-    <a :href="url" target="_blank">
+    <a :href="url" target="_blank" class="link">
       View in Github
       <span class="fa fa-github"></span>
     </a>
@@ -20,3 +20,10 @@ export default {
 }
 </script>
 
+<style lang="scss" scoped>
+@import '~@/assets/style/unit/_color.scss';
+.link {
+  color: $color-primary;
+}
+</style>
+

src/components/demo/PageHeader/index.vue

@@ -0,0 +1,23 @@
+<template>
+  <div class="clearfix">
+    <span class="fl">{{title}}</span>
+    <span class="fr"><GithubLink :url="url"></GithubLink></span>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    url: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    title: {
+      type: String,
+      required: false,
+      default: ''
+    }
+  }
+}
+</script>

src/components/index.js

@@ -48,3 +48,9 @@ Vue.component('CountUp', resolve => {
 Vue.component('Highlight', resolve => {
   require(['@/components/core/Highlight/index.vue'], resolve)
 })
+
+// 名称：页面Header
+// 用途：页面Header
+Vue.component('PageHeader', resolve => {
+  require(['@/components/demo/PageHeader/index.vue'], resolve)
+})

src/pages/demo/plugins/clipboard-polyfill/demo.vue

@@ -1,6 +1,10 @@
 <template>
   <Container>
-    <GithubLink url="https://github.com/lgarron/clipboard-polyfill"></GithubLink>
+    <PageHeader
+      slot="header"
+      title="基本示例"
+      url="https://github.com/lgarron/clipboard-polyfill">
+    </PageHeader>
     <el-row :gutter="10">
       <el-col :span="12">
         <div class="mb">

src/pages/demo/plugins/clipboard-polyfill/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/lgarron/clipboard-polyfill"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/lgarron/clipboard-polyfill">
+    </PageHeader>
     <div>
       <Markdown url="https://raw.githubusercontent.com/lgarron/clipboard-polyfill/master/README.md"></Markdown>
     </div>

src/pages/demo/plugins/countup/demo.vue

@@ -1,40 +1,52 @@
 <template>
-  <Container type="ghost" class="demo-plugin-countup-demo">
+  <Container type="ghost" class="page">
     <el-row :gutter="10">
       <el-col :span="6">
         <el-card>
           <p slot="title">只设置目标数字</p>
-          <CountUp :end="100"></CountUp>
+          <div class="group">
+            <CountUp :end="100"></CountUp>  
+          </div>
         </el-card>
       </el-col>
       <el-col :span="6">
         <el-card>
           <p slot="title">设置起止数值</p>
-          <CountUp :start="14" :end="100"></CountUp>
+          <div class="group">
+            <CountUp :start="14" :end="100"></CountUp>
+          </div>
         </el-card>
       </el-col>
       <el-col :span="6">
         <el-card>
           <p slot="title">小数位数</p>
-          <CountUp :end="100.00" :decimals="2"></CountUp>
+          <div class="group">
+            <CountUp :end="100.00" :decimals="2"></CountUp>  
+          </div>
         </el-card>
       </el-col>
       <el-col :span="6">
         <el-card>
           <p slot="title">动画时长</p>
-          <CountUp :end="100" :duration="6"></CountUp>
+          <div class="group">
+            <CountUp :end="100" :duration="6"></CountUp>
+          </div>
         </el-card>
       </el-col>
       <el-col :span="6">
         <el-card>
           <p slot="title">回调函数</p>
-          <CountUp :end="100" :callback="() => {className = 'end'}" :class="className"></CountUp>
+          <div class="group">
+            <CountUp :end="100" :callback="() => {className = 'end'}" :class="className"></CountUp>
+          </div>
         </el-card>
       </el-col>
       <el-col :span="6">
         <el-card>
           <p slot="title">结束一秒后更新数值</p>
-          <CountUp :end="end" :callback="update"></CountUp>
+          <div class="group">
+            <CountUp :end="end" :callback="update"></CountUp>
+          </div>
         </el-card>
       </el-col>
     </el-row>
@@ -62,18 +74,18 @@ export default {
 </script>
 
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import '~@/assets/style/public.scss';
-.demo-plugin-countup-demo {
+.page {
   .el-card {
     @extend %unable-select;
     margin-bottom: 10px;
-    .el-card__body {
+    .group {
       display: flex;
       justify-content: center;
       align-items: center;
       span {
-        font-size: 40px;
+        font-size: 60px;
         &.end {
           padding: 0px 20px;
           border-radius: $border-radius;

src/pages/demo/plugins/countup/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/inorganik/countUp.js"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/inorganik/countUp.js">
+    </PageHeader>
     <div>
       <Markdown url="https://raw.githubusercontent.com/inorganik/countUp.js/master/README.md"></Markdown>
     </div>

src/pages/demo/plugins/highlight/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/isagalaev/highlight.js"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/isagalaev/highlight.js">
+    </PageHeader>
     <div>
       <Markdown url="https://raw.githubusercontent.com/isagalaev/highlight.js/master/README.md"></Markdown>
     </div>

src/pages/demo/plugins/js-cookie/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/js-cookie/js-cookie"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/js-cookie/js-cookie">
+    </PageHeader>
     <div>
       <Markdown url="https://raw.githubusercontent.com/js-cookie/js-cookie/master/README.md"></Markdown>
     </div>

src/pages/demo/plugins/marked/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/chjj/marked"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/chjj/marked">
+    </PageHeader>
     <Markdown url="https://raw.githubusercontent.com/chjj/marked/master/README.md"></Markdown>
   </Container>
 </template>

src/pages/demo/plugins/mock/grammaticalNorm.vue

@@ -1,5 +1,10 @@
 <template>
   <Container>
+    <PageHeader
+      slot="header"
+      title="mock语法规范"
+      url="https://github.com/nuysoft/Mock">
+    </PageHeader>
     <Markdown url="/static/markdownFiles/article/mock语法规范.md"></Markdown>
   </Container>
 </template>

src/pages/demo/plugins/mock/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/nuysoft/Mock"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/nuysoft/Mock">
+    </PageHeader>
     <Markdown url="https://raw.githubusercontent.com/nuysoft/Mock/refactoring/README.md"></Markdown>
   </Container>
 </template>

src/pages/demo/plugins/papaParse/demo.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <!-- <template slot="title">演示</tempalte> -->
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/mholt/PapaParse"></GithubLink></p>
+      slot="header"
+      title="基本示例"
+      url="https://github.com/mholt/PapaParse">
+    </PageHeader>
     <el-upload
       :before-upload="handleUpload"
       action="default">

src/pages/demo/plugins/papaParse/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/mholt/PapaParse"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/mholt/PapaParse">
+    </PageHeader>
     <Markdown url="https://raw.githubusercontent.com/mholt/PapaParse/master/README.md"></Markdown>
   </Container>
 </template>

src/pages/demo/plugins/simpleMDE/demo.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <!-- <template slot="title">演示</tempalte> -->
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/sparksuite/simplemde-markdown-editor"></GithubLink></p>
+      slot="header"
+      title="基本示例"
+      url="https://github.com/sparksuite/simplemde-markdown-editor">
+    </PageHeader>
     <div style="margin-bottom: -16px;">
       <SimpleMDE></SimpleMDE>
     </div>

src/pages/demo/plugins/simpleMDE/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/sparksuite/simplemde-markdown-editor"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/sparksuite/simplemde-markdown-editor">
+    </PageHeader>
     <Markdown url="https://raw.githubusercontent.com/sparksuite/simplemde-markdown-editor/master/README.md"></Markdown>
   </Container>
 </template>

src/pages/demo/plugins/vue-grid-layout/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/jbaysolutions/vue-grid-layout"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/jbaysolutions/vue-grid-layout">
+    </PageHeader>
     <Markdown url="https://raw.githubusercontent.com/jbaysolutions/vue-grid-layout/master/README.md"></Markdown>
   </Container>
 </template>

src/pages/demo/plugins/vue-splitpane/demo.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <!-- <template slot="title">演示</tempalte> -->
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/PanJiaChen/vue-split-pane"></GithubLink></p>
+      slot="header"
+      title="基本示例"
+      url="https://github.com/PanJiaChen/vue-split-pane">
+    </PageHeader>
     <div style="height: 400px; margin: -16px;">
       <SplitPane :min-percent='20' :default-percent='30' split="vertical">
         <template slot="paneL"><div style="margin: 10px;">左</div></template>

src/pages/demo/plugins/vue-splitpane/readme.vue

@@ -1,7 +1,10 @@
 <template>
   <Container>
-    <p slot="title">README.md</p>
+    <PageHeader
-    <p slot="more"><GithubLink url="https://github.com/PanJiaChen/vue-split-pane"></GithubLink></p>
+      slot="header"
+      title="README.md"
+      url="https://github.com/PanJiaChen/vue-split-pane">
+    </PageHeader>
     <Markdown url="https://raw.githubusercontent.com/PanJiaChen/vue-split-pane/master/README.md"></Markdown>
   </Container>
 </template>