feat: add edit link

assets/styles/post.styl

@@ -343,6 +343,13 @@ margin-y($top, $bottom = $top)
   [data-target]
     animation target-blink 6s ease 1 both
 
+.meta
+  display flex
+  justify-content center
+
+  .one-edit-link
+    margin-top 40px
+
 @keyframes target-blink
   0%
     background-color #f2f7ff

components/OneBackToTop.vue

@@ -9,7 +9,7 @@
 >
   <veui-icon
     class="icon"
-    name="arrow-up"
+    name="chevron-up"
     :label="t('toTop')"
   />
 </button>
@@ -18,7 +18,7 @@
 <script>
 import { Icon } from 'veui'
 import i18n from 'veui/mixins/i18n'
-import 'veui-theme-dls-icons/arrow-up'
+import 'veui-theme-dls-icons/chevron-up'
 import { debounce } from 'lodash'
 
 export default {

components/OneEditLink.vue

@@ -0,0 +1,65 @@
+<template>
+<a
+  class="one-edit-link"
+  :href="href"
+  target="_blank"
+  rel="noopener"
+>
+  {{ t('editOnGitHub') }}
+  <veui-icon
+    class="icon"
+    name="external-link"
+  />
+</a>
+</template>
+
+<script>
+import { Icon } from 'veui'
+import i18n from 'veui/mixins/i18n'
+import 'veui-theme-dls-icons/external-link'
+
+const BASE_URL = 'https://github.com/ecomfe/veui-docs/edit/master/one/docs/'
+
+export default {
+  name: 'one-edit-link',
+  components: {
+    'veui-icon': Icon
+  },
+  mixins: [i18n],
+  props: {
+    path: String
+  },
+  computed: {
+    href () {
+      return `${BASE_URL}${this.path}`
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+.one-edit-link
+  display inline-flex
+  align-items center
+  padding 4px 6px
+  border-radius 4px
+  background-color #fff
+  color #848b99
+  border 1px solid #e2e6f0
+  transition background 0.2s, color 0.2s, border-color 0.2s
+  text-decoration none
+
+  &:hover
+  &[data-focus-visible-added]
+    background-color #f6f7fa
+    color #282c33
+    border-color #d3d9e6
+
+  &:active
+    background-color #e2e6f0
+    color #000
+    border-color #d3d9e6
+
+.icon
+  margin-left 4px
+</style>

one/build/page.js

@@ -74,7 +74,7 @@ export function renderDocToPage (file) {
     add({ [dep]: { [src]: true } })
   })
 
-  let { layout, style } = meta
+  let { layout, style = 'post' } = meta
   let componentList = Object.keys(components)
   let demoList = Object.keys(demos)
   let result = renderPage({
@@ -92,9 +92,10 @@ export function renderDocToPage (file) {
     }),
     components: componentList,
     alert: hasAlert,
-    boilerplate: demoList.length || componentList.length || hasAlert,
+    boilerplate: demoList.length || componentList.length || hasAlert || style === 'post',
     layout,
-    style: style || 'post'
+    style,
+    path: file
   })
 
   writeFileSync(dest, result)

one/templates/page.etpl

@@ -1,22 +1,28 @@
 <template>
 <article class="content ${style}">
-${content | raw}</article>
+${content | raw}
+<section class="meta">
+  <one-edit-link path="${path}"/>
+</section>
+</article>
 </template><!-- if: ${boilerplate} -->
 <script>
 import { htmlAttrs } from '~/common/i18n'<!-- for: ${components} as ${component} -->
 import ${component} from '~/components/${component}'<!-- /for --><!-- for: ${demos} as ${demo}, ${index} -->
 import Demo${index} from '${demo.src}'<!-- /for --><!-- if: ${demos.length} -->
-import OneDemo from '~/components/OneDemo'<!-- /if --><!-- if: ${alert} -->
+import OneDemo from '~/components/OneDemo'<!-- /if --><!-- if: ${path} -->
+import OneEditLink from '~/components/OneEditLink'<!-- /if --><!-- if: ${alert} -->
 import { VeuiAlert } from 'veui'<!-- /if -->
 
 export default {
-  mixins: [htmlAttrs],
   components: {
     <!-- for: ${components} as ${component}, ${index} -->${component}<!-- if: (${index} < ${component.length} - 1) && ${demos.length} -->,
     <!-- /if--><!-- /for --><!-- for: ${demos} as ${demo}, ${index} -->'${demo.name}': Demo${index},
     <!-- /for --><!-- if: ${demos.length} -->OneDemo<!-- /if --><!-- if: (${components.length} || ${demos.length}) && ${alert} -->,<!-- /if --><!-- if: ${alert} -->
-    VeuiAlert<!-- /if -->
+    VeuiAlert<!-- /if --><!-- if: (${components.length} || ${demos.length}) || ${alert} && ${path} -->,<!-- /if --><!-- if: ${path} -->
-  }
+    OneEditLink<!-- /if -->
+  },
+  mixins: [htmlAttrs]
 }
 </script><!-- else -->
 <script>

plugins/l10n.js

@@ -45,3 +45,23 @@ i18n.register(
     ns: 'onebacktotop'
   }
 )
+
+i18n.register(
+  'zh-Hans',
+  {
+    editOnGitHub: '在 GitHub 上编辑此页'
+  },
+  {
+    ns: 'oneeditlink'
+  }
+)
+
+i18n.register(
+  'en-US',
+  {
+    editOnGitHub: 'Edit this page on GitHub'
+  },
+  {
+    ns: 'oneeditlink'
+  }
+)