aboutsummaryrefslogtreecommitdiff
path: root/node_modules/vuepress/lib/default-theme/NavLinks.vue
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/vuepress/lib/default-theme/NavLinks.vue')
-rw-r--r--node_modules/vuepress/lib/default-theme/NavLinks.vue151
1 files changed, 151 insertions, 0 deletions
diff --git a/node_modules/vuepress/lib/default-theme/NavLinks.vue b/node_modules/vuepress/lib/default-theme/NavLinks.vue
new file mode 100644
index 00000000..4037f288
--- /dev/null
+++ b/node_modules/vuepress/lib/default-theme/NavLinks.vue
@@ -0,0 +1,151 @@
+<template>
+ <nav
+ class="nav-links"
+ v-if="userLinks.length || repoLink"
+ >
+ <!-- user links -->
+ <div
+ class="nav-item"
+ v-for="item in userLinks"
+ :key="item.link"
+ >
+ <DropdownLink
+ v-if="item.type === 'links'"
+ :item="item"
+ />
+ <NavLink
+ v-else
+ :item="item"
+ />
+ </div>
+
+ <!-- repo link -->
+ <a
+ v-if="repoLink"
+ :href="repoLink"
+ class="repo-link"
+ target="_blank"
+ rel="noopener noreferrer"
+ >
+ {{ repoLabel }}
+ <OutboundLink/>
+ </a>
+ </nav>
+</template>
+
+<script>
+import DropdownLink from './DropdownLink.vue'
+import { resolveNavLinkItem } from './util'
+import NavLink from './NavLink.vue'
+
+export default {
+ components: { NavLink, DropdownLink },
+
+ computed: {
+ userNav () {
+ return this.$themeLocaleConfig.nav || this.$site.themeConfig.nav || []
+ },
+
+ nav () {
+ const { locales } = this.$site
+ if (locales && Object.keys(locales).length > 1) {
+ const currentLink = this.$page.path
+ const routes = this.$router.options.routes
+ const themeLocales = this.$site.themeConfig.locales || {}
+ const languageDropdown = {
+ text: this.$themeLocaleConfig.selectText || 'Languages',
+ items: Object.keys(locales).map(path => {
+ const locale = locales[path]
+ const text = themeLocales[path] && themeLocales[path].label || locale.lang
+ let link
+ // Stay on the current page
+ if (locale.lang === this.$lang) {
+ link = currentLink
+ } else {
+ // Try to stay on the same page
+ link = currentLink.replace(this.$localeConfig.path, path)
+ // fallback to homepage
+ if (!routes.some(route => route.path === link)) {
+ link = path
+ }
+ }
+ return { text, link }
+ })
+ }
+ return [...this.userNav, languageDropdown]
+ }
+ return this.userNav
+ },
+
+ userLinks () {
+ return (this.nav || []).map(link => {
+ return Object.assign(resolveNavLinkItem(link), {
+ items: (link.items || []).map(resolveNavLinkItem)
+ })
+ })
+ },
+
+ repoLink () {
+ const { repo } = this.$site.themeConfig
+ if (repo) {
+ return /^https?:/.test(repo)
+ ? repo
+ : `https://github.com/${repo}`
+ }
+ },
+
+ repoLabel () {
+ if (!this.repoLink) return
+ if (this.$site.themeConfig.repoLabel) {
+ return this.$site.themeConfig.repoLabel
+ }
+
+ const repoHost = this.repoLink.match(/^https?:\/\/[^/]+/)[0]
+ const platforms = ['GitHub', 'GitLab', 'Bitbucket']
+ for (let i = 0; i < platforms.length; i++) {
+ const platform = platforms[i]
+ if (new RegExp(platform, 'i').test(repoHost)) {
+ return platform
+ }
+ }
+
+ return 'Source'
+ }
+ }
+}
+</script>
+
+<style lang="stylus">
+@import './styles/config.styl'
+
+.nav-links
+ display inline-block
+ a
+ line-height 1.4rem
+ color inherit
+ &:hover, &.router-link-active
+ color $accentColor
+ .nav-item
+ position relative
+ display inline-block
+ margin-left 1.5rem
+ line-height 2rem
+ &:first-child
+ margin-left 0
+ .repo-link
+ margin-left 1.5rem
+
+@media (max-width: $MQMobile)
+ .nav-links
+ .nav-item, .repo-link
+ margin-left 0
+
+@media (min-width: $MQMobile)
+ .nav-links a
+ &:hover, &.router-link-active
+ color $textColor
+ .nav-item > a:not(.external)
+ &:hover, &.router-link-active
+ margin-bottom -2px
+ border-bottom 2px solid lighten($accentColor, 8%)
+</style>