feat: add edit link

This commit is contained in:
Justineo 2021-10-22 18:51:49 +08:00
parent 2a59d493a5
commit 4a257c3680
No known key found for this signature in database
GPG Key ID: B73F0979CF18A0EA
6 changed files with 109 additions and 10 deletions

View File

@ -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

View File

@ -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 {

View File

@ -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>

View File

@ -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)

View File

@ -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>

View File

@ -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'
}
)