aboutsummaryrefslogtreecommitdiff
path: root/node_modules/vuepress/lib/default-theme/Sidebar.vue
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/vuepress/lib/default-theme/Sidebar.vue')
-rw-r--r--node_modules/vuepress/lib/default-theme/Sidebar.vue113
1 files changed, 113 insertions, 0 deletions
diff --git a/node_modules/vuepress/lib/default-theme/Sidebar.vue b/node_modules/vuepress/lib/default-theme/Sidebar.vue
new file mode 100644
index 00000000..7bcf0059
--- /dev/null
+++ b/node_modules/vuepress/lib/default-theme/Sidebar.vue
@@ -0,0 +1,113 @@
+<template>
+ <div class="sidebar">
+ <NavLinks/>
+ <slot name="top"/>
+ <ul class="sidebar-links" v-if="items.length">
+ <li v-for="(item, i) in items" :key="i">
+ <SidebarGroup
+ v-if="item.type === 'group'"
+ :item="item"
+ :first="i === 0"
+ :open="i === openGroupIndex"
+ :collapsable="item.collapsable || item.collapsible"
+ @toggle="toggleGroup(i)"
+ />
+ <SidebarLink v-else :item="item"/>
+ </li>
+ </ul>
+ <slot name="bottom"/>
+ </div>
+</template>
+
+<script>
+import SidebarGroup from './SidebarGroup.vue'
+import SidebarLink from './SidebarLink.vue'
+import NavLinks from './NavLinks.vue'
+import { isActive } from './util'
+
+export default {
+ components: { SidebarGroup, SidebarLink, NavLinks },
+
+ props: ['items'],
+
+ data () {
+ return {
+ openGroupIndex: 0
+ }
+ },
+
+ created () {
+ this.refreshIndex()
+ },
+
+ watch: {
+ '$route' () {
+ this.refreshIndex()
+ }
+ },
+
+ methods: {
+ refreshIndex () {
+ const index = resolveOpenGroupIndex(
+ this.$route,
+ this.items
+ )
+ if (index > -1) {
+ this.openGroupIndex = index
+ }
+ },
+
+ toggleGroup (index) {
+ this.openGroupIndex = index === this.openGroupIndex ? -1 : index
+ },
+
+ isActive (page) {
+ return isActive(this.$route, page.path)
+ }
+ }
+}
+
+function resolveOpenGroupIndex (route, items) {
+ for (let i = 0; i < items.length; i++) {
+ const item = items[i]
+ if (item.type === 'group' && item.children.some(c => isActive(route, c.path))) {
+ return i
+ }
+ }
+ return -1
+}
+</script>
+
+<style lang="stylus">
+@import './styles/config.styl'
+
+.sidebar
+ ul
+ padding 0
+ margin 0
+ list-style-type none
+ a
+ display inline-block
+ .nav-links
+ display none
+ border-bottom 1px solid $borderColor
+ padding 0.5rem 0 0.75rem 0
+ a
+ font-weight 600
+ .nav-item, .repo-link
+ display block
+ line-height 1.25rem
+ font-size 1.1em
+ padding 0.5rem 0 0.5rem 1.5rem
+ .sidebar-links
+ padding 1.5rem 0
+
+@media (max-width: $MQMobile)
+ .sidebar
+ .nav-links
+ display block
+ .dropdown-wrapper .nav-dropdown .dropdown-item a.router-link-active::after
+ top calc(1rem - 2px)
+ .sidebar-links
+ padding 1rem 0
+</style>